15.2 Important information does not render correctly on mobile devices (H)

Important message highlighted on the postgraduate page

FIGURE 15.4: Important message highlighted on the postgraduate page

Important info message highlighted on the timetables page

FIGURE 15.5: Important info message highlighted on the timetables page

important message activated on an iPhone device

FIGURE 15.6: important message activated on an iPhone device

15.2.1 WCAG 1.4.10 (AA), 4.1.1 (A) - Mobile

The Postgraduate page includes a circular icon with the text ‘Important information about the course’, which does not render correctly on iPhone and Android devices with the screen reader activated, making it difficult for users to perceive this important information.

This issue persists with the ‘Important info for Sport Science’ icon message on the Timetables page which does not render correctly on mobile and once activated the content within the modal is obscured off screen.

15.2.2 Recommendation

Ensure that functionality is consistent when the site is viewed on multiple devices and browsers by implementing a responsive design. Design preferences and development techniques, like user-scalable=“no” parameter, have been seen as best practice in the past but have always caused issues for users of assistive technology.

For more information on designing for different browsers and devices