Designing Web Pages for Scanning, Not Reading!
Faced with the fact that your users are whizzing by, there are five important things you can do to make sure they see and understand as much of your site as possible.
- Create a clear visual hierarchy on each page
- Take advantage of conventions
- Break pages up into clearly defined areas
- Make it obvious what's clickable
- Minimise noise
Create a clear visual hierarchy
One of the best ways to make a page easy to grasp in a hurry is to make sure that the appearance of the things on the page all of the visual cues clearly and accurately portray the relationships between the things on the page, which things are related and which are part of other things. In other words each page should have a clear visual hierarchy.
Pages with clear visual hierarchy have three traits:
The more important something is, the more prominent it is. For instance, the most important headings are either larger, bolder, in a distinctive color, set off by more white space, or nearer the top of the page or some combination of the above.
Things that are related logically are also related visually. For instance, you can show that things are similar by grouping them together under a heading, displaying them in a similar visual style, or putting them all in a clearly defined area.
Things are "nested" visually to show whats part of what. For instance, a section heading would appear the title of a particular book, visually encompassing the whole content area of the page, because the book is part of the section. And the title in turn would span the elements that describe the book.
Two weeks time we will examine “Animal, vegetables or mineral? Why users like mindless choices”
Sources of information and further reading
When preparing this newsletter the main source of information and illustrations was Don't Make Me Think, A Common Sense Approach to Web Usability second edition by Steve Krug 2006 ISBN 0-321-34475-8