WEB 200: Week 03

Week 3: Jan 16 and Jan 18

Lecture: Information architecture
Reading: Chapter 6, Krug;  Card sorting, Usability.gov; Affinity diagrams, Usability Body of Knowledge



We’ll review/discuss the process and results.

Now, go to Seattle.gov on your computers and poke around, explore. THEN do the same thing on your phones! Ask yourself, when might people be accessing the site from a phone, when from a computer (what tasks)?

After you’ve spent a little bit of time on the site, write a one or two sentence statement of purpose/mission statement for the website. Do you need a different mission statement for mobile from desktop? I’d like you to post your statement in Slack, please (channel is #in-class-18jan). We’ll pair-and-share and then talk as a group.

How do these two exercises help  you (a) think about the audience for the website and (b) consider what the users want from the site, both when accessed on desktop and mobile?

mobile view of seattle.gov home

Watch this YT video about SMART goals.

Assume you’re the communications person in charge of the Seattle.gov website. What might be annual (measurable) goals for the website? Remember SMART goals are

  • specific
  • measurable
  • achievable
  • results-focused and
  • timebound

Find at least two government websites that might be considered “competitors” — in this case, not literally! The government body should be similar in scope (think population – 700,000 – and services). Post your competitor links on Slack as a separate entry (but the same channel).





Assignment discussion

Take about 15 minutes to look at the four student sites in on our staging area page that have completed the assignment. Think about how your peers approached the assignment, relative to how you approached it.

  • In small groups (three) discuss the different approaches – whether in terms of design, reasoning or type of site (genre). What did you learn?

For the next 30 minutes, work on your project.

  • Begin refining your audience and developing tasks
  • Begin identifying competitor sites

Discussion: information architecture and card sorting

Card sorts started with 3×5 cards and have evolved to be online instruments. The words on the cards should reflect tasks, not navigation. Each task statement should be as short as possible (pay property taxes, register for WEB200). Be careful not to overuse verbs/words or you will unintentionally guide participants towards a sort order. A card sort of 30-45 tasks is usually sufficient, and you can print these by hand on 3×5 cards. If you need multiple sets of cards, print to labels. You can also use sticky notes, but they are harder to keep in groups after a sort.


When structuring your website:

1. Form meaningful groups

Groups should correspond to how the user thinks about the subject matter. These groups should be broken down into standard categories and subcategories—main navigational links and sub-navigational links. Remember <chicken, cow, grass>

2. For application-like tasks, make sure your functional sequence is logical to users

3. Shallow versus deep

How will you logically nest pages? Make sure that there is a logic to nesting (avoid making sites too “deep”). Consider the inverted pyramid when structuring both pages and sites.


Naming Conventions

Page names should be “generally specific”—meaning the names should be concise, yet broad enough to be meaningful to the user. No spaces in file names – hyphens are preferred for SEO. All lower case (some servers are case sensitive).