22% of adults in the United States have some type of disability (Source). In addition to permanent disabilities, people may also have temporary disabilities (e.g., a broken arm that makes typing difficult) or situational impairments (e.g., speakers on the computer don’t work and so they can’t hear the sound from a video). In order to make your committee as inclusive as possible, it is vital that you consider accessibility.
Further, when designing websites and documents, “accessible design is good design.” Features that improve accessibility generally make the site or document more usable for everyone, just as curb cuts on the sidewalk can help people with carts and strollers, and not just those in wheelchairs.
This guide will give some quick tips for making your documents, videos, and tools more accessible. However, note that following rules mindlessly is unlikely to lead to a truly accessible site. You need to continually keep in mind the experience of people with disabilities when creating documents or choosing tools. These disabilities may include vision issues, hearing issues, mobility and dexterity issues, and cognitive issues.
Creating Accessible Documents
There are five key tips to keep in mind when creating accessible documents, which include Microsoft Word documents, Google Docs, PDFs, and webpages:
Use Built-In Styles and Formatting
Headings, lists, and other formatting add structure to your pages. To ensure these elements are accessible, use the built-in formatting in Word or style codes in HTML. Do not make a “heading” by bolding and enlarging the font, and don’t skip heading levels (e.g., go directly from “Heading 1” or “<h1>” to “Heading 3” or “<h3>”). Make lists by typing in asterisks, and avoid using tables for layout rather than for tabular data.
Provide Alternative (ALT) Text
Alternative text provides a textual alternative to images and other non-text content on web pages. It is especially helpful for people who are blind and rely on a screen reader to have the content of the website read to them. You can add ALT text in HTML and most applications (including Word and PowerPoint)
The alternative text should provide an alternative for both the content and the function of the image on the page, which means that the same image may have different ALT text in different contexts (click here for examples of using different ALT text for the same image). If an illustration does not convey content (for example, a decorative element) or repeats information found in the text, use empty alt tags on HTML pages to tell the screen-reader to skip the illustration.
Ensure Hyperlinks Are Easy to Identify and Make Sense Out of Context
Identify links with color and additional formats like underlining to highlight them with low vision or color blindness.
Links and clickable “hot spots” need to be large enough for visitors with limited motor control to click. Ensure that all content can be accessed with the keyboard alone; do not use elements that only activate when a user hovers over items with a mouse.
Ensure links make sense out of context. Every link should make sense if the link text is read by itself. Screen reader users may choose to read only the links on a web page. Certain phrases like “click here” and “more” should be avoided.
Use Colors Carefully
Do not rely on color alone to convey meaning. The use of color can enhance comprehension, but do not use color alone to convey information. That information may not be available to a person who is colorblind and will be unavailable to screen reader users.
High contrast colors are easier for visitors to read. Avoid red and green because they present a challenge to many color blind users.
Ensure Content is Clearly Written and Formatted
Make sure content is structured, clearly written, and easy to read. When it comes to text presentation and formatting, use clear fonts, add blank lines between paragraphs, and use headings and lists appropriately. When it comes to writing style, organize your ideas logically, avoid double negatives, keep sentences simple, and avoid using jargon or acronyms without explanation.
- Creating Accessible Word Documents
- Converting Word Documents to PDFs
- Converting Non-Accessible PDFs
- Creating ALT Text in Drupal
- Creating ALT Text in Mediawiki
- Creating ALT Text on WordPress
Audio and Video Media
Provide a text transcript for all audio media
Transcripts are text versions of an audio file. This allows anyone that cannot (or prefers not to) access content from a web audio or video to read a text transcript instead. Transcripts do not have to be verbatim accounts of the spoken word, and can contain additional descriptions, explanations, or comments that may be beneficial. For example, if the transcript is from a video, a transcript may also contain information about what is visible on the screen.
For most web video, both captions and a text transcript should be provided. For content that is audio only, a transcript is usually enough.
If the audio is associated with images or video, provide synchronized text captions.
When your audio is associated with any visuals, such as images, slides, or video, you should provide captions that are synchronized with the visual in addition to the text transcript. Again, these do not have to be verbatim accounts of the spoken word.
- Add Subtitles/Closed Captions to YouTube Videos
- Aegisub – A free, open source tool for creating and modifying subtitles
When considering using tools for collaboration, project management, video conferencing, etc., consider accessibility. Do research to see both what the vendor claims about the accessibility of their tool as well as reviews from users with disabilities. Some vendors will provide online Voluntary Product Accessibility Templates (VPATs) to show their compliance with accessibility guidelines and/or may provide information about compliance with Web Content Accessibility Guidelines 2.0 (WCAG 2.0).
- Lynda Trainings on Accessibility – UX Foundations: Accessibility is the best for a broad, not-too-technical overview of accessibility considerations.
- Web Content Accessibility Guidelines (WCAG 2.0) – International accessibility standards
- WebAIM’s Articles on Accessibility – One of the best sites on web accessibility
- Cornell’s Web Accessibility Primer
- Top 10 Tips for Making Your Website Accessible
Icons courtesy of icons8.com