E-Learning Accessibility Checklist

Disclaimer

The Web Content Accessibility Guidelines (WCAG) are the most official source of guidance on how to make electronic communications accessible. However, those standards aren’t written specifically for e-learning. This checklist, created by Artisan E-Learning, ELB Learning, and SweetRush, is available to you through the Inspire Accessibility initiative. It can help you “translate” how the WCAG standards apply to e-learning development.

Instructional Designers
  • Create alternative text descriptions for non-decorative images. For decorative images, use ALTEXT=”” .
    WCAG: Level A Success Criteria  1.1.1
  • Provide text-based alternatives for multimedia content in the form of a transcript/transcripts, closed captions, or both.
  • Include all speech from the soundtrack, identify who is speaking, describe the important part of the scene, and include onomatopoeia only for background sounds that contribute to your message.
    WCAG:     Level A Success Criteria  1.1.1 – 1.2.3
  • Create explicit instruction text for buttons and interactive components. For example: Instead of “Select here,” we can say, “Read more” or “View the file.”
    WCAG:     Level A Success Criteria  1.3.3
  • Avoid images with embedded text because screen readers can not access the content. Put the text in a text object.
    WCAG:     Level AA Success Criteria  1.4.5
  • Do not add time limits to activities and exams unless the time limit is essential.
    WCAG:     Level A Success Criteria  2.2.1
  • Create a unique name for each course page or screen. (Think about the page titles that will appear in the table of contents or course menu.)
    WCAG:     Level A Success Criteria  2.4.2
  • For buttons and links that don’t have a label, create alternative text descriptions.
  • The purpose of the link must be clear from the link text (for example, “Read Document”).
  • If the link is an image, the alt text of the image makes the purpose of the link clear (for example, “Link to FAQ”).
    WCAG:     Level A Success Criteria  2.4.4
  • Explain what’s going to happen when you click a button or link. For example, if the button opens a new tab, explain that to the learner.
    WCAG:     Level AA Success Criteria  2.4.6
  • Where a component has a text label, the name of the component also contains the text displayed.
  • Create alternative text to match on-screen labels, as applicable.
  • Ensure that the text label and programmatic name of components match.
    WCAG: Level A Success Criteria  2.5.3
  • Provide instructions when content requires user input.
    WCAG: Level A Success Criteria  3.3.2
Creative Directors/Graphic Designers
  • Maintain a logical reading order in pages, documents, tables, slides, and forms.
    WCAG: Level A Success Criteria  1.3.2
  • Don’t restrict device orientation. Make sure that:
  • All content retains meaning in either landscape or portrait position.
  • All content retains function in either landscape or portrait position.
    WCAG:     Level AA Success Criteria  1.3.4
  • Create alternatives when color is used to convey important information or instructions. Alternatives can be visual, text or audio-based.
  • Provide text alternatives for info that’s only visual, such as color coding or pattern.
    WCAG:     Level A Success Criteria  1.4.1
  • Use highly readable fonts like Arial, Calibri, San Serif, & Helvetica.
  • Avoid font sizes below 12px.
    WCAG:     Guideline  1.4 Distinguisable
  • Use line height to at least 1.5 times the font size;
  • The paragraph spacing must be adjusted to at least 2 times the font size;
  • And the letter spacing to at least 0.12 times the font size; and
  • Finally, set word spacing to at least 0.16 times the font size.
    WCAG:     Level AA Success Criter ia 1.4.12
  • Make sure the visual presentation of text and images of text (avoid images of text) have a contrast ratio of at least 4.5:1, except for the following:
  • Large Text: Large-scale text and images of large-scale text have a contrast ratio of at least 3:1.
  • Incidental: Text or images of text that are part of an inactive user interface component, that are pure decoration, that are not visible to anyone, or that are part of a picture that contains significant other visual content have no contrast requirement.
  • Logo types: Text that is part of a logo or brand name has no contrast requirement.
    WCAG:      Level AA Success Criteria  1.4.3
  • If color is used to convey the meaning between states (such as visited, selected, and normal), use a contrast of at least 4.5 to 1.
  • Don’t rely only in color to convey a state. Include alternative text for the screen readers.
    WCAG:     Level AA Success Criteria  1.4.3
  • Make sure your course text works up to 200% zooming, with the exception of captions and images of text.
  • Ensure users can resize the text content in their web browser up to 200% without loss of meaning or function.
  • Add support for 200% web browser zooming.
  • As all modern browsers allow for changing text size, a website based on good HTML and CSS should comply.
  • If your course doesn’t resize correctly to at least 200% in a browser, add a feature that enables users to resize (by CSS) to three or four predetermined magnification settings, including 200%.
    WCAG:      Level AA Success Criteria  1.4.4
  • Avoid the use of images of text since they cannot be read by assistive tools.
  • If an image is essential to preserve a specific design, provide text alternatives for screen readers.
    WCAG:      Level AA Success Criteria  1.4.5
  • Avoid blinking and flashing content. Do not use videos, animations, or other elements that flash or blink more than three times per second.
    WCAG:      Level A Success Criteria  2.3.1
  • Ensure there’s a visible focus indicator with good color contrast when keyboard navigation is used. For form fields, you might display a bar within the field or highlight the entire field. For controls, you might display a border around the control.
    WCAG:     Level AA Success Criteria  2.4.7
  • Provide clear and consistent navigation.
    WCAG:     Level AA Success Criteria  3.2.3
