![Craft for Look and Feel ,[object Object],[object Object],[object Object]](data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7)
Recomendados
Más contenido relacionado
La actualidad más candente
La actualidad más candente (20)
Similar a Web site design
Similar a Web site design (20)
Último
Último (20)
Web site design
- 1. Web Site Design Design for the Computer Medium
- 8. Navigation is clear, easy to read Contains sub- topics Popular links on every page Text legible online Active white space
- 16. Active White Space Passive White space
- 25. 5 4 2 3 1
- 26. Design for Location 2 3 4 1 5
- 27. Guide the Users Eyes
Notas del editor
- Remember not everything will work with older browsers Ex. CSS will not work in Netscape 4.75 and below Provide links on your page for the user to update their software Ex. Shcokwave, Flash, Browser links Think about people who would visit your site and the tech. They would have
- Image intensive site Total graphics add up to 84 kb. Slow download on a 56 kbps connection
- Provide multiple sets of links in different locations on your site Always provide alternative links to image maps Some folks are leisurely browsing your site while others are Looking for specific info. quickly like phone numbers.
- Reading from the screen tires the eyes because it it back lit. Glare can be a factor Most people read 50% as fast on the computer screen Seven(plus or minus two) rule A well written procedure will contain no more than 9 steps A name=
- Why would someone visit this page? Who would visit? Text filled page Very restrained Very informational Clear presentation Abundant navigation Clear headings Business oriented layout, fonts, and graphics Newspaper feel, Linear flow( Up/down) left/right
- Same agency made this site Bright colors Friendly font Dynaic structure Eyecatching graphics Livelier and playful Why is this site different?
- Lines show table layout
- Can make info. hard to find Reduces clutter on the page
- Note White space between columns Note white space between navigation and rest of page White space around each block of text.
- Who is the target audience? No ads, no links Get straight to the point - searching
- Who is the target audience? Has a lot of stuff to draw the users eye Like TV
- Who is the target Audience? Looks like a magazine. Lots of text but well organized Note White space. Looks like print page but uses color and linking/
- This page is designed for scanning Note four column headings main features Note eh abstracts for the reading available online Click on picture to go to site
- Page designed for reading Can click on screen to go to web site 2 column layout allows more space for main article Note side links to related content
- 1 – Newest content and feature info. Can click on picture to go to site 2. Company logo and main navigation 3. Featured content that changes often 4. Reading content 5. Secondary navigation
- Relative areas of screen importance
- Traditional, left to right eye movement
- Landscape display like a TV screen
- Use text weight and color to control user eye movements Use Hort. Rules and white space effectly
- Can click pic to go to site map.
- Can click on image to go to page Note links in the text
- Yahoo offers a dizzying array of info. on one page.
- Remember Site Development Foundations manual Lessons 1 and 2 Bobby checks your code for WAI compliance Most sites fail this test. Can be run on or off line
- Example of normal site versus text based version
- Books reflect light back to your eye 600 dpi is fine for laser printers but a computer screen is only 72 dpi so text can look grainy Italic text will be hard to read. Use it only for emphasis
- Web page created like a book or print material
- Can click on pic to go to site