Help
Options
Didn't know it?
click below
click below
Knew it?
click below
click below
Don't Know
Remaining cards (0)
Know
retry
shuffle
restart
0:00
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
Normal Size Small Size show me how
Intro. Test 1
Introduction to Experience & Design
| Question | Answer |
|---|---|
| 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
Popular Graphic Arts sets