Developers
  • If an object does not contain useful content, remove it from the focus order so it is ignored by keyboards and assistive technology.
    WCAG: Level A Success Criteria  1.1.1
  • Add captions to synchronized media, except when the media is a media alternative for text and is clearly labeled as such.
  • Check that the caption text is not covering any important part of the image, has a font size of no less than 12px, is 30 words max, and is the right color contrast ratio (you can use a font background).
    WCAG: Level A Success Criteria  1.2.2
  • When using visual techniques to convey information, structure, and relationships (such as larger text to designate something as a heading), make sure that information, structure, and relationship can be interpreted programmatically or with a text alternative.
  • Break up content with subheadings for new sections.
  • Mark headings with HTML header tags.
  • Use lists, tables, and other formats where needed.
  • Use the correct HTML for all structural elements.
  • Use valid HTML everywhere.
  • Use clear labels and alternative text on forms.
    WCAG: Level A Success Criteria  1.3.1
  • When hover or focus triggers content to appear, it is dismissible, hoverable, and persistent.
  • If the hover changes the content, add the accessibility support for that feature.
  • Content on hover must provide a mechanism to dismiss the additional content without moving the keyboard focus, and the aditional content must remain visible until the hover or focus trigger is removed.
    WCAG: Level AA Success Criteria  1.4.13
  • Include volume controls so a screen reader user can keep their system audio on (to hear the screen reader) but mute the audio in the course.
  • Volume control must be activated using the arrows keys.
    WCAG: Level A Success Criteria  1.4.2
  • If possible, avoid audio/video that plays automatically because screen readers can cause audio overlapping when they are reading the page or element instructions. But don’t be afraid to use video/audio! It can be great on a course; just let users choose when to play it.
  • For the best user experience, give learners the option to stop/pause anything that autoplays. Also include volume control.
  • If a keyboard shortcut is available to pause/stop the audio, then explain this shortcut at the beginning of the course.
    Include a way for users to toggle autoplay on/off.
    WCAG: Level A Success Criteria  1.4.2
  • Ensure all course features and functions can be used with a keyboard.
  • Avoid features associated with a keystroke time duration. (i.e., hold Enter for 3 seconds)
  • This does not forbid and should not discourage providing mouse input or other input methods in addition to keyboard operation.
    WCAG: Level A Success Criteria  2.1.1
  • Do not add time limits to activities unless the time limit is essential to the functionality, such as a timed exam.
  • If needed, give the user an option to turn it off, extend it or adjust it before it begins.
    WCAG: Level A Success Criteria  2.2.1
  • Provide a way for users to skip repeated blocks of content.
  • Make sure tabbing to something doesn’t activate it.
  • Don’t put repetitive elements on the slide if they can’t be skipped.
    WCAG: Level A Success Criteria  2.4.1
  • Customize the focus order to ensure the content follows a meaningful sequence and supports the functionality of interactions.
    WCAG: Level A Success Criteria   2.4.3
  • Provide more than one way to locate the content with the built-in navigation features, such as the course menu, site map, table of contents, links, bookmarks, search fields, and the previous and next buttons.
  • Add a description of the shortcuts at the beginning of the course.
  • Do not use single-key shortcuts unless you provide a way for users to change them or turn them off.
    WCAG: Level AA/A Success Criteria  2.4.5 –  2.1.4
  • Make sure navigation elements (e.g., menus and previous/next buttons) are positioned consistently on every page.
    WCAG: Level AA Success Criteria  3.2.3
© 2023 Inspire Accessibility.
Disclaimer