Icon-Based, Web Site Navigation

I have been considering the use of a consistent set of icons throughout the future “Clear Helper” Web site to facilitate the navigation of it.

One ideal for such icons is that the messages or the concepts they convey are proven, through research and extensive testing, to be consistently understood by the users of them.  Accomplishing that is beyond the scope of this project, but may be an avenue for future, grant-funded research.

Another ideal would be the development of a set of navigation icons for use across Web sites.  I had hoped there was already an effort underway.    At the time of this writing, I have not found one.

Listed below are a few sites that attempt to use a set of icons for site navigation, particularly for people with cognitive disabilities.  The success or failure of the sites’ navigation is best judged by the reader.

  • The Consumer Corner section of the California Department of Developmental Services Web site has a clip art and text based navigation menu on the right of its pages.
  • Symbol World, for site navigation, uses very large icons accompanied by short text labels.  Most appear to be unique to page content, rather than being part of a consistent navigation set.
  • Children’s Society, on the right side of its pages, uses a common set of navigation icons.  Hovering the cursor over the icons produces related sound effects.
  • Symbol Rainforest uses photographs as navigation aids.  The use of photographs may be an answer to the criticism that icons are a poor substitute for realistic representations.  (Note: The Symbol Rainforest Web site can not be viewed in Firefox, but can be viewed in Internet Explorer.)
  • Check the Map uses a navigation strip of icons on the bottoms and on the tops its pages.  Most of the icons immediately make sense to me, but the home icon is odd.  Perhaps it would be better represented by an outline of a house.
  • Moorcroft School has a large navigation strip of icons (clip- and line art) on the bottoms of its pages.

None of the Web sites listed above use what I have in mind for navigation.  I do like the combination of navigation icons and related sound effects on the Children’s Society Web site, and will consider doing something similar.

Note: The “Icons” section of a WebAIM article on “Creating Accessible Images” is germane to the creation of Web site navigation icons.

Note: With the exception of The Consumer Corner, the sites listed above are either examples set up by The Widget Software Company or use symbols provided by it.  No endorsement is intended or implied.