Seven Deadly Sins of Information Design
Gluttony, sloth, and lust are fine sins for most real-world interactions, but sinning on the Web requires special skills. To help you avoid an eternity in the fiery pits, here's a handy guide to the Seven Deadly Sins of Information Design.
Drue Miller
Drue Miller is an information and interaction designer in Palo Alto, California. She has a B.A. in writing and design from Carnegie Mellon University.read her profile »
Sin 1: Forgetting who your users are
The first step in design is figuring out who you're designing for. Unfortunately, some designers skip this and proceed to "How many bleeding edge goodies can I fit on every page?"
The first step in design is figuring out who you're designing for. Unfortunately, some designers skip this and proceed to "How many bleeding edge goodies can I fit on every page?"
But the fact is, some users don't have (or want) the latest beta browser/plug-in. Some users are stuck with slow connections and small monitors. Some users don't think the scrolling rainbow-headline Java applet with embedded MIDI theme song is neat. (Some users do, but we'll deal with them another time.)
If you're creating a high-bandwidth site, make sure your audience is capable of experiencing it. Not sure if they can? Provide a low-bandwidth option or find a simpler way to get your visitors your information. The same thing goes for page size: Don't assume all users will have large monitors unless you know this is true.
Sin 2: Not creating a flowchart
Flowcharts are the blueprints of site development. They're absolutely essential - even if you're just building a small site. A good flowchart reflects every page on the site (including database queries and results, forms, and error/confirmation messages) and helps the rest of the design team understand the scope and structure of the project. Create one before you start pushing pixels and writing code.
Flowcharts are the blueprints of site development. They're absolutely essential - even if you're just building a small site. A good flowchart reflects every page on the site (including database queries and results, forms, and error/confirmation messages) and helps the rest of the design team understand the scope and structure of the project. Create one before you start pushing pixels and writing code.
Sin 3: Not organizing your content
Information can be organized in many ways, but not all of them are equally useful. Try arranging your content in different ways to find the best fit. Should it be listed alphabetically? Grouped into categories? Presented along a timeline? Sorted from best to worst or largest to smallest? Play with different structures to find the best one - or two or three. Offering several structures lets users choose their own most meaningful path through the information.
Information can be organized in many ways, but not all of them are equally useful. Try arranging your content in different ways to find the best fit. Should it be listed alphabetically? Grouped into categories? Presented along a timeline? Sorted from best to worst or largest to smallest? Play with different structures to find the best one - or two or three. Offering several structures lets users choose their own most meaningful path through the information.
Sin 4: Not using consistent navigation
Imagine if the street signs in your neighborhood changed on every block - on this block they're white Helvetica letters on a blue rectangle, but over there they're green Times Roman on a white square, and down the street they're missing entirely. Sounds kind of silly, right? No city would ever use a system like that.
Imagine if the street signs in your neighborhood changed on every block - on this block they're white Helvetica letters on a blue rectangle, but over there they're green Times Roman on a white square, and down the street they're missing entirely. Sounds kind of silly, right? No city would ever use a system like that.
The same logic should apply to your site. Navigation helps users get around - it tells them where they are and where they can go. Once you've established a convention for visual style and placement, stick with it.
Sin 5: Using unclear link colors
Choose your colors wisely: Users must be able to quickly tell which links they have and haven't visited. Links should be the most different from the text (if the text is black, links should be lighter and brighter; if text is white, links should be darker and heavier). Visited links should also look different than the text but should not jump out at the user - stick to bright and bold colors for links and more muted tones for visited links. Test your colors by squinting at your page - unvisited links should be more prominent than visited links and unlinked text.
Choose your colors wisely: Users must be able to quickly tell which links they have and haven't visited. Links should be the most different from the text (if the text is black, links should be lighter and brighter; if text is white, links should be darker and heavier). Visited links should also look different than the text but should not jump out at the user - stick to bright and bold colors for links and more muted tones for visited links. Test your colors by squinting at your page - unvisited links should be more prominent than visited links and unlinked text.
Changing link colors throughout your site is fine so long as the reason for their change is clear to users (for example, you use different colors to designate different sections of your site). Don't change link colors simply because you can - a color change should communicate something to the user, whether it's "You've entered a new section" or "You've already visited that link."
Sin 6: Using the TITLE tag incorrectly
Page titles are oh-so important navigational cues! For proof, look at your bookmarks. Can you identify all those pages? If not, somebody didn't create their titles properly.
Page titles are oh-so important navigational cues! For proof, look at your bookmarks. Can you identify all those pages? If not, somebody didn't create their titles properly.
There are three ways to misuse the TITLE tag:
- Ignore it entirely, in which case the filename ("home.html") will appear in the title bar
- Repeat the same title on every page in the site
- Use titles that don't reflect what's on the page
Page titles should be brief and descriptive: Aim for under 10 words, since longer titles will be cut off in the title bar, and make sure that they accurately and adequately describe the page contents and distinguish that page from the others on the site.
Sin 7: Not looking ahead
Sites created without growth plans become cluttered and unusable. You've seen these victims of poor planning - new elements are crammed onto pages without any concern for how the final product looks.
Sites created without growth plans become cluttered and unusable. You've seen these victims of poor planning - new elements are crammed onto pages without any concern for how the final product looks.
Your site will change over time - you'll want to add information, prune old pages, incorporate new technologies and tags, and perhaps give it a complete visual overhaul. The best way to handle such changes is to come up with a plan for growth now, while you're in the early stages of design. Identify new sections and features you'll want to add and figure out where they'll fit in the current site structure. Determine how often you're going to update the site and draw up a schedule for maintenance. Planning to accept ads in the future? Figure out now where they'll go on your pages.
Express Your Thoughts!
No comments:
Post a Comment