Best Practice 4.2 – Ensure all interactive elements can be identified correctly (Baseline level)

Ensure all interactive elements on a mobile application can be correctly identified by the assistive technologies. As a result, screen reader can clearly tell its user the role of the element, its name, and its function as well as its status. This allows screen reader users to interact with digital content and operate effectively.

Before Rectification

After Rectification

Screen reader read out the element name, role and current status

In this example, screen reader simply reads out the names of elements without explaining their functionality, so users are unable to operate the interface.

Screen reader read out the element name (e.g. language, font size, seminars, workshop), role (e.g. button, scrollbar, textbox, checkbox) and their current status on the screen (e.g. on/ off, disable), please refers to the example below:

Element on screen	Screen reader read as	Meaning
	繁體中文, tab 1 of 3 簡體中文 tab 2 of 3、 Selected English, tab 3 of 3	This is a 3-tabs element. The first tab named “繁體中文” The second tab named “簡體中文” The third tab, which is currently selected, named “English”
	What’s new, toggle button, on	This is a toggle switch. Named as “What’s new” Currently is “on” status