1. Introduction to Web Design
Technology II
Mrs. Huddleston

2. Huddleston - Introduction to Web Design
DEFINE THE SITE
Determine the purpose.
Is the site the best medium to serve the purpose?
Who will the audience be?
What type of language will appeal to the audience?
Is it possible to expand the site? If yes, how far? If no, why not?
How often will it need to be updated? Next
Huddleston - Introduction to Web Design

3. Huddleston - Introduction to Web Design
Medium
Medium—a method of getting your information across to other people
Examples:
Newspaper, magazine, brochure, flyer, blogs
Telephone, radio, TV, billboards
Word of mouth
Back
Huddleston - Introduction to Web Design

4. Huddleston - Introduction to Web Design
IDENTIFY THE AUDIENCE
Age
Gender
Race
Religion
Technical Level
Nationality
Language
Political Affiliation
Education
Marital Status
Back
Huddleston - Introduction to Web Design

5. CHOOSE A PRESENTATION FORMAT
Linear
Sequential: only 1 logical way to move through the site
Best for training materials
Page 1
Page 2
Page 3
Page 4
Huddleston - Introduction to Web Design

6. CHOOSE A PRESENTATION FORMAT
Hierarchical
Allows user more freedom in navigation
Can navigate through site in many logical ways
Huddleston - Introduction to Web Design

7. CHOOSE A PRESENTATION FORMAT
Combination of Linear and Hierarchical
Shipping
Address
Billing
Address
Credit
Card
Confirmation
Huddleston - Introduction to Web Design

8. Huddleston - Introduction to Web Design
WHY DO VISITORS LEAVE?
Loading time is too long
Has no useful information or clear purpose
Pop Ups
Unclear navigation/confusing
Links don’t work properly
Poorly laid out and/or poorly written
Huddleston - Introduction to Web Design

9. Huddleston - Introduction to Web Design
REASONS VISITORS STAY
Loads quickly
Site purpose immediately and clearly identified
Site is well laid out and well written
Links work correctly
No pop ups
Huddleston - Introduction to Web Design

10. Tips for Quality Pages

11. Huddleston - Introduction to Web Design
AVOID EXTREMES
Large (slow loading) image
Too many fonts
Use only commonly accepted fonts. The more obscure or exotic the font, the less likely viewers will have it loaded on their computers.
Too much text
Huddleston - Introduction to Web Design

12. Huddleston - Introduction to Web Design
FIND A “HOOK”
Hook—Something to keep visitors coming back on a regular basis.
Examples
Contests
Daily drawings
Joke of the day
Huddleston - Introduction to Web Design

13. TITLE EACH PAGE CAREFULLY
Should convey the purpose of each page
What uses the title?
Search engines use titles
Browsers use title to “Bookmark”
User history recorded through titles
Next
Huddleston - Introduction to Web Design

14. Huddleston - Introduction to Web Design
TITLES
The blue bar at the very top of the browser display area contains the title
In this example, the title is “Welcome to Franklin Road Academy – Microsoft Internet Explorer”
Back
Huddleston - Introduction to Web Design

15. TO SCROLL OR NOT TO SCROLL?
Home page should have no scrolling if possible
Avoid long pages requiring a lot of scrolling
Avoid horizontal scrolling
Huddleston - Introduction to Web Design

16. Huddleston - Introduction to Web Design
LINKS
Keep link colors at default (if possible)
Blue is the color of unvisited links
Purple is the color of visited links
Save underlining for links only
Keep navigation controls uniform in appearance and location
Links go across top or down left side of pages
Huddleston - Introduction to Web Design

17. Huddleston - Introduction to Web Design
TEXT HEAVY?
Use white space, graphics, borders, etc.
White Space: space on a page with no content
Split long pages into smaller pages
Don’t overload on images and animations just to fill space.
Huddleston - Introduction to Web Design

18. Huddleston - Introduction to Web Design
IMAGES
Use small images
Use alternate text with each graphic, animation, image, etc.
Logos go in upper left corner of pages
Huddleston - Introduction to Web Design

19. Huddleston - Introduction to Web Design
TIPS FOR TESTING PAGES
Test each page using default settings on
Internet Explorer
Firefox
Chrome
Print hard copies and proofread them
Get user feedback (include a “mail to” link)
Huddleston - Introduction to Web Design

20. MORE TIPS FOR TESTING PAGES
Test the download time of each page
Different ISPs
Different locations
Different types of connections
When everything works, test it again.
Huddleston - Introduction to Web Design