Skip to main content
Chemistry LibreTexts

H5P Accessible Alternative Examples

  • Page ID
    367049
  • \( \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}}} \)

    \(\newcommand{\avec}{\mathbf a}\) \(\newcommand{\bvec}{\mathbf b}\) \(\newcommand{\cvec}{\mathbf c}\) \(\newcommand{\dvec}{\mathbf d}\) \(\newcommand{\dtil}{\widetilde{\mathbf d}}\) \(\newcommand{\evec}{\mathbf e}\) \(\newcommand{\fvec}{\mathbf f}\) \(\newcommand{\nvec}{\mathbf n}\) \(\newcommand{\pvec}{\mathbf p}\) \(\newcommand{\qvec}{\mathbf q}\) \(\newcommand{\svec}{\mathbf s}\) \(\newcommand{\tvec}{\mathbf t}\) \(\newcommand{\uvec}{\mathbf u}\) \(\newcommand{\vvec}{\mathbf v}\) \(\newcommand{\wvec}{\mathbf w}\) \(\newcommand{\xvec}{\mathbf x}\) \(\newcommand{\yvec}{\mathbf y}\) \(\newcommand{\zvec}{\mathbf z}\) \(\newcommand{\rvec}{\mathbf r}\) \(\newcommand{\mvec}{\mathbf m}\) \(\newcommand{\zerovec}{\mathbf 0}\) \(\newcommand{\onevec}{\mathbf 1}\) \(\newcommand{\real}{\mathbb R}\) \(\newcommand{\twovec}[2]{\left[\begin{array}{r}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\ctwovec}[2]{\left[\begin{array}{c}#1 \\ #2 \end{array}\right]}\) \(\newcommand{\threevec}[3]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\cthreevec}[3]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \end{array}\right]}\) \(\newcommand{\fourvec}[4]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\cfourvec}[4]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \end{array}\right]}\) \(\newcommand{\fivevec}[5]{\left[\begin{array}{r}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\cfivevec}[5]{\left[\begin{array}{c}#1 \\ #2 \\ #3 \\ #4 \\ #5 \\ \end{array}\right]}\) \(\newcommand{\mattwo}[4]{\left[\begin{array}{rr}#1 \amp #2 \\ #3 \amp #4 \\ \end{array}\right]}\) \(\newcommand{\laspan}[1]{\text{Span}\{#1\}}\) \(\newcommand{\bcal}{\cal B}\) \(\newcommand{\ccal}{\cal C}\) \(\newcommand{\scal}{\cal S}\) \(\newcommand{\wcal}{\cal W}\) \(\newcommand{\ecal}{\cal E}\) \(\newcommand{\coords}[2]{\left\{#1\right\}_{#2}}\) \(\newcommand{\gray}[1]{\color{gray}{#1}}\) \(\newcommand{\lgray}[1]{\color{lightgray}{#1}}\) \(\newcommand{\rank}{\operatorname{rank}}\) \(\newcommand{\row}{\text{Row}}\) \(\newcommand{\col}{\text{Col}}\) \(\renewcommand{\row}{\text{Row}}\) \(\newcommand{\nul}{\text{Nul}}\) \(\newcommand{\var}{\text{Var}}\) \(\newcommand{\corr}{\text{corr}}\) \(\newcommand{\len}[1]{\left|#1\right|}\) \(\newcommand{\bbar}{\overline{\bvec}}\) \(\newcommand{\bhat}{\widehat{\bvec}}\) \(\newcommand{\bperp}{\bvec^\perp}\) \(\newcommand{\xhat}{\widehat{\xvec}}\) \(\newcommand{\vhat}{\widehat{\vvec}}\) \(\newcommand{\uhat}{\widehat{\uvec}}\) \(\newcommand{\what}{\widehat{\wvec}}\) \(\newcommand{\Sighat}{\widehat{\Sigma}}\) \(\newcommand{\lt}{<}\) \(\newcommand{\gt}{>}\) \(\newcommand{\amp}{&}\) \(\definecolor{fillinmathshade}{gray}{0.9}\)

    Example 1

    H5P Drag the Words

    Example 1 Accessibility Barriers 

    H5P Drag the Words accessibility barriers include, but are not limited to:

    • Limited support for screen reading software
      • Impacts users who are blind or who have low vision
    • Draggable text that is longer than 17 characters is obscured after being dropped
      • Impacts users with learning disabilities
      • Impacts users with limited dexterity
    • No support for programmatic lists
      • Impacts users of screen reading software
    • No support for programmatic heading (separate from the question text) 
      • Impacts users of screen reading software (used for navigation)
    More Accessible Alternative for Example 1

    Example Instructions for H5P Multiple Choice

    The multiple choice questions in this textbook are designed to be usable and accessible.  For example, they work with screen reading software and they do not require the use of a mouse to answer the questions.

    Generally, the multiple choice questions also work when the page is magnified up to 400% using the browser settings or when viewed on a mobile device.  However, when magnified or viewed on a mobile device, the Retry button text may not be visible: 

    • If the Retry button text is not visible, the Retry button can be identified by an icon with a circular arrow pointing towards the right.

    Example 2

    H5P Fill in the Blanks

    Example 2 Accessibility Barriers 

    H5P Fill in the Blanks accessibility barriers include, but are not limited to:

    • No support for programmatic heading (separate from the question text)
      • Impacts users of screen reading software (used for navigation)
    • No instructions for users that require magnification up to 400%
      • Impacts users with low vision and users of mobile devices
    • Instructions do not specify that grammatically correct capitalization is required (alternately, the answer may not need to be case sensitive)
      • Impacts users with learning disabilities
      • Impacts users with limited dexterity
    • Instructions do not specify the correct number of answer blanks (the number of blanks is visually apparent so it must be included in the instructions of users who are not able to see the activity)
      • Impacts users who are blind or who have low vision
      • Impacts users with learning disabilities
    Example 2 Updated for More Accessibility

    Example Instructions for Fill in the Blanks

    The fill in the blanks questions in this textbook are designed to be usable and accessible.  For example, they work with screen reading software and they do not require the use of a mouse to answer the questions.

    Generally, the multiple choice questions also work when the page is magnified up to 400% using the browser settings or when viewed on a mobile device.  However, when magnified or viewed on a mobile device, the Show Solution and Retry button text may not be visible:

    • If the Show Solution button text is not visible, the Show Solution button can be identified by an icon with an eye.
    • If the Retry button text is not visible, the Retry button can be identified by an icon with a circular arrow pointing towards the right.

    Example 3

    H5P Find the Hotspot

    Example 3 Accessibility Barriers 

    H5P Find the Hotspot accessibility barriers include, but are not limited to:

    • Not keyboard accessible
      • Impacts users with limited dexterity
      • Impacts users of screen reading software
    • No support for screen reading software
      • Impacts users who are blind or who have low vision
    • No support for programmatic heading (separate from the question text)
      • Impacts users of screen reading software (used for navigation)
    • No support for magnification up to 400%
      • Impacts users with low vision and users of mobile devices
    More Accessible Alternative for Example 3

    Example 4

    H5P Mark the Words

    Example 4 Accessibility Barriers 

    H5P Mark the Words accessibility barriers include, but are not limited to:

    • Not usable with screen reading software
      • Impacts users who are blind or who have low vision
    • No support for programmatic heading (separate from the question text)
      • Impacts users of screen reading software (used for navigation)
    More Accessible Alternative for Example 4

    H5P Accessible Alternative Examples is shared under a not declared license and was authored, remixed, and/or curated by LibreTexts.

    • Was this article helpful?