Accessibility HELPS: Explain
Explain (audio and visual content)
Audio and visual content involves media such as images, audio, video, and multimedia. This can also extend to virtual reality (VR) and other interactive experiences. When using these assets in your content, it is essential to understand how to provide proper access methods to ensure inclusivity.
To make this content available to as many people as possible, all media require a text-based alternative. This is codified in the WCAG Guidelines 1.1 Text Alternatives and 1.2 Time-Based Media.
Explain Contextually
Key to ensuring understanding is making sure the text alternatives make sense in context. An image with a complex description used decoratively will not help a person relying on the alt text. In fact, it may increase the cognitive load. If the content of an image is explained in the text, a short description is better than a detailed one.
This principle also applies to audio and video, though to a lesser degree. For instance, A transcript of a nature scene makes little sense. Instead, a description of the nature scene with key information can be more useful to a deaf person.
Another example is providing a video alternative to written instructions. Written directions act as a text alternative that is more helpful and easier to access than closed captions and audio descriptions. If all content in the video is described on the page, you can forego audio descriptions. However, since a deaf person might be following the instructions, it may be helpful to see the steps acted out, so captions are still required.
Tip: When determining the context of audio and visual content, consider how you would describe the material over the phone to the intended audience.
- Decorative Images: Images that wouldn’t be mentioned can likely be marked as decorative.
- Reinforcing Images: If the image is only used to reinforce a subject, it can just have that subject’s name (e.g., a picture of Brotman Hall used to describe the President’s office location could be labeled “Brotman Hall”).
- Complex Images: For complex images like charts or graphs, the best access is to provide the data in a linked source. If it is not critical for understanding, describe the highlights of the image rather than the full image (e.g., a graph of home prices in Long Beach over time since 2008 in an article about home prices may state “graph of home prices in Long Beach over time since 2008 shows a steady increase with peaks in 2016 and 2022”).
- Audio and Video: Audio and video that act as alternatives to text can be described as such. For instance, include text above the embedded media stating, “Instructions are provided in video and in text below the video.” In this case, audio description is not.
Accessible Images
Image descriptions for screen readers and other non-visual interfaces are called alternative or “alt” text.
Even though automatic accessibility tools check if an image has alt text, it is up to the developer or content editor to ensure the alt attribute is a meaningful replacement. Alt text is contextual in nature; what makes sense for alt text in one context may not make sense in another. For instance, a simple image of Walter Pyramid might need different alt text depending on the context—whether it's an aerial view from the southeast corner or highlighting the blue corrugated material. The image might be used to describe the color or shape of the pyramid rather than just its name.
Using complex images can confuse and frustrate some users. Always consider whether you can get the same effect with a simpler picture. Simpler images will often have simpler, more reliable alt text.
Examples:
Minimum (out of context) Alt text: Walter Pyramid
Minimum (out of context) Alt text: A student carrying a water bottle and looking at their phone walks in front of Walter Pyramid. In the foreground, there is a sizeable puddle.
Specific Alt Text Advice
Mark as decorative
Alt text can be as long as necessary but avoid duplicating text. If the alt text you would use is duplicated in nearby text, or the image is unimportant to the context of the page, it can be marked as decorative.
Make it short
Alt text should be succinct. Correct sentence and grammatic structure are unnecessary. Unless your audience needs to interpret the image, 2-4 words are often sufficient. Best practice is to include a period at the end of the alt text, even if it is not a full sentence, to prompt a pause when the image description is complete.
Alt text should not include "image of" or "picture of". The screen reader will read “image, alt text” so adding “image of” makes it read “image, image of Walter Pyramid”, which does not aid in understanding and can lead to frustration for the screen reader user.
Add explainer text to the information on the screen
Alt text should be accurate and equivalent to the visual content. It is best to minimize description in alt text. Making the description part of the main page content can be helpful for people not using screen readers. Some people will not understand what is being communicated in complex images, and this is a way to point out the important information to everyone.
Remove filename reference
Alt text should never be left as the filename, even if the filename is otherwise the same as your alt text (ex. “walter-pyramid.jpg” should be changed to “Walter Pyramid”).
Images should not have (intentional) text
If the image contains text, the alt text must contain the same text, unless the text is unimportant (ex: signs out of focus but visible in the background) or included as text on the same page or a linked page. This does not apply to logos which must include the name of the company with that logo at minimum. If your image has intentional text in it, ensure that your communications follow the requirements of the WCAG Success Criteria 1.4.5
Images used as links
If the image is used as a link, it should provide information about the linked content as well as a description of the image. For example, the CSULB logo linked to the main home page would require the alt text “CSULB logo links to homepage”.
AI-Generated Alt Text
AI-generated alt text should not be used. While AI can describe pictures, these descriptions are often not succinct and may not identify key information in the image. A paragraph or more of information for every image will slow down users significantly.
Instead, by providing a brief description of a few words, a screen reader user can decide if they want more information. They can then request assistance or use AI tools to find more information.
One tool that can easily be used in this manner for screen reader users is built into JAWS (screen reader software) and is called Picture Smart AI. The result from the simple image example used earlier in this page is:
The image shows a large blue pyramidal building situated in a landscaped area. The structure has a striking, uniform blue exterior and is positioned next to a walkway that curves into the entrance. The sky is clear, providing a bright backdrop to the architecture. The foreground features green grass and a few trees, enhancing the overall aesthetic of the environment around the pyramid.
Video-Only Content
Video only content usually relies on a text alternative. Video-only content can usually be described by a text alternative. While the text must be a full alternative to the video content, it does not necessarily need to have timing information included.
Note that video-only means there is no audio track at all embedded in the video. A video with audio, even if background noise or music, must include captions or a statement that the video has background noise only everywhere it is embedded.
Content with Audio and Video
Video content with audio requires both an alternative for the audio and an alternative for the video, commonly referred to as Closed Captions and Audio Description.
Closed Captions
Closed Captions are a script that includes noticeable sounds and other information. Currently, the easiest way to create a caption file is to upload the video file to YouTube and edit captions within their caption editor.
It is critical that closed captions are included if there is an audio track and video track. Some common situations are a musical background playing on a decorative movie, or a track with incidental noises such as beach noises, nature noises or city noises not directly associated with the content of the video, and unimportant to its context. If there is an audio track, there must be a caption file. For these situations, a simple description of the background sounds is sufficient and should last the length of the video:
- [background music]
- [beach sounds]
- [city sounds]
Please review Captioning Key for more information on quality captions.
Audio Description
Audio description embeds audio descriptions of actions in the video. There are some situations where this is unnecessary:
- A “talking head” video – any video where there is a single speaker or a series of speakers that are announced during the video.
- A slide deck type of video where all content on the slides are read aloud during the presentation, or the slide deck is made accessible and available to anyone from the same page.
Audio description must be built by hand. The simplest method for creating audio descriptions is using the CADET tool, which allows you to create captions and audio description, and export the video with human or computer-generated audio descriptions. This can be presented as a separate video or included as a link on the page.
Please review the Audio Description Key for more information on quality Audio Description.
Outsourcing video caption and audio description
There are companies that specialize in video accessibility. Two large companies that provide outsourcing of video and audio are Echo Labs and Verbit. We are exploring opportunities to support the outsourcing of video captioning. Please see resources to determine if funding may be available for your use.
Audio content must have a text alternative. This is simply a text transcript. If you are reading from a script, that is usually the easiest way to create an audio transcript, however there are a variety of AI transcription tools you can try, including the transcribe tool in Microsoft Word.
The legal requirement for accessible transcripts is 100% accuracy and should have any important sounds included. If you start with an AI transcript, please ensure you review the content for accuracy. Most AI content is at most 95-98% accurate and is heavily dependent on good quality audio. Lower quality audio may not be quite as accurate.
Audio transcripts can be included in the text on the page where the audio is embedded, or as a separate downloadable file.
Reference:
