Accessibility testing using Raspberry Pi OS

By: Steve Wilkinson
Posted:
Tagged with:

Raspberry Pi OS

Note: I’m mostly a Windows user so if anyone has any tips or suggestions for using Raspberry Pi OS for digital accessibility testing and remediation, I will gratefully receive them.

I installed Raspberry Pi OS (bullseye) (external website) on to an 8GB Raspberry Pi 4 to test how well I could use Raspberry Pi OS to audit websites and remediate documents.

Screen readers

Windows has Jaws and NVDA, IOS has Voiceover, and Android has Talkback, but these are not available for Raspberry Pi OS. There are several screen readers available for Raspberry Pi OS:
• Orca Screen Reader (external website) – good for graphical environments
• Fenrir (external website) - good for command line (ideal for Raspberry Pi OS as it takes up little SD card space or RAM)
• Emacspeak (external website) - good for command line

Installing screen readers on Raspberry Pi OS

Orca Screen Reader

I installed Orca by going to the Terminal and typing in:

sudo apt install orca

Orca should be able to be opened or closed by Alt + F2, which opens the equivalent to the Windows dialog box and then orca entered as a command, then Enter.

When Orca Screen Reader is running the preferences can be accessed using “Orca Modifier” + Space, where the “Orca Modifier” is the Insert key on a desktop, and the Caps Lock key on a laptop.

I found Alt + F2 was not working so I used Ctrl + Alt + T to open a terminal window and typed

orca

and as Alt + F2 was not working, I typed

orca -s

as a command in the terminal window, then Enter (this works even if the screen reader is off).

I then checked in the General tab to make sure that Keyboard Layout was set to Desktop (which it was).

screen reader preferences with the keyboard layout set to desktop

I then went into the Voice tab and using the Rate slider, I made the speech quicker.

screen reader preferences with the keyboard layout set to desktop

Colour Contrast Checkers

I would normally use TPGi’s Colour Contrast Analyser (external website) in Windows, so I installed Gpick (external website) which I used alongside the Contrast Finder (external website) website to allow me to manually check for colour contrast.

GPick Colour Contrast Checker

To install Gpick, I followed the same installation steps using the terminal and

sudo apt install gpick

Other tools

Magnifier

I installed the screen magnifier tool so that I could test using this.

sudo apt update
sudo apt install mage

It can also be installed using “Add/Remove Software”

add remove software magnifier

Installing packages - please wait...

The Magnifier button appears down in the bottom right corner of the taskbar by the clock

Magnifier in the taskbar

The Magnifier in use

Browsers

Chrome extensions on Chromium

I had to login to the Chrome Web Store and then I was able to install Chrome extensions on Chromium.
The Chrome extensions I installed:
• Accessibility Insights for Web - Chrome webstore (external website) - accessibility testing tool
• Alt or not - Chrome webstore (external website) - see alt text on Twitter/X
• ARC Toolkit - Chrome webstore (external website) - accessibility testing tool
• axe DevTools - Chrome webstore (external website) - Web Accessibility Testing - accessibility testing tool
• HeadingsMap - Chrome webstore (external website) - shows all the headings in a sidebar
• WAVE Evaluation Tool - Chrome webstore (external website)
• Web Developer - Chrome webstore (external website)

Sadly Stylus (external website) was not available for the version of Chromium even though I’d updated my Raspberry Pi OS and checked I’d got the latest version of Chromium.

Chrome extensions on Firefox

I went to the Add/Remove Software and searched for Firefox and added it to Raspberry Pi OS.

Add remove software Firefox

I then installed the following Firefox extensions:
• ARC Toolkit - Firefox webstore (external website) - accessibility testing tool
• ARIA DevTools - Firefox webstore (external website) - spot missing ARIA labels, misused ARIA roles, and incomplete keyboard support
• axe DevTools - Firefox webstore (external website) - Web Accessibility Testing - accessibility testing tool
• HeadingsMap - Firefox webstore (external website) - shows all the headings in a sidebar
• Landmark Navigation via Keyboard or Pop-up - Firefox webstore (external website) - navigate web pages via WAI-ARIA
• Stylus - Firefox webstore (external website) - create, edit, and manage personalised CSS stylesheets. Custom CSS can be added to test spacing and show focus indicator
• Web Developer - Firefox webstore (external website) - adds a toolbar button with various web developer tools
• webhint - Firefox webstore (external website) - tests websites for issues with accessibility, browser compatibility, security, performance etc.
• WCAG Color contrast checker - Firefox webstore (external website) - checks the color contrast between the foreground and background of the elements that are in the page according to the WCAG 2.2

