Are you an instructor charged with putting together a textbook? You have resources available to help, especially with the Libretext remixer, but you’re reminded that it has to be accessible. You may not be familiar with accessibility integrations and inquire “What resources are available within Libretext to help with accessibility?”

That’s where the Libretext Accessibility Checker comes to help!

Libretext is housed within MindTouch, a CMS, and uses CKEditor 4 to import or create content. Within the editor, we have made a Davinci Vitruvian man available as the Accessibility Checker icon. This feature has both automated and manual fixes which authors interact with. Many of the automation features have manual overrides available so author’s have more control of how content is presented.

Arrow points to the Davinci Vitruvian man, the Accessibility Checker, the 22nd element in the toolbar.

Arrow points to the Davinci Vitruvian man, the Accessibility Checker, the 22nd element in the toolbar.

Once you have activated the Accessibility Checker, a popup appears allowing authors to select checks to perform, or to perform them all, which is the default setting. Abbreviations are excluded from the default at this time.

Screen Shot 2022-09-23 at 9.50.47 AM.png

Author’s have the ability to select proper accessibility, or enter a label to add an alt or title to be used to make an element more accessible.

Heading fixes

The tool will locate bold and italic content and suggest heading levels based on the page layout. H1 is always available at the top of the page, so Libretext may suggest H2, H3, and H4 to layout their textbooks. Containers (i.e. Learning Objectives, Examples, etc.) start with H5 and have H6, and H7 to help users navigate using headings. We’re using ARIA labels to create headings with a level of 7.

The Accessibility Checker recognizes the wrong heading was used for this Study Notes container and suggests H5 with a quick fix button to fix the issue.

The Accessibility Checker recognizes the wrong heading was used for this Study Notes container and suggests H5 with a quick fix button to fix the issue.

The Accessibility Checker recognizes bold text and suggests a heading of 6 since it’s within a container which starts with a heading 5, but has a drop down option to select a different heading if the suggestion isn’t correct..

The Accessibility Checker recognizes bold text and suggests a heading of 6 since it’s within a container which starts with a heading 5, but has a drop down option to select a different heading if the suggestion isn’t correct..

In the following screenshot, the Accessibility Checker identified bold text from a caption and suggested a heading 2. In the “Issue” notification of the checker, which shows the author is on 4 out of 9 issues, there are left and right buttons to allow authors to ignore suggested fixes. Once the “Quick fix” has been submitted, the issue will disappear from the list of issues.

Accessibility Checker has incorrectly located bold content within a caption and is suggesting a heading level of 2 be applied.

Accessibility Checker has incorrectly located bold content within a caption and is suggesting a heading level of 2 be applied.

Graphics and Alt Tags

For all graphics and images, the Accessibility Checker will require user interaction. The pop-up requesting alternative text for images give users the following options: