Web Page Usability

Determine User Goals Brainstorm: Brainstorm: Why would users come to your page? Why would users come to your page? What level of information will you deliver? What level of information will you deliver? What tasks will users have? What tasks will users have?

Write each task on a separate piece of paper or index card. Write each task on a separate piece of paper or index card. Create specific categories for these tasks. Create specific categories for these tasks. For tasks that fit under multiple categories, consider using a placeholder in other categories. For tasks that fit under multiple categories, consider using a placeholder in other categories.

Plan on one page per category. Plan on one page per category. Consider one page per task. Consider one page per task. Tradeoffs: Breadth versus Depth. Tradeoffs: Breadth versus Depth. Long individual pages. Long individual pages. Vs. Vs. Several clicks to reach information. Several clicks to reach information.

What do users want? Users look for different information: Users look for different information: Is this page on my topic? Is this page on my topic? General information on the topic. General information on the topic. Specific information on the topic. Specific information on the topic. Is this information trustworthy? Is this information trustworthy?

Level of interest No interest: No interest: This is not the page they’re looking for. This is not the page they’re looking for. Some interest: Some interest: Title only. Title only. One sentence summary One sentence summary One paragraph summary. One paragraph summary. Major points. Major points.

Strong interest: Strong interest: Minor points. Minor points. Will scan headers to get to information quickly. Will scan headers to get to information quickly. Detailed interest. Detailed interest. Written at more length, Written at more length, Can assume a focused audience. Can assume a focused audience. Hungry for more information. Hungry for more information. Link to authoritative and/or useful sources. Link to authoritative and/or useful sources.

What do users look for? Highlighted keywords. Highlighted keywords. Specific keywords and context. Specific keywords and context. Scannable, informative headers and sub-headers. Scannable, informative headers and sub-headers. Headers should describe the underlying text. Headers should describe the underlying text. Headers should include keywords. Headers should include keywords.

Bulleted lists. Bulleted lists. Users tend to look at bullet lists first. Users tend to look at bullet lists first. Keep these short, if possible. Keep these short, if possible. One idea per paragraph. One idea per paragraph. If you reference something complex, link it. If you reference something complex, link it.

Write concisely. Write concisely. Keep sentences simple and focused. Keep sentences simple and focused. Use about half the word count of conventional writing. Use about half the word count of conventional writing. Begin with the conclusion. Begin with the conclusion. Inverted-pyramid structure. Inverted-pyramid structure. Users typically don’t scroll down to find your point. Users typically don’t scroll down to find your point. Instead, they do another search to find an easier description. Instead, they do another search to find an easier description.

Language Choices There are often different terms for the same type of material. There are often different terms for the same type of material. Computational Biology or Bioinformatics? Computational Biology or Bioinformatics? Pick whatever is most widely used Pick whatever is most widely used Be consistent Be consistent Meta Description tags can be helpful Meta Description tags can be helpful When your page shows up in Search Results, it will list your descriptive statement. When your page shows up in Search Results, it will list your descriptive statement. Meta Keyword tags are ignored by most modern search engines Meta Keyword tags are ignored by most modern search engines

Localization Also known as Also known as Globalization, Internationalization, Glocalization Globalization, Internationalization, Glocalization Looking for readers outside the US? Looking for readers outside the US? Metric system vs. English Units Metric system vs. English Units Any regularly timed updates, list in GMT Any regularly timed updates, list in GMT Be aware of cultural issues Be aware of cultural issues PRC vs. ROC, etc. PRC vs. ROC, etc. You don’t have to change your content if you don’t want to – but be prepared for complaints. You don’t have to change your content if you don’t want to – but be prepared for complaints. You can’t make everyone happy. You can’t make everyone happy.

Credibility What makes a site seem trustworthy? What makes a site seem trustworthy? Style. Style. Is this site clear? Professional? Amateurish? Is this site clear? Professional? Amateurish? Emphasizing style over content can detract from your credibility. Emphasizing style over content can detract from your credibility. … but so can ignoring style considerations completely. … but so can ignoring style considerations completely. Credentials. Credentials. Who are you? What do you know about this topic? Who are you? What do you know about this topic? Disclosures. Disclosures. What are your limitations? What don’t you know? What are your limitations? What don’t you know?

Credibility Who links to your page? Who links to your page? Trustworthy sites? Trustworthy sites? Untrustworthy sites? Untrustworthy sites? You have limited control over this. You have limited control over this. What does your page link to? What does your page link to? Link to other quality information sources. Link to other quality information sources. Providing useful, on-topic outside links increases the value of your pages. Providing useful, on-topic outside links increases the value of your pages. Describe your links. Describe your links.

Be consistent. Be consistent. Keep the same style throughout. Keep the same style throughout. Give equal levels of information on different topics. Give equal levels of information on different topics. Stay current. Stay current. Outdated information lowers user confidence. Outdated information lowers user confidence. Highlight new developments visibly. Highlight new developments visibly.

User feedback Collect feedback from peers. Collect feedback from peers. Ask them to accomplish specific goals. Ask them to accomplish specific goals. Accept feedback from visitors. Accept feedback from visitors. Be aware that negative responses often outnumber positive ones. Be aware that negative responses often outnumber positive ones. Also, negative feedback is typically more specific. Also, negative feedback is typically more specific. Don’t be offended. But take note of common problems. Don’t be offended. But take note of common problems.

Navigation Make it easy to get from the central page to sub-pages, and from sub-pages to the central page. Make it easy to get from the central page to sub-pages, and from sub-pages to the central page. Header and/or footer links Header and/or footer links Sidebar navigation Sidebar navigation Keep Navigation predictable: Call Home “Home” not “Beginning” Keep Navigation predictable: Call Home “Home” not “Beginning” Label links clearly – describe where the link leads. Label links clearly – describe where the link leads.

Navigation Useful links: Useful links: Home Home FAQ FAQ Search Search About Me/Us About Me/Us Contact Us Contact Us What’s New What’s New Help Help Location: Location: Right/Left sidebars take up more screen space than Header/Footer. Right/Left sidebars take up more screen space than Header/Footer.

For the 285 Web Assignment Page should include: Page should include: A clear purpose A clear purpose A homepage linked to a few sub-pages A homepage linked to a few sub-pages Content should be task-related Content should be task-related An “About Me” page An “About Me” page A contact/feedback page A contact/feedback page (An link or feedback form) (An link or feedback form)

Useful tools Web-page generators: Web-page generators: Dreamweaver Dreamweaver Microsoft Expressions Microsoft Expressions Kompozer (freeware) Kompozer (freeware) Google Page Generator (free, user-friendly) Google Page Generator (free, user-friendly)

Credits: Web writing for Many Interest Levels - Nathan Wallace, Web writing for Many Interest Levels - Nathan Wallace, many-interest-levels.phtml many-interest-levels.phtml Writing for the Web - Jakob Nielson, Writing for the Web - Jakob Nielson,