Build your website based on evidence, not false beliefs.

Myth #13: Icons enhance usability

Many researchers have shown that icons are hard to memorize and are often highly inefficient. The Microsoft Outlook toolbar is a good example: the former icon-only toolbar had poor usability and changing the icons and their positioning didn’t help much. What did help was the introduction of text labels next to the icons. It immediately fixed the usability issues and people started to use the toolbar. In another study, the team of UIE observed that people remember a button’s position instead of the graphic interpretation of the function.

In most projects, icons are very difficult to get right and need a lot of testing. For abstract things, icons rarely work well.

Research findings and articles on the usefulness of icons:

  • UIE conducted two experiments to test how people use icons. First they changed the pictures of icons in a toolbar but kept them in the same location. People quickly adapted to this change. Afterwards, they kept the images but shuffled their location in the toolbar. This change confused the participants and caused problems for them. - Orbitz Can’t Get A Date
  • Michael Zuschlag says that “icons contrary to intuition, do not necessarily help the user find a menu item better than a text label alone (see Wiedenbeck S 1999. The use of icons and labels in an end user application program: an empirical study of learning and retention, Behaviour & Information Technology, 18(2), p68-82). It’s not worth it.” He also discusses his views on UX Exchange.
  • The story of the Microsoft Outlook toolbar: until labels were added to the icons, non-expert users didn’t use the toolbar’s buttons at all (with the exception of the ‘Delete’ icon). Then “Different fixes were tried: new icons, rearrangement of the icons, positioning icons under the menus from which the commands came from. In the end, one change caused a total turnaround: labeling the important toolbar buttons. Almost immediately, the toolbars were a big hit and everyone at all skill levels started using them.” - The Importance Of Labels
  • The article The Problem With Icons provides a nice example how it’s difficult to guess an icon’s meaning without a text label next to it.
  • 37signals applauds Apple’s MobileMe service for changing their logout icon from a power button to a “logout” label. - UI Sighting: Clear over clever on MobileMe
  • Peter Steen Høgenhaug conducted a test to measure how people understand icons of a CMS editor. The result: the widely used ‘insert link’ icon was understood only by 35% of the participants, even the classic ‘undo’ and ‘redo’ icons were only recognized by half of the participants.

Where icons add value:

  • Universally understood icons work well (ie. print, close, play/pause, reply).
  • Icons can serve as bulletpoints, structuring a webpage (ie. file type icons for PDFs, DOCs, etc.).
  • Good icons can make the look of a webpage more pleasing.

Zoltán Gócza – Let’s connect