Applying accessibility on the Moodle App

Screen readers

VoiceOver and TalkBack are the native applications for screen reading in iOS and Android devices. In order to make the code understandable to these applications we encourage the developers to use the Rich Internet Applications (WAI-ARIA) 1.1 recommendations of W3C. Those documents includes a bunch of rules to be applied to the HTML code to add semantic information to it.

First step on that is to the role of the main elements of navigation and information of the page. Then, you should apply the correct aria attributes to the elements that conform that role.

Here you have some examples of how to apply these attributes.

Tools and resources

These are some tools and resources that can be useful to improve accessibility:

• ARIA DevTools browser extension — Navigate a site like a non-sighted user would.
• headingMaps browser extension — Navigate page headings.
• Landmarks Navigation browser extension — Navigate landmarks.
• Accessibility Pane in Chrome — Inspect accessibility roles and values.
• BingO Bakery: Headings, Landmarks, and Tabs — Video introducing some basic concepts.