Day 1. TalkBack, Accessibility on Android

Semantic and Accessible HTML

Switch devices are for people who’ve got limited dexterity or limited mobility.

iOS has an inbuilt voice over feature.

An element might be hidden on a page at a particular time. If the user is in screen reader mode, the reader will announce them.

The solution is to totally hide the element from the page using

.elem {
  display: none;
}
/* or */
.elem {
  visibility: hidden;
}

I tried the TalkBack accessibility reader on my Android phone. I went through some sites and simply couldn’t navigate them. It’s crazy how there’re people who make use of these assistive technologies everyday.

It basically focuses on every element on the screen and you double tap to click them. There’s a lot of gestures that activate different menus.

It’s possible to only focus on only certain types of elements on the page, like headings, links, etc.

aria-label="" attribute can be used to specify what will be announced to screen readers even if there’s no content in the HTML element.

aXe coconut is a tool for inspecting web pages for accessibility issues. It’s available as a chrome extension.