7.2: Accessibility Reports for H5P Activity Types
- Page ID
- 353773
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
\( \newcommand{\id}{\mathrm{id}}\) \( \newcommand{\Span}{\mathrm{span}}\)
( \newcommand{\kernel}{\mathrm{null}\,}\) \( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\) \( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\) \( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\id}{\mathrm{id}}\)
\( \newcommand{\Span}{\mathrm{span}}\)
\( \newcommand{\kernel}{\mathrm{null}\,}\)
\( \newcommand{\range}{\mathrm{range}\,}\)
\( \newcommand{\RealPart}{\mathrm{Re}}\)
\( \newcommand{\ImaginaryPart}{\mathrm{Im}}\)
\( \newcommand{\Argument}{\mathrm{Arg}}\)
\( \newcommand{\norm}[1]{\| #1 \|}\)
\( \newcommand{\inner}[2]{\langle #1, #2 \rangle}\)
\( \newcommand{\Span}{\mathrm{span}}\) \( \newcommand{\AA}{\unicode[.8,0]{x212B}}\)
\( \newcommand{\vectorA}[1]{\vec{#1}} % arrow\)
\( \newcommand{\vectorAt}[1]{\vec{\text{#1}}} % arrow\)
\( \newcommand{\vectorB}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vectorC}[1]{\textbf{#1}} \)
\( \newcommand{\vectorD}[1]{\overrightarrow{#1}} \)
\( \newcommand{\vectorDt}[1]{\overrightarrow{\text{#1}}} \)
\( \newcommand{\vectE}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash{\mathbf {#1}}}} \)
\( \newcommand{\vecs}[1]{\overset { \scriptstyle \rightharpoonup} {\mathbf{#1}} } \)
\( \newcommand{\vecd}[1]{\overset{-\!-\!\rightharpoonup}{\vphantom{a}\smash {#1}}} \)
Summary
This document includes a guide designed to help H5P content authors avoid creating accessibility barriers for users. The purpose is to ensure the H5P activities are as accessible as currently possible. Content authors should also follow all accessibility techniques for digital content. For additional information, review ASCCC Quick Guides Accessibility Overview and Accessibility Resources.
Accessibility Standards
The Academic Senate for California Community Colleges (ASCCC) Open Educational Resources Initiative (OERI) uses the Revised 508 Standards as the minimum accessibility standards for instructional content like H5P activities. ASCCC recommends using content that conforms with the Revised 508 Standards, including WCAG 2.0 levels A and AA. This means that various users with disabilities can read, understand, and interact with content and activities with about as much effort as users without disabilities.
Reported Accessibility Barriers
ASCCC identified accessibility barriers with H5P activities in April 2020 and provided detailed feedback to H5P developers. For example, ASCCC identified significant accessibility failures with the Mark the Words activity type. In response, H5P updated the Content types recommendations page to include the accessibility barriers with the Mark the Words activity type.
ASCCC reported the following results for the activity types ASCCC evaluated:
- Drag the Words, not recommended
- Fill in the Blanks, recommended with workarounds
- Mark the Words, not recommended
- Multiple Choice, recommended with workarounds.
All the H5P activities evaluated have accessibility barriers affecting users who are blind and users with learning disabilities who use assistive technology to read the content aloud. These include but are not limited to:
- No option to set the correct language for the activity
- No option to set the correct language for content
- No title for the activity iframe.
After meeting with H5P developers, ASCCC determined that it could provide training to content authors to make some H5P activities more accessible. Other accessibility barriers identified still need to be addressed by H5P.
Accessibility Testing
In November 2021, LibreTexts conducted accessibility testing of 46 H5P activity types. Each activity type was assessed for conformance with WCAG 2.1 levels A and AA standards related to:
- Visible Indication of Focus
- Minimum Color Contrast
- Keyboard Usability
- No Keyboard Traps
- Zoom up to 200% and up to 400% (reflow)
- Usability with JAWS screen reading software.
Each of the 47 H5P activity types were rated:
- Usable with Best Practices: the activity requires minimal adjustments by content authors
- Usable with Workarounds: the activity requires significant adjustments by content authors
- Requires Alternative Activity: the activity is not usable by some users.
Workarounds
The accessibility reports for each H5P activity include important reminders with workarounds so that content authors may avoid creating accessibility barriers.
For example, there are two specific workarounds recommended for the H5P Accordion activity.
- The H5P content is organized as Panels. Each panel requires a Title. H5P codes the Titles as headings (<h2>), but the headings do not work with assistive technology. It is most likely because H5P also codes the Titles as buttons (role=button).
- As a workaround, content authors should begin the content inside each panel with a properly structured heading.
- When the page content is magnified and an accordion panel is expanded, some of the content in the panel may not be visible on the screen without requiring vertical scrolling. However, when the accordion content is all text, there is no option to scroll through the accordion content with the keyboard. If there is a link or other keyboard focusable element inside the accordion panel, when a user moves the keyboard focus into the panel, the contents of the panel may be scrolled using the keyboard with the Up and Down arrow keys.
- As a workaround, content authors should include a link with descriptive text or other focusable element inside the content of accordion panels to support scrolling using the keyboard.
Results
The following tables summarize the results of the accessibility testing. The first table is an overview of the accessibility of H5P activities. The second table lists the results for each H5P activity type.
H5P Activities Accessibility Overview
| Conformance Level | Definition | Count by Level | Percent by Level |
|---|---|---|---|
|
Usable with Best Practices (labeled in green) |
The activity requires minimal adjustments by content authors |
5 |
10% |
|
Usable with Workarounds (labeled in yellow) |
The activity requires significant adjustments by content authors |
25 |
50% |
|
Requires Alternative Activity (labeled in red) |
The activity is not usable by some users |
17 |
34% |
|
Not Evaluated (labeled in blue) |
The activity type was not evaluated |
3 |
6% |
| Total | Number of H5P activities | 50 | 100% |
H5P Accessibility by Activity
| H5P Activity | Overall Usability |
|---|---|
| Accordion | Usable with Workarounds |
| Advanced Fill in the Blanks | Requires Alternative Activity |
| Advent Calendar (Beta) | Usable with Workarounds |
| Agamotto (Image Blender) | Requires Alternative Activity |
| appear.in for Chat and Talk | Not Evaluated |
| Arithmetic Quiz | Usable with Workarounds |
| Audio | Usable with Workarounds |
| Audio Recorder | Usable with Workarounds |
| Branching Scenario | Usable with Workarounds |
| Chart | Requires Alternative Activity |
| Collage | Requires Alternative Activity |
| Column | Usable with Workarounds |
| Course Presentation | Usable with Workarounds |
| Crossword | Usable with Best Practices |
| Dialog Cards | Usable with Workarounds |
| Dictation | Usable with Workarounds |
| Documentation Tool | Usable with Workarounds |
| Drag and Drop | Usable with Workarounds |
| Drag the Words | Requires Alternative Activity |
| Essay | Usable with Best Practices |
| Fill in the Blanks | Usable with Best Practices |
| Find Multiple Hotspots | Requires Alternative Activity |
| Find the Hotspot | Requires Alternative Activity |
| Find the Words | Requires Alternative Activity |
| Flashcards | Usable with Workarounds |
| Guess the Answer | Usable with Best Practices |
| Iframe Embedder | Not Evaluated |
| Image Choice | Usable with Workarounds |
| Image Hotspots | Usable with Workarounds |
| Image Juxtaposition | Requires Alternative Activity |
| Image Pairing | Requires Alternative Activity |
| Image Sequencing | Usable with Workarounds |
| Image Slider | Usable with Workarounds |
| Interactive Book | Usable with Workarounds |
| Interactive Video | Usable with Workarounds |
| KewAr Code | Requires Alternative Activity |
| Mark the Words | Requires Alternative Activity |
| Memory Game | Usable with Workarounds |
| Multiple Choice | Usable with Workarounds |
| Personality Quiz | Requires Alternative Activity |
| Quiz (Question Set) | Usable with Workarounds |
| Single Choice Set | Usable with Workarounds |
| Sort Paragraphs | Usable with Workarounds |
| Speak the Words | Requires Alternative Activity |
| Speak the Words Set | Requires Alternative Activity |
| Summary | Usable with Workarounds |
| Timeline | Requires Alternative Activity |
| True or False Question | Usable with Best Practices |
| Twitter User Feed | Not Evaluated |
| Virtual Tour (360) | Requires Alternative Activity |