SPONSORED BY
Make Your Website Work Harder Michael Gold, Principal West Gold Editorial Consulting www.westgoldeditorial.com
Agenda • • • • •
Getting to know you: a poll What’s a Web site supposed to do? 10 rules Examples: the good, the bad, the… Questions: halfway through, and at the end
copyright 2003 West Gold Editorial
Poll question #1:
Please describe your organization Individual or small-to-medium business Corporation or large company Non-profit, academic, or association Governmental Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
Poll question #1:
Please describe your organization 32%
Individual or small-to-medium business 13
15%
Corporation or large company 6
52%
Non-profit, academic, or association 21
Governmental Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
0
Poll question #2:
How long have you had your Web site (any version of it)? One year or less More than one year, less than five More than five years, less than 10 More than 10 years Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
Poll question #2:
How long have you had your Web site (any version of it)? 9%
One year or less 4
42%
More than one year, less than five 18
47%
More than five years, less than 10 20
More than 10 years Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
0
Poll question #3:
How well does your site work? Very well Okay, but could be better Not well, needs a major overhaul No opinion (hint: don’t choose this reply) Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
Poll question #3:
How well does your site work? 9%
Very well 4
78%
Okay, but could be better 33
11%
Not well, needs a major overhaul 5
No opinion (hint: don’t choose this reply) Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
0
Work Harder at What? What’s a Web Site Supposed to Do? For You
For Site Visitors
• Attract customers, constituents • Sell products, deliver service, spread your message • Save time and money
•
• •
Perform tasks, complete missions (they’re do-ers, not readers) Save time Stay oriented (they’re easily lost)
copyright 2003 West Gold Editorial
Rules For a Hard-Working Site 1. 2. 3. 4. 5. 6. 7. 8. 9. 10.
Home page informs and serves The site is speedy Good stuff sits above the fold Lives by the rule of 7s The labels inform, in plain English Navigation is sensible, conventional Signposts are clear Text content is “webified” Not for geeks Regularly checked and repaired copyright 2003 West Gold Editorial
Rules 1-4 1. Home page informs and serves •
Use a tag line and/or intro to define the organization and say what users can do on the site.
•
Give direct access to key content and make “hot buttons” prominent.
2. The site is speedy •
Pages load quickly even at dial-up speeds (70% of online households).
•
No gratuitous graphics.
•
No time-wasting multimedia shows leading to “Enter.”
3. Good stuff sits above the fold •
Key content and functions are visible in first screenful (even at 800 x 600, resolution at which half of all pages are viewed).
•
Avoid deep logos, banners, and nav bars that push content out of sight.
4. Obey the rule of 7s •
Organize everything into “chunks” of no more than 7 elements (+ or – 2): navigational choices, categories, lists of links, groupings of content, etc. copyright 2003 West Gold Editorial
A Slow, Puzzling Start _ Opening “show” takes 30 seconds. _ Bewilderingly, the little red disc spawns new orbs that float around the screen. _ No clear tag line explaining what this site offers, what users can do. copyright 2003 West Gold Editorial
Quikbook _ Good tag line, tells users what they can do. _ “Hot button” (booking a room) is prominent. _ Important stuff is visible above the fold.
copyright 2003 West Gold Editorial
Cancer Society _
Different users (patients, survivors, pros…) see their needs being met.
_
Direct access to key content.
_
Clear link descriptions.
_
Another good tag line. copyright 2003 West Gold Editorial
Cooking Light _
Recipe database, a real hot button, is conspicuous and accessible on home page.
_
Too bad it’s called “Kitchen Assistant.” Used to have a more informative name: “Recipe Finder.”
_ Obeys rule of 7s.
copyright 2003 West Gold Editorial
Smithsonian National Museum of American History
_ Site’s main navigation is buried at bottom of page—below fold, at common screen resolution settings.
copyright 2003 West Gold Editorial
HealthWorld _
Exceeding the rule of 7s.
_
Too many headings, too many elements in categories.
_
Needs to be reorganized into a manageable number of “chunks.”
copyright 2003 West Gold Editorial
Rules 1-4 1. Home page informs and serves •
Use a tag line and/or intro to define the organization and say what users can do on the site.
•
Give direct access to key content and make “hot buttons” prominent.
2. The site is speedy •
Pages load quickly even at dial-up speeds (70% of online households).
•
No gratuitous graphics.
•
No time-wasting multimedia shows leading to “Enter.”
3. Good stuff sits above the fold •
Key content and functions are visible in first screenful (even at 800 x 600, resolution at which half of all pages are viewed).
•
Avoid deep logos, banners, and nav bars that push content out of sight.
4. Obey the rule of 7s •
Organize everything into “chunks” of no more than 7 elements (+ or – 2): navigational choices, categories, lists of links, groupings of content, etc. copyright 2003 West Gold Editorial
Any Questions? 1. Home page informs and serves 2. The site is speedy 3. Good stuff sits above the fold 4. Lives by the rule of 7s
copyright 2003 West Gold Editorial
Rules 5-7 5. Labels inform, using plain language •
All labels are straightforward (not overly clever), using language of the users (not organization’s internal lingo, not geek-speak).
•
For links, concrete labels make it clear why the user should click. Avoid the vague and generic: “next,” “previous,” “article….”
6. Navigation is sensible, conventional •
Don’t force users to learn a new scheme. Stick with: main nav at top or in side column; links underlined or otherwise recognizable; logo in upper left goes Home. Avoid: “mystery nav” and “logo nav.”
•
Keep nav scheme consistent from page to page.
•
Organize info the way the user would think to look for it; offer many ways to seek it.
7. Signposts are clear •
Users are well oriented on every page, no matter how they arrive. Nav, bread-crumb trails, titles signal “you are here.” No orphan pages.
•
Users Can always go “Back” and “Home.” copyright 2003 West Gold Editorial
WebMonkey _ Clear labels for links. _ Clear, engaging text descriptions under links. _ Together, these make path ahead clear and give users a reason to click.
copyright 2003 West Gold Editorial
Half.com _ Consistent layout and navigation scheme from one area (“Music,” “Books,” etc.) to the next.
copyright 2003 West Gold Editorial
Skoda Cars _ “Mystery navigation” forces users to remember the hidden labels. _ Unconventional behavior is unsettling.
copyright 2003 West Gold Editorial
PC World _ Clear signposts. _ Highlighted words in top and side nav bar show current location. _ “Breadcrumb trail,” clear headline, and page-number links add orientation and control. copyright 2003 West Gold Editorial
Labels That Obscure Why would a user click on any of these uninformative links?
copyright 2003 West Gold Editorial
Blurred Navigation Here’s an interesting (self-defeating) scheme: Signal the user’s location by blurring the relevant label.
copyright 2003 West Gold Editorial
Rules 8-10 8. Text content is “webified” •
Present text in scannable bite-sized bits, formatted with bullets and bolding. Cut long text into sections that can be easily navigated.
•
Bring bottom-line info to the top.
•
Provide e-functions (notify me, printer-friendly, e-mail to a friend, etc.).
9. Not for geeks •
Don’t force users to jump through technical hoops: frames, horizontal scrolling, download and install plug-ins.
•
Keep users informed about progress with status bars and confirmation messages (“your information is now loading”).
•
Help users recover from errors and deal with warning messages.
10. Regularly checked and repaired •
Keep the site free of broken links, missing graphics, non-working functions.
•
Keep time-sensitive information up to date. copyright 2003 West Gold Editorial
National Academy of Sciences _ “Webifying” content from a print publication. _ Text carved into manageable chunks that the user can easily navigate via mini TOC box to right of text. _ E-functions in top right box provide similar articles, citation info, etc.
copyright 2003 West Gold Editorial
Amazon.com _ Helps users recover from errors. _ User mistakenly searches Agatha “Chrostie.” _ Amazon displays results for Agatha “Christie.”
copyright 2003 West Gold Editorial
RECAP
Rules For a Hard-Working Site 1. 2. 3. 4. 5. 6. 7. 8. 9. 10.
Home page informs and serves The site is speedy Good stuff sits above the fold Lives by the rule of 7s Labels inform, using plain language Text content is “webified” Navigation is sensible, conventional Signposts are clear Not for geeks Regularly checked and repaired copyright 2003 West Gold Editorial
Weird Navigation Home page of the Anthrax Vaccine Immunization Program. It’s cool, it’s space-agey, and it’s sure to frustrate most viewers.
copyright 2003 West Gold Editorial
RECAP
Rules For a Hard-Working Site • • • • • • • • • •
Home page informs and serves The site is speedy Good stuff sits above the fold Lives by the rule of 7s Labels inform, using plain language Text content is “webified” Navigation is sensible, conventional Signposts are clear Not for geeks Regularly checked and repaired copyright 2003 West Gold Editorial
Poll question #4:
Now, how well do you think your site works? Very well Okay, but could be better Not well, needs a major overhaul
Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
Poll question #4:
Now, how well do you think your site works? 23%
Very well 10
59%
Okay, but could be better 25
16%
Not well, needs a major overhaul 7
Poll Closed: Results from Original Seminar
copyright 2003 West Gold Editorial
Thanks. Any Questions? Some of the pages we looked at today – – – – – – – – – – – –
360 Degrees (floating orbs): http://www.360degrees.org/360degrees.html Quikbook: http://www.quikbook.com/ American Cancer Society: http://www.cancer.org/docroot/home/index.asp FedEx: http://www.fedex.com/us/ National Museum of American History: http://americanhistory.si.edu/youmus/index.htm HealthWorld: http://www.healthy.net/ WebMonkey: http://hotwired.lycos.com/webmonkey/authoring/html_basics/ Half.com: http://half.ebay.com/products/music/index.cfm Skoda: http://www.skoda.co.uk/# PC World.com: http://www.pcworld.com/reviews/bguide/0,guid,14,page,2,00.asp Proceedings of National Acad. Of Sciences: http://www.pnas.org/cgi/content/full/98/3/797 Amazon: http://www.amazon.com
Other useful resources • • •
Web pages that suck: http:// www.webpagesthatsuck.com/dailysucker/ Jakob Nielsen’s site on usability: http://www.useit.com/ West Gold Editorial: http:// www.westgoldeditorial.com/resources copyright 2003 West Gold Editorial