Columns

Be Part of the Solution

By Linda Roberts | STC Fellow and Lisa Cook | STC Fellow

This column shares information about accessibility requirements and techniques, and introduces standards and policies that might affect your products. If you have feedback, contact Linda Roberts at lerober1@yahoo.com or Lisa Cook at Lisa.Cook@sas.com.

When we overhear people speak about accessibility, we often hear them say that they want to be part of the solution, but they don’t know how to be. So what are some things an online communicator can do to enhance the accessibility of his or her website, FAQ, or mobile site? The World Wide Web Consortium (W3C) spells out some of the “easy checks” that technical communication practitioners can perform during their design process to address the usability of their online communication.

Misleading Use of Structural Elements on Pages

Don’t use heading elements for emphasis or because you like the way the font and weight of the heading element looks on the screen. A visual user usually does not notice this shortcut, but problems arise when accessibility devices are used. Screen readers use the Web page’s structure to help users who are visually impaired navigate through the page. Some screen readers even allow a user to jump from one heading to another so that they can get a feel (or outline) for what information is contained within that page. Misused heading elements can cause confusion by giving minor content pieces an undeserved importance, and a lack of headings can leave a user feeling left out. Hierarchy of headings conveys structure and helps non-visual users construct a mental map. Use the structure that templates provide or create a structure if you or your organization does not already have one.

Images Without Alternative Text

People with disabilities such as blindness or low vision rely on assistive technologies (ATs) to read the information on a Web page to them or to send the information to a Braille writer. If a Web page contains an image, then you need to provide a text equivalent, that is, concise and descriptive text to describe the function of each graphic, image, and animation. Avoid contextual references such as “click here” because they have little meaning when they are read aloud. Don’t think that if you leave out alternative text for any images that these images are skipped over by ATs. If alternative text is left out, then an AT might just say “picture,” “graphic—untitled,” or read the contents of the src attribute, which is the name and physical location of the image file. These options can be very long and confusing. In addition, the inclusion of meaningful captions and alternative text might enhance search results and bring other users to your content.

Sites with Poor Color Contrast

About one in ten American males have some type of colorblindness. Colorblindness, however, rarely affects women. Also, low-vision conditions (such as macular degeneration and diabetic retinopathy) increase as people age. The most common combination of colors which poses problems is red/green color combinations. With this condition, a person cannot distinguish between some shades of red and green. To test for color-contrast, use one of the many free color-contrast checkers and low-vision simulators that are available online. You can also change any of your graphics to grayscale in the software.

Consider, also, low vision conditions. For example, GPS devices often automatically switch to a dark background and light foreground in low light situations. Providing a high-contrast option can help not only low vision or colorblind users, but also other users who need the contrast in certain situations, such as reading in dimmed lights on an airplane.

Information Is Usable When the Text Size Is Scalable

Most browsers allow you to manipulate text size on a Web page using text size settings, text-only zoom, and page zoom. If you do not plan for these changes, then text might be unusable when the text size is changed. Columns and sections can overlap when zoomed, lines of text run off the screen, or whole chunks of text might disappear. Luckily, it is easy to check for this. Use a variety of browsers and devices to check to see what happens when you change the text size. For mobile consumption, be sure to check multiple operating systems for apps and browsers.

Keyboard Access to All Elements

Many people use only a keyboard to interact with a Web page. In addition, some assistive navigation devices rely on keyboard access to function. Because of this, keyboard focus (like a border or highlight) should be apparent in the Web page and should follow a logical order through your Web page elements. To test for keyboard access, put your mouse aside and use the Tab key to move through your webpage. Make sure that you can tab to and away from all links, form fields, buttons, and media player controls.

Multimedia Alternatives

If you include videos or audio clips in your Web pages, you should provide captions and transcripts not only for people who cannot hear, but also for people who might work in open areas and have the sound on their computers muted or turned off. Provide a text track of the audio or video’s dialog (and other sounds) in a file so that it can be synchronized with the audio or video’s soundtrack. The text file should be a word-for-word transcript (if possible). We’d go into detail about how to generate these files, but Karen Mardahl wrote an excellent Intercom article (in January 2011) titled “Captioning Videos on YouTube” that details the process. As with alternative text and image captions, an available text transcript might render your audio or video content more readily findable by search engines, thus broadening its audience.

Like everyone else, what people with disabilities want isn’t just information, but also a quality and equitable experience. Keeping these techniques in mind can help you deal with some basic accessibility issues before your online information goes live and might help to reduce re-work and re-design.