Icons vs. Text
Icons can present complex information, meaning, and functionality in a very small amount of space. A browser's "Home" icon (typically an illustration of a house) readily conveys rather complex meaning and functionality - activating it will take you to the browser's defined home page. While such icons can be very useful, care must also be taken to ensure that the icon is understandable to the end user and reflects well-known conventions. The floppy disk icon, for example, is used for "Save", yet the real-world connection between saving a file and an actual floppy disk (something that is rarely seen and no longer produced) is not present for many people, particularly newcomers to the web and youth. Real text ("Home" or "Save") should be used in place of an icon, or perhaps in conjunction with an icon.
Avoid Redundant Alternative Text
Images and related text are often paired together, such as a product image with the product name immediately below it, or a photograph with a caption. In instances where the text conveys the content of the image, the image should usually be given null or empty alternative text (alt=""). This avoids the redundancy of having a screen reader read the same information twice (once for the image alternative text and once for the caption or adjacent text).
If the image and the adjacent text are links to the same location, combine both the image and the text into one link and give the image null alternative text. This avoids redundancy, results in fewer links for the user to navigate, and results in fewer links for the user to navigate.
Extraneous Alternative Text
Alternative text should convey the content and function of an image, but it should not be used to convey additional information that is not presented visually by the image. For example, file size, file format, copyright details, that a graphical link opens in a new window, link destination, price (on e-commerce sites), keywords for search engines, etc. should not be included in alternative text. If this content is important, it should be included in the page in a way (such as in nearby text) that makes it available to all users. If this information is not necessary, it should be removed or may be presented in the title attribute value (which is intended for this type of advisory information).
Sensory Characteristics
Avoid relying on sensory characteristics, such as shape, size, or visual location. For example, "Click the green button" will not be useful to screen reader users or some users who are color blind. Instead, use "Click on the green button labeled 'submit'" or simply "Click the 'submit' button". Similarly, "Use the form on the right" could be changed to something more descriptive such as, "Use the search form on the right." Other examples include prompts such as "Click the larger button," "Select a state on the east coast on the map", "Instructions are included in the sidebar", etc. Purely auditory cues ("Click 'Continue' after you hear the beep") should also be avoided.
To access the Center for Disability Resources Library and its materials, please click this link
No comments:
Post a Comment