Accessible Graphics

Alt-text should be succinct and concise (rule of thumb is <125-150 characters). However, there are times that an image requires more than a short description to be useful.

• One option is to put the information in the text itself so that the image becomes a supplemental element to the text. This way, all students get the information and the image supports that information for multi-modal learners.
  • Avoid redundancy – if the information about the image is included in the surrounding text, do not include it again in the alt-text field – only include a short description or mark the image as decorative.
• Another option is to create a longer description on a separate page with basic information in the alt-text field along with a link to the longer text.
• Images with a large amount of information such as infographics can be created using tools that let you make them natively accessible (check the help section of the tool). However, if you are using a pre-existing infographic or the tool does not have accessibility options, there are a number of ways to ensure that the information is available for all. You can create a transcript of the text and relevant descriptions then: 
  • Hide the text under the infographic,
  • Add the full text below the infographic, or
  • Post the transcript in a separate document and add a link directly before or after the infographic.
• For Charts and Graphs, include a short general description in the alt-text field then, either:
  • include a data table with the same information in line with the graphic or,
  • create a detailed narrative and link it to a long description page or appendix within the document.
• For Math Equations and Formulas, there are programs such as MathML designed specifically to create mathematical expressions that can be read by screen readers.
• The Diagram Center has an excellent resource: Image Description Guidelines that you can use as a reference guide. 

Microsoft Word does not handle text wrap very well – screen readers read information in the order it encounters it, this means that if a graphic is anchored in the middle of text, or you use text wrapping, the reader may read the alt-text it in the middle of a sentence (confusing) or may not read it at all (yikes!).

• When placing graphics that provide important information in Microsoft Word, use the program’s built in tools to place the graphic “In line with text.” This means that text will be above and below the image but not on the same line.
• If you use wrap text for a graphic (instead of in-line) and convert the document to Adobe PDF, you can go in and add the proper alt-text tag to the document using the accessibility tools in Adobe Professional DC (but not the standard Adobe Reader).

Videos and recordings are a great way to demonstrate concepts and help reinforce learning. However, students who are deaf cannot hear the information being communicated and students who are blind cannot see the actions shown. Captions can also greatly enhance the learning experience for many students. Studies have shown that using captions can help students to better understand and retain information. They can also be invaluable for ESOL students and those working in environments where sound cannot be used (noisy environments or where quiet is needed – e.g. a library or studying with sleeping children).

• Professional Captions must be provided if you have a student in your course with an accomodation – auto-captions do not qualify as compliant.
• At minimum, transcripts of videos and recordings should be provided. However, trying to follow a transcript while watching a video is difficult and does not provide an equitable student experience.
• Captioning videos is by far the best option for supporting students who are deaf or hard of hearing (and many others).
• When looking for videos, look for videos that have already been captioned. Chemeketa online and the Library are working with faculty to create and curate a collection of captioned videos.
• Audio descriptions can be added as an additional track to describe action for students who are blind. This is still an emerging issue and not as commonly available as captioning – work with Student Accessibility Services for face to face classes and the Center for Academic Innovation for online courses to provide support for students who require it.

Tips and Tricks

• Captions help many users, not only does it benefit students who are deaf, it also helps students for whom English is a second language, multi-modal learners, and students on old equipment or in places where they can’t have sound (e.g. the library).
• Whenever possible, include a transcript along with a captioned recording or video, it provides an additional learning support and allows all students to easily review and find information when studying for a test or brushing up on notes.
• YouTube and other programs have options for automated captioning. These are a start but require quite a bit of cleaning as they often get things very wrong. For a great example (and a bit of a laugh) watch Caption Fail:Jamaican Vacation Hoax.
• When looking for videos in YouTube, you can search for captioned videos and filtering by Subtitles/CC
• To turn on captions, look for the box with a CC along the bottom right of the video – click on the square to toggle them on or off.
• Always watch the full video and check the captioning to make sure that it is accurate and complete.
• While not appropriate for accomodation needs, you can add auto-captions to your recorded Zoom meetings  and to media in Kaltura using Kaltura Reach.

Animations and movement can be useful to show processes or actions but should be used with care.

• For students who are blind, follow the rules for alt-text and complex images.
• For students who have learning or cognitive disabilities, animations can be distracting or difficult to follow. If using an animation, choose ones that will allow the student to control the speed or turn off the movement as they need to.
• Blinking or flashing graphics can affect users with seizure disorders such as epilepsy – it is best to avoid if at all possible. If it is absolutely necessary to use a flashing graphic, be sure include a warning, as well as an option to turn off the animation, well before the flashing starts so that those that need to can take the necessary actions to protect themselves.

Graphics are an important part of creating interesting and useful documents. They enhance learning and allow for different learning styles. Choosing the right graphics is important for the usability and accessibility of a document.

• Get the right size graphic – using a small graphic and making it bigger can result in pixelization which makes it difficult for users with low vision or cognitive disabilities to see and understand.
• Flashing, moving or overly colorful and elaborate graphics can be distracting or confusing for users with learning or cognitive disabilities.
• Be mindful of the graphics that you choose – do they actually convey the information that you want your students to learn – and is that message clear? If not, you may want to find a graphic that is closer to your goal.
• Use decorative graphics in moderation. While everyone wants to give their documents some style, overuse can actually harm your aesthetic and creates barriers for students who are blind or have cognitive disabilities.
• Don’t use Adobe Flash. Materials created in Flash are not accessible and Flash itself has been discontinued by Adobe. Also, most web browsers no longer support Flash files. If you have existing materials that use Flash, please consider moving that information to a newer, more accessible format.

Alt-Text for Google Docs

Google: Make your document or presentation more accessible