Busy. Please wait.
or

show password
Forgot Password?

Don't have an account?  Sign up 
or

Username is available taken
show password

why


Make sure to remember your password. If you forget it there is no way for StudyStack to send you a reset link. You would need to create a new account.
We do not share your email address with others. It is only used to allow you to reset your password. For details read our Privacy Policy and Terms of Service.


Already a StudyStack user? Log In

Reset Password
Enter the associated with your account, and we'll email you a link to reset your password.
Don't know
Know
remaining cards
Save
0:01
To flip the current card, click it or press the Spacebar key.  To move the current card to one of the three colored boxes, click on the box.  You may also press the UP ARROW key to move the card to the "Know" box, the DOWN ARROW key to move the card to the "Don't know" box, or the RIGHT ARROW key to move the card to the Remaining box.  You may also click on the card displayed in any of the three boxes to bring that card back to the center.

Pass complete!

"Know" box contains:
Time elapsed:
Retries:
restart all cards
share
Embed Code - If you would like this activity on your web page, copy the script below and paste it into your web page.

  Normal Size     Small Size show me how

Intro. Test 1

Introduction to Experience & Design

QuestionAnswer
Internet A series of interconnected computers, called servers, that enables companies, and individuals to share information on a world wide scale
Servers Series of interconnected computers
Color Depth Number of colors that a monitor is able to display. Number depends on the video card in computer and monitor
Web Safe Palette Limited to 216 color palettes. In the past, only 256 colors could be displayed
Monitor Resolution The number of pixels when measured horizontally and vertically on the monitor
Monitors today 1024x768px or higher. (some will display 800x600 or even 640x480)
50px or so are subtracted from overall width for Scroll bars and borders on browser windows
Operating System (OS) main difference is their ability to anti-alias type. Limits available certain web browsers
Anti-Alias type Looks smoother because the system creates a slight blur effect around each character
Non-Anti-Aliased type Can be jagged or "pixelated'
Browser Type Primary used= safari, chrome, FIREFOX, explorer
Web Browser Application whose function is to receive layout and styling information from a host and display information on screen
Mobile Browsers Use low-bandwidth methods to connect to the web
Design A plan, something happens on purpose
Design Plan Series of decisions made by a designer to create a final piece
Web Standards Do's and Don'ts for designers
Design is about... Web design is a... Having a plan, A backup plan
Designers familiar with print designing are used to controlling things like... Fonts, color, page size
Web colors use____ spectrum Additive, (RGB, create white)
Printing process use ____ spectrum Subtractive, (CMYK, create black)
Using text images (live text) allows you to Have complete control of the type on your site
2 main issues with live text takes longer to download with text, more images= longer, search engines can't read the content of an image, so search engine ranks can be hurt
French Spacing two spaces after a sentence (not possible on web)
Good web design is an Experience
1993:___, the 1st consumer web-browsing application released Mosaic
<BR> line break
<B> bold
<P> paragraph
<A> link
<ol> ordered list
<ul> unordered list
How pages are viewed western culture: left to right, top to bottom, most important position is the upper left of a web page
Fold on a webpage Line that delineates where the browser window cuts off the content
1st to use tabs on a web page Amazon.com
Search Engine Optimization (SEO) Having a high search engine rank is critical to company's online success (higher rank, more traffic)
Design factors that influence optimization of a page: Text links in main navigation, multiple keyword-righ text, use of images, bold subhead copy, above the fold
Interactive Advertising Bureau (IAB) established 1996, set up practices in web advertising: sets rules for size, shape, file wight for advertising assets
Header remains similar at the top of each website, unifies all pages together, establish brand use without over powering webpages
Page title Line of copy at the top of the browser window. Contains main navigation around the site
Feature Area clearly defined hierarchy of information, use focal point seen before all others. Takes up large portion of home page
Body/ Content where users spend most of their time
Web pages don't have height or width limits: 2 options for width variability- set size of width frame boundary, set variable width columns
Optimal line length 52-65 characters, 12-15 words, prevents eye fatigue
Sidebar contains secondary information, supports main content, sold for advertising
Background used to create depth or dimension
HTTP stands for HyperText Transfer Protocol
Design System takes precedence over the individual elements so that the user perceives a cohesive unit
Visual Hierarchy the sequence of elements within a design
White Space whats left over
Figure-ground-relationship interplay between the objects of a design and the background
White space design elements: Margins, Gutters, Padding, Line Spacing, Paragraph Spacing
Margins area surrounding a design
Gutters space between columns of a grid
Padding area around an element contained by a border
Line Spacing leading, space from baseline to cap height between lines of text
Paragraph Spacing adding line space is the most common form
Containment borders, lines, boxes can define space
Grids create balance, organize elements of design, organize space within a design
Most web grids are between 950-990px
Width is 25-50px less because accommodate for browser elements like scroll bars
Column width for grid= overall width divided by the number of columns
Baseline grid horizontal grid system that exactly aligns the baselines of all the text on a page, regardless of size or style
Modularity creating reusable design assets that fit within the established grid system and get reused throughout a site- flexibility
Design Style attempt at connecting with a users sensibilities and a basic need to relate to things
Elements of design style color, texture, typography, imagery. creating a sense of scale or depth; animation; and variation
Color ability to guide, direct, persuade, appeal to a users emotions by setting a mood or tone for piece of design
Color has 3 main properties Hue, value, saturation
Variability speed at which a web designer can apply changes, combined with the need to continually refresh the look of a site
Keep site fresh by... updating its content. flash intro can give users impression tat site is up to date.
Font stacking browser looks for fontface, then looks for an alternative: preferred-alternate-common-general
Readability refers to how well type can attract a reader
Legibility references the ease with a reader
Space is measured in em units
em square unit that represents the distance between baselines when type is set without line spacing or leading
Rendering type using images to display type
Web safe fonts displaying contents as live text-rendered by the user
Live text less control to the designer, more control to user
Font complete set of characters that makes up a single size, style and weight of typeface
Typeface unique styling applied to a set of glyphs
Cufon converting font information into VML (Vector Markup Language)
Project Planning phase of creating a website including research and discovery; site mapping; wireframing; usability mapping; prototyping and design concepting
(ROI) Return on investments
(SOW) Scope of work for the project
Usability measure of the ease of use for a site
Process of developing a plan starts with this: Research and Discovery. client goals and analysis of landscape
(SWOT) Strengths, weakness, opportunity, threats
Creative Brief outlines the goals for a project, the special considerations that team must schedule of milestone events.
Brief usually reviewed by team and client and signed off, forming directional foundation for the project
Copy: who provides copy? is there a budget for a copywriter? what are the copy mandatories? whats the correct tone for the audience and brand?
Imagery & Artwork: is there existing imagery? if yes, what format and resolution is it? is there a budget for a photo shoot? is there a stock photo budget? are any custom illustrations needed?
Code: what can be reused, if any? does this require custom programming or an off-the shelf solution? will there be a content management system (CMS)? who will manage the content?
Sitemap a schematic for a site showing he pages and the linked relationships among them
Wireframes blueprints that map out individual pages. shows the elements of a page and their relative weight or importance
Functional Prototypes working models of site features or functionality that help developer and a design work out the final details and provide proof of concept
Skinning to add a design treatment on top of a working model
Navigation encompasses any aspect of a site that links a user to another area of the site and is the cornerstone of a sites usabiltiy
Four states to a navigation bar: dormant or static state, active state, rollover state, visited state
Breadcrumbs useful subset of navigation. links reveal to the user, the path taken through the current page- easier to go back
Indicator bar something used across the top of a form to reveal the number of steps in the process
Text Links granular level of navigation is helpful to users who want to know more about a specific idea
Site search quickest way to allow users to find information on a website
Search forms search a database of site content and display the results for the user, linking them directly to the item they were looking for
Search box increases usability, should be easy to find. place it above the fold
Usability testing consists of inviting potential users to complete a series of tasks using the interface concept, helps refine usability elements of a site
Article page a mechanism that allows users to rate relevance and quality of article based on users search criteria
Submission forms where a user inputs information and submits it to the site, generally representing a goal for the site- inviting user to sign up for a news letter (important)
Form series of fields that a user fills out with information- should be clearly labeled information
Radio buttons only one checked
Checkboxes more than one option
Error Messages on submission forms, when info isn't filled out right, this will pop up
"404 Page Not Found" error message, when URL no longer exists or never did
Surprise and delight fun or unexpected parts of a web page, added value for user
Created by: Meg0301