Check the accessibility of the educational material

General

In this page you may find an outline and description of the procedure for ensuring the accessibility of digital educational material. Please, mind that the most basic and important thing is assuring that the content tailored to the target audience and is effective in achieving the learning goals.

Related topics

Key tips

Evaluate the approach
  1. Skim the content of the document.
  2. Identify the aim or goal.
  3. Identify the target audience.
  4. Evaluate the fitness of the presentation of the information to the target audience.
Determine the type of digital content
  • Only digital text. E.g. txt.
  • Images. E.g. jpg, svg, …
  • Office document. E.g. Word.
  • Slides. E.g. PowerPoint slides.
  • Spreadsheet. E.g. Excel workbook.
  • Multimedia. E.g. Video.
  • Interactive. E.g. Web application.
Perform automated accessibility assessment

There are software tools that automates this procedure of checking the accessibility of the digital educational material. These tools highlight the potential accessibility issues and suggest actions to remove or mitigate them. This is helpful as it reduces efforts to ensure accessibility, but some aspects of accessibility are not covered by automatic accessibility checkers.

  • When accessibility checkers are available, their use should be one of the first steps to address when checking the accessibility of educational materials.
  • You may find some of these tools in the “Tools for checking the accessibility” section.
Check the text
  • Language oriented to the target audience.
  • Use simple language. Technical terms and acronyms are explained.
  • Consistent writing style through the document.
  • Avoid long chunks of text when possible. E.g. split content using lists.
  • Avoid using sensory cues like colour, shape, size, orientation and spatial position..
Check images
  • All non-text elements have a text alternative.
  • Decorative and non-relevant non-text elements are marked as such. Ie. they have empty alternative text in HTML.
  • Alternative texts are short.
  • Complex non-text elements have a text description which is longer than their alternative texts.
  • Animations should avoid flashing. Ie. less than 3hz (3 changes per second) high-contrast colour changes. See: Understanding Seizures and Physical Reactions - Understanding Docs - W3C.
Check colour
  • Relevant elements have a high enough contrast to be easily perceived. For example, an accessible colour scheme is black text on a pale white background.
  • Size affects the accessible contrast threshold, the larger the size the lower the threshold. Relevant larger scale elements require less contrast to be accessible (contrast ratio 3:1), while smaller elements need higher colour contrast (contrast ratio 4.5:1).
  • It is good practice to have an accessible colour contrast on all elements but, where this is not possible, non-relevant elements such as decorative or inactive elements may have a lower contrast. See: See: Understanding minimum contrast - Understanding Docs - W3C
  • Meaning is not carried only by colour. E.g. referring to a piece of text only by its font colour. See Understanding the use of colour - Understanding Docs - W3C
Check links and buttons
Check the layout
  • Consistent text style -font and text size- through the document.
  • Tables are not used for layout purposes. Tables are used only for displaying tabular data.
  • Use headings and subheadings to organise the content. Headers only contain sub-headers of lower order and heading levels are not skipped.
  • Use special formatting for quotes, code snippets and other special elements.
  • Use semantic structure:
    • The different text styles have attached meaning. Eg.  use of styles in Word to add headings.
    • Unordered lists. Items should be preceded by programmatically placed bullet points.
    • Ordered lists. Items should be preceded by programmatically placed numbering elements. I.e. 1, 2, 3, … or a), b), c), …
  • Know more at: Use a Clear and Understandable Page Structure - Supplemental guidance to WCAG.
Check tables
  • All tables should have headers.
  • Use simple headers. Avoid the use of merged cells and multiple column/row headers.
  • The content of the headers should describe accurately the content of columns and rows.
  • There are no merged cells or nested tables (table inside of a cell).
  • There are no empty cells. E.g. empty cells could take the N/A value instead.
  • All tables have a table caption that describes concisely its content.
  • The content is ordered in a logical manner. The order should help to understand the data and meet the purpose of the table.
Check the navigation
  • Headings are descriptive of the content they introduce.
  • The heading structure is logical and makes it easy to find content through the document.
  • Provide non linear access methods like tables of the content or site map in large digital documents.
  • Ensure keyboard-only access. Users should be able to navigate without the use of a pointing device. See: Understanding Keyboard Accessible - Understanding Docs - W3C
  • Only for web content.
Check magnification issues
  • Prefer vector graphics over raster images.
  • Raster images must have a high enough resolution so that the relevant details can be clearly perceived when the image is enlarged.
  • Avoid text in images. When unavoidable, relevant text should be in the alternative text or large description of the image. See: Understanding Images of Text - Understanding Docs - W3C
  • If the document allows scaling, make sure that text overflows correctly and the layout does not change logical reading order.
Check videos
Check forms
Tools for checking the accessibility

Resources