Designing Accessible Icons

The GNOME desktop includes a high contrast theme that make the desktop and the applications running on it accessible to users with a range of visual impairments.To be considered fully accessible, all icons in your application must be replaced by a suitable alternative when this themes is used.

Low Contrast Icons

Low contrast icon themes were deprecated in GNOME 2.22. It is no longer necessary to deliver low contrast icon equivalents.

9.4.1. High Contrast Icons

High contrast icons are greatly simplified versions of an application's existing regular icons. They are drawn with two colors, black and white, and thicker borders. This style allows high contrast icons to be distinguishable when viewed by a user with a visual impairment. Below is an approximation of what well-designed high contrast icons look like when viewed by someone with a visual impairment.

Table 9-3Simulation of low vision user viewing high contrast icons
Description High Contrast Icon Simulated Appearance
Book
CD-ROM
Copy

If a regular icon uses a simple, straightforward metaphor the corresponding high contrast icon can often use the same metaphor. In many cases the same metaphor will need to be drawn differently to create a simplified high contrast icon.

Figure 9-14Simplified representation of metaphors for high contrast icons

High contrast icons are created in a vector drawing program. Black and white shapes are layered to create a simplified icon. The process feels like layering black and white pieces of construction paper, as if you were assembling a collage.

Figure 9-15Layered technique for high contrast icons
Reuse existing shapes

Often shapes from existing high contrast icons can be resized and reused to more quickly build up a new icon.

Don't forget the border!

It is useful to design high contrast icons over a temporary background color so you don't forget to draw the external white border.

9.4.2. Low Contrast Icons

Low Contrast Icons

Low contrast icon themes were deprecated in GNOME 2.22. It is no longer necessary to deliver low contrast icon equivalents.

The goal of low contrast themes is to eliminate, as much as possible, light values (e.g. a large 'V' value in HSV). To achieve this, the colors in low contrast icons are compressed toward the middle value range, i.e. dark colors are lightened and light colors are darkened.

Low contrast icons are generated from the existing regular icons by adjusting the levels in GIMP. The Input Levels are set to 100, 1.25, 200 and the Output Levels are set to 100, 160, as shown in the Levels dialog below. Large numbers of regular icons can be quickly converted to low contrast by using GIMP's scripting facilities.

Figure 9-16Levels dialog in GIMP showing correct levels for generating low contrast icons