12.6 Covid-19 information modal cannot be dismissed with VoiceOver activated (H)

Close icon highlighted on Covid-19 modal

FIGURE 12.9: Close icon highlighted on Covid-19 modal

12.6.1 WCAG 2.1.1 (A), 2.4.3 (A) - iPad

When viewing the Home page on an iPad with VoiceOver activated, the Covid-19 information modal cannot be dismissed by touch or by swiping to the element to close the modal.

Content behind the modal is therefore obscured to these users.

12.6.2 Recommendation

When the modal window appears on screen, focus should move inside the modal window. User should then be able to the following:

  • dismiss the modal
  • let the screen reader announce the content within the modal
  • focus should remain in the modal until it is dismissed

Also ensure that content that is operable using a mouse, is 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.