Code for Stylus

I added the Focus Style and Testing WCAG 1.4.12 Text Spacing CSS in Stylus.

JavaScript Bookmarklets

I also added the Adrian Roselli 24x24 bookmarklet (external website).

Auditing a website

Unlike with my laptop, where I was struggling to use the laptop with LibreOffice to edit my audit document, LibreOffice Writer was working well.

Auditing PDFs

As PAC 2024 (external website) does not currently work on Raspberry Pi OS, and wouldn’t work under WINE on ARM, I used Grackle GO to audit the PDFs I found during my website audit.

Remediating PDFs

While there is software that can read or edit PDFs on Linux, I’ve not found any that will remediate PDFs to a level that they can pass PAC 2024.

• Accessibility testing tools
• Basic Orca Tutorial (external website)
• GrackleDocs Grackle GO (external website)
• Installing Firefox on your Raspberry Pi (external website)
• Introduction to Orca Screen reader for Linux (external website)
• Latest Raspberry Pi OS update – May 2020 (external website)
• Orca Screen Reader (external website)
• Raspberry Pi OS Accessibility articles (external website)
• Survey of Screen-Readers in Linux Operating Systems (external website)

Share on:

Site preferences

Please feel free to display our site, your way by finding the preferences that work best for you. We do not track any data or preferences at all, should you select any options in the groups below, we store a small non-identifiable token to your browser's Local Storage, this is required for your preferencesto persist across pages accordion be present on repeat visits. You can remove those tokens if you wish, by simply selecting Unset, from each preference group.

Theming

Theme
Code block theme

Code theme help

Code block themes can be changed independent of the site theme.

  • Default: (Unset) Code blocks will have the same theme as the site theme.
  • Light 1: will be default for users viewing the light theme, this maintains the minimum 7:1 (WCAG Level AAA) contrast ratio we have used throughout the site, it can be quite difficult to identify the differences in colour between various syntax types, due to the similarities in colour at that contrast ratio
  • Light 2: drops the contrast for syntax highlighting down to WCAG Level AA standards (greater than 4.5:1)
  • Dark: Syntax highlighting has a minimum contrast of 7:1 and due to the dark background differences in colour may appear much more perceivable

Motion

Motion & animation

Motion & animation help

  • Default (Unset): Obeys device settings, if present. If no preference is set, there are subtle animations on this site which will be shown. If you have opted for reduce motion, smooth scrolling as well as expanding and collapsing animations will no longer be present, fading transtitions and micro animations will still be still present.
  • None: All animations and transitions are completely removed, including fade transitions.

Links

Underline all links

Underline all links help

  • Default (Unset): Most links are underlined, with a few exceptions such as: the top level links in the main navigation (on large screens), cards, tags and icon links.
  • Yes: Will add underlines to the exceptions outlined above, resulting in every link being underlined

Text and paragraphs

Font size (main content)

Font size help

This setting does not apply to the site's header or footer regions

  • Default (Unset): Font sizes are set to site defaults
  • Selecting Large or Largest will increase the font size of the main content, the size of the increase depends on various factors such as your display size and/or zoom level. The easiest way to determine which option suits you best would be to view this text after clicking either size's button
Letter spacing

Letter spacing help

  • Default (Unset): Default letter spacing applies
  • Increased: Multiplies the font size by 0.12 and adds the sum as spacing between each character
Line height

Line height help

  • Default (Unset): all text has a minimum line height of 1.5 times the size of the text
  • Increased: all text has a line height of twice the size of the text
Line width

Line width help

  • Default (Unset): all text has a maximum line width of 80 REM units (this averages around 110 characters per line)
  • Decreased: all text has a maximum line width of 55 CH units (this averages around 80 characters per line)
Paragraph spacing

Paragraph spacing help

  • Default (Unset): The space between paragraphs is equivalent to 1.5 times the height of the paragraph's text
  • Increased: The space between paragraphs is equivalent to 2.25 times the height of the paragraph's text
Word spacing preference

Word spacing help

  • Default (Unset): No modifications to word spacing are present
  • Increased: Spaces between words are equivalent to 0.16 times the font size