Today’s Web: collaboration between design, interaction, and IA

We are now in a “stage of Web-evolution where it is clear that a good Web-experience is the result of mutual collaboration between presentation, interaction, and organization considerations.”

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds, p.12

Today’s Web: collaboration between design, interaction, and IA

We are now in a “stage of Web-evolution where it is clear that a good Web-experience is the result of mutual collaboration between presentation, interaction, and organization considerations.”

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds, p.12

Page hierarchy

“We use visual relationships to add more or less visual weight to
our elements. Visual weight can be loosely defined as the degree
to which an element demands our attention and keeps our
interest.” (aka visual hierarchy)

Content

1. page title
2. subsection title
3. embedded link
4. supplementary info

Navigation

1. Location indicator
2. top level menu options
3. subnavigation options
4. trace route (breadcrumbs)

Supportive

1. Site identifier
2. site-wide utilities
3. footer information (poracy, security, content and
   copyright info)

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds, p.160

Isomorphic correspondence

Isomorphic correspondence is similar to what Norman calls affordances

“the relationship between the appearance of a visual form and a
comparable human behaviour.”

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds, p.137

Web standards

1. All web pages should contain: title, site-identifier with link to
   home page, update date, navigation, contact, content p.120
2. Standards “allow graceful degradation” apparently goes back to Jeffrey
   VEEN, The Art and Science of Web Design, 2000, New Riders
3. Why it’s good to stick to conventions and difficult to create new
   communicational clues p.94 (sidebar)

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds

Webmarks

Analogy to landmark, i.e. objects in the website that give you a sense of direction; [webmarks] “can serve as visual clues to jog your memory and let you know you’re on the right track when you try to find content you have located before.”

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds, p.60

Sensible navigation

“Any useful system for finding your way around, whether in a Web-Site or a city, should allow you to backtrack, plot your next move, and understand your position.”

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds, p.48

Site categories

• Categories reinforce the relationship between information p.40
• Categorisation might conflict with different interests
• “Most categorisation moves from general to specific.” p.38; “Organizing information from general to specific also carries the benefit of progressive disclosure.” p.39; “progressing disclosure provides you with the portion of information you want when you’re ready for it.”

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds

Effective Website presentation

Effective Web Site presentation can

1. provide situated awareness (establish a sense of place)
2. provide emotional impact
3. engage and invite users
4. explain organisation
5. guide users through content and sequences
6. maintain consistency
7. educate users
8. establish relationship between content elements

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds

Wroblewski’s History of the Web

1. The simple sharing era
2. The image and table era
3. The design intro era
4. The techno-hype era (“the teenage years” p.09)
5. The usability era: “On the advice of these frustrated users, Web sites began
   focussing on clarity, efficiency, and customer satisfaction.
   Within a usable Web site, customers can accomplisch
   theirgoals easily and leave happily.” p.10-11
6. The speaking Web

From: Wroblewski, Luke (2002), Site-Seeing: A Visual Approach to Web-Usability, New York: Hungry Minds