Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

Table of Contents

Table of Contents
minLevel1
maxLevel6
outlinefalse
styledisc
typelist
printabletrue

Overview

Popups are not a good user experience for keyboard-only users and screen reader users and as a rule of thumb should be avoided.

If there is no other solution than a popup use a modal window. It must be programmed in a way that allows for the following.

Ensure that keyboard focus is visible and not obscured when a new window is opened, so that keyboard users can easily identify where they are within the content.

Keyboard focus indicators cannot be obscured by a popup window.

Popups

Popups are not a good user experience for keyboard-only /users and screen reader users and as a rule of thumb we should steer away from using themshould be avoided.

When a an automatic popup appears it does not by default have keyboard focus which means that keyboard only /and screen reader users are unable to tab to use the TAB key on the keyboard to immediately access the content within the popup and close the popup. Screen reader and keyboard-only users can easily become distracted and disoriented. 

When a popup unexpectedly appears it does not have keyboard focus which means that screen reader users are unable to use the TAB key on the keyboard to navigate to the content within the popup. They cannot visually see the popup on the screen, unless it's automatically programmed to completely shift the focus away from the main window. However, this would be very disorienting to screen reader users. 

Unexpected and automatic popup windows should not appear without warning or notification.

Users should be provided with a mechanism, such as a link or button, to activate a new window.

Ensure that keyboard focus is visible and not obscured when a new window is opened, so users can easily identify where they are within the content. Sighted keyboard only users navigate web pages by using the TAB key on the keyboard through actionable items such as links, buttons and form controls. They rely on keyboard focus indicators (a border or outline) to let them know what item has keyboard focus. Keyboard focus indicators cannot be obscured by a popup window.

New windows should not automatically be launched, and change context, when a component receives focus.

Modal Windows

If there is no other solution than a popup use a modal window. It must be programmed in a way that allows for the following.

...

https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-modal

New Windows

Ensure that keyboard focus is visible and not obscured when a new window is opened, so users can easily identify where they are within the content. Keyboard focus indicators cannot be obscured by a popup window.

Prevent changes in content that have not been initiated by the user and that could obscure the focus or distract users.

WCAG Related Guidelines

2.4.7 Focus Visible (Level AA)