Accessibility and Open-Source Media:
Best Practices

Accessible media has many benefits, including for people using screen readers that can render text aloud or as Braille, but also for anyone—as images are better indexed with accessibility information.

Below you will find some best practices for creating accessible text and visual media.

Many website builders have accessibility checkers that look at color contrast and structure. Google Documents and Microsoft Word both have some built-in accessibility features. If you are interested, you can explore this resource from CUNY about evaluation tools that can be used to check for different aspects of accessible design.

Jump to: Colors | Fonts | Links | Images | Styles | Video

Colors

Be mindful of what colors you choose to make sure they provide for sufficient color contrast.

To make your site readable and equitable to screen readers or audio-based transcription, don’t make color the sole way you relay information.

Fonts

Fonts in print materials: Serif fonts like Times New Roman, are generally considered the most readable font family for printed text. A serif font is a typeface with small decorative lines, or “serifs,” at the ends of the strokes that make up each letter or character. Serif fonts are often considered more traditional and formal in appearance and are believed to help guide the reader’s eye along the lines of text, making the text more legible, especially in print.

Fonts in web-based content: Sans-serif fonts like Verdana, Tahoma, Trebuchet MS, and Georgia are the favored option in electronic formats. The lack of adornment on their letters, and the efficiency and uniformity of their letter spacing, heighten their appeal online.

Links

Use descriptive text in hyperlinks that describes where the link goes; don’t use linked phrases like “click here” or “more,” which don’t describe the destination. You may also opt to include a full URL, also hyperlinked, as text.

Images

Include “alt-text” (alternative text) with each visual media: For images, tables, charts, and graphs, include alt-text so that these elements are described. Alt-text can be provided in the “alt attribute” information of the those figures, or included in the surrounding context of the image—for example, in an image caption.

Appropriate alternative text depends heavily on the image’s context and should present the content and function of the image. Alternative text should be succinct; avoid phrases like “images of” or “graphic of”. Avoid placing text in images.

If using an image of text, the text alternative should contain the same words as in the image. Note that there is a difference between an Image Title, Image Citations, and Alt-text. (Include citations to the image when necessary.) If you aren’t sure what to include, W3C Web Accessibility Initiative (WAI) has an “alt Decision Tree.” And explore more through this resource about Image Accessibility from CUNY.

Styles

Use built-in Styles to structure and organize your document. That includes Headings (H1, H2, H3, etc…), Lists, Columns (and not tabs or spaces to create columns), Tables to display data, but not for layout. Keep tables simple; for complex tables and charts, provide a detailed transcript.

Include a table of contents for long documents (Google Docs and Microsoft Word can generate this automatically if you’ve set up Styles and Headings).

Video

Captions and Transcripts provide text versions of the words spoken in a video. It is essential for people who cannot hear the audio and can be helpful for all users of your site, including people not fluent in the language used in the video/audio or people who are working in a quiet space. YouTube and Vimeo both allow you to add captions to videos; YouTube also provides instructions for adding your own subtitles and closed captions and Vimeo also has help on captions and subtitles. iMovie (MAC) and MovieMaker (PC) also contain free caption tools.

Audio Descriptions for videos are intended for users with visual disabilities and provide an audio track accompaniment with additional descriptions about what is visible on the screen.

Avoid setting content media to “Autoplay” on websites—especially with flashing visual content. People using screen readers may have difficulty hearing the reader’s output if other audio is playing at the same time.


Accessibility tips for presentations and public speaking

You have options for making your visual content accessible when making a speech or public presentation. You can make your visuals fully accessible and distribute them to those who need them ahead of time. You can explain any image content you include by offering more detailed oral descriptions of important elements. Always be sure to be cognizant that your presentation images are clear and necessary. Use an 18-point font or larger on presentation slides.


The information above is adapted in part from OpenLab Tips and SpringShare’s Accessibility and LibGuides guide, and CUNY Library Services. More extensive information is available at CUNY Library Services’ Accessibility Toolkit for Open Educational Resources (OER) (guides.cuny.edu/accessibility/home).