Ensure that icons are clearly and consistently labelled to identify their purpose.
Ensure icons are consistently identified. [[WCAG-3.2.4]]
Ensure sufficient contrast between the icon and the background. [[WCAG-1.4.11]]
Identify and label font icons. [[WCAG-3.2.4]]
If the icon is for a control, ensure it is at least 44 by 44 pixels in size. [[WCAG-2.5.5]]
Although icons are not as prevalent in digital publications as on the web generally, they are not uncommon. Icons are often used to identify key items of interest in a publication, for example, such as the various kinds of sidebars that occur in textbooks and other works of non-fiction. They are also commonly used to in place of text to identify the presence of extended descriptions for images. And, of course, they are prevalent as controls for interactive content.
Making icons accessible generally follows the same requirements as any images, but there are some additional requirements specific to them. Key among these is the need for consistency of naming. It is not enough to provide a label, as users come to expect the meaning and purpose of the icons to remain consistent across a publication. An icon used to link to an extended description, for example, should not have a label "Extended description for figure 1" in one place and "Read more about figure 2" in the next. The labels will not be identical, since the figure number will change, but the phrasing needs to be consistent.
It is also important that the icons can be clearly distinguished. Meeting the 3:1 contrast ratio requirement between the icon and its background ensures that users are able to perceive both where icons are used and what they depict. Similarly, the icons should be at least 24 pixels in length and height when the image represents a target for an input action like a click. Although not specifically a WCAG requirement, icon should be sized to ensure they are legible by the widest possible audience without the need for magnification. Avoiding complex imagery in an icon is also recommended, as even sighted users may struggle to make out the meaning.
Font icons are a slightly different beast from image icons as they rely on the author using the private use area of Unicode (i.e., special code points that are not assigned to any character, so the author can provide a font that defines icons for those code points). The problem with this approach is that private use area code points are unknown to user agents and assistive technologies, so there is no way for them to announce the meaning of the icon. To work around this problem, authors can attach the ARIA role "img" and provide a label where the icon is inserted (see example 3 above).