9.3 Important information is not accessible using the keyboard alone (H)

FIGURE 9.8: important info message highlighted on the Postgraduate page

FIGURE 9.9: important message modal activated using a mouse

9.3.1 WCAG 1.3.1 (A), 2.1.1 (A), 2.4.6 (AA) - Desktop

The ‘Postgraduate course’ page includes an ‘Important information about the course’ icon which is not accessible using the keyboard alone. A pointing device such as a mouse must be used in order to access these elements. For a similar issue see Covid-19 information modal cannot be dismissed with VoiceOver activated (H)

Users can’t access a web page’s functionality if they can’t access its interactive interface components. Many people, including those who are blind or who have low vision or hand tremors, rely on a keyboard (or keyboard alternate) to access those components.

Furthermore, this message is positioned at the bottom right-hand side of the page. This is not helpful as it could be easily missed by users and could cause particular problems for low vision users navigating the site with screen magnification software.

9.3.2 Recommendation

Content that is operable using a mouse needs to be operable by keyboard users as well, particularly when using assistive technologies. Ensure that all interactive elements can be triggered via onfocus and TouchEvents as well as the mouse.

Reposition the icon to the top of the page so that low vision users will see this icon first, highlighting the importance of the information.

Add visually hidden text or an alt text to the info icon to notify screen reader users that the following information is important.

---