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.

Web Page Web Page UsabilityUsability

Determine User GoalsDetermine User Goals

Brainstorm:Brainstorm:

Why would users come to your page?Why would users come to your page?

What level of information will you What level of information will you deliver?deliver?

What tasks will users have?What tasks will users have?

Write each task on a separate piece Write each task on a separate piece of paper or index card.of paper or index card.

Create specific categories for these Create specific categories for these tasks.tasks. For tasks that fit under multiple For tasks that fit under multiple

categories, consider using a placeholder categories, consider using a placeholder in other categories.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?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 interestLevel 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 summaryOne 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 Will scan headers to get to information quickly.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?What do users look for?

Highlighted keywords.Highlighted keywords. Specific keywords and context.Specific keywords and context.

Scannable, informative headers and Scannable, informative headers and sub-headers.sub-headers. Headers should describe the underlying Headers should describe the underlying

text.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, If you reference something complex,

link it.link it.

Write concisely.Write concisely. Keep sentences simple and focused.Keep sentences simple and focused. Use about half the word count of conventional Use about half the word count of conventional

writing.writing.

Begin with the conclusion.Begin with the conclusion. Inverted-pyramid structure.Inverted-pyramid structure. Users typically don’t scroll down to find your Users typically don’t scroll down to find your

point.point. Instead, they do another search to find an easier Instead, they do another search to find an easier

description.description.

Language ChoicesLanguage Choices There are often different terms for the There are often different terms for the

same type of material.same type of material. Computational Biology or Bioinformatics?Computational Biology or Bioinformatics? Pick whatever is most widely usedPick whatever is most widely used Be consistentBe consistent Meta Description tags can be helpfulMeta Description tags can be helpful

When your page shows up in Search Results, it will When your page shows up in Search Results, it will list your descriptive statement.list your descriptive statement.

<META NAME=“Description” CONTENT=“Your <META NAME=“Description” CONTENT=“Your descriptive statement goes here.”>descriptive statement goes here.”>

Meta Keyword tags are ignored by most Meta Keyword tags are ignored by most modern search enginesmodern search engines

LocalizationLocalization

Also known asAlso known as Globalization, Internationalization, Globalization, Internationalization,

GlocalizationGlocalization Looking for readers outside the US?Looking for readers outside the US?

Metric system vs. English UnitsMetric system vs. English Units Any regularly timed updates, list in GMTAny regularly timed updates, list in GMT Be aware of cultural issuesBe aware of cultural issues

PRC vs. ROC, etc.PRC vs. ROC, etc. You don’t have to change your content if you You don’t have to change your content if you

don’t want to – but be prepared for complaints.don’t want to – but be prepared for complaints. You can’t make everyone happy.You can’t make everyone happy.

CredibilityCredibility 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 Emphasizing style over content can detract from

your credibility.your credibility. … … but so can ignoring style considerations but so can ignoring style considerations

completely.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 What are your limitations? What don’tdon’t you know? you know?

CredibilityCredibility

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 Providing useful, on-topic outside links increases the value of your pages.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 Give equal levels of information on

different topics.different topics.

Stay current.Stay current. Outdated information lowers user Outdated information lowers user

confidence.confidence. Highlight new developments visibly.Highlight new developments visibly.

User feedbackUser 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 Be aware that negative responses often

outnumber positive ones.outnumber positive ones. Also, negative feedback is typically more Also, negative feedback is typically more

specific.specific. Don’t be offended. But take note of common Don’t be offended. But take note of common

problems.problems.

NavigationNavigation

Make it easy to get from the central page to Make it easy to get from the central page to sub-pages, and from sub-pages to the central sub-pages, and from sub-pages to the central page.page. Header and/or footer linksHeader and/or footer links Sidebar navigationSidebar navigation

Keep Navigation predictable: Call Home Keep Navigation predictable: Call Home “Home” not “Beginning”“Home” not “Beginning”

Label links clearly – describe where the link Label links clearly – describe where the link leads.leads.

NavigationNavigation Useful links:Useful links:

HomeHome FAQFAQ SearchSearch About Me/UsAbout Me/Us Contact UsContact Us What’s NewWhat’s New HelpHelp

Location: Location: Right/Left sidebars take up more screen space Right/Left sidebars take up more screen space

than Header/Footer.than Header/Footer.

For the 285 Web For the 285 Web AssignmentAssignment

Page should include:Page should include: A clear purposeA clear purpose A homepage linked to a few sub-pagesA homepage linked to a few sub-pages

Content should be task-relatedContent should be task-related An “About Me” pageAn “About Me” page A contact/feedback pageA contact/feedback page

(An email link or feedback form)(An email link or feedback form)

Useful toolsUseful tools

Web-page generators:Web-page generators: DreamweaverDreamweaver Microsoft ExpressionsMicrosoft Expressions Kompozer (freeware)Kompozer (freeware) Google Page Generator (free, user-Google Page Generator (free, user-

friendly)friendly)

Credits:Credits:

Web writing for Many Interest Web writing for Many Interest Levels - Nathan Wallace, 1999.Levels - Nathan Wallace, 1999. http://www.e-gineer.com/articles/web-http://www.e-gineer.com/articles/web-

writing-for-many-interest-levels.phtmlwriting-for-many-interest-levels.phtml

Writing for the Web - Jakob Nielson, Writing for the Web - Jakob Nielson, 2003.2003. http://www.useit.com/papers/http://www.useit.com/papers/

webwriting/webwriting/