Are toast messages accessible?

On the web, a “toast” refers to a pop-up message that provides brief feedback to the user, such as a status update or a new action. In their most common form, toast messages appear temporarily and are often visually small and located to one side or corner of the interface.

Toast messages have become increasingly popular, especially in complex user interfaces. They are often used to inform users about an update, such as that your message was sent, your file finished uploading, or someone has posted a new comment. 

Toast messages are intended to provide new information without significantly disrupting the user, but in practice that can be a difficult balance to achieve.

Before implementing toast messages, consider the benefits and drawbacks to your users. Other strategies may meet your users’ needs without the added complexity of a toast message.

If you opt to include toast messages, there are several potential accessibility issues to address:

Finding the Toast

If a toast message does not have any auditory notification, nonvisual or low vision users may never know that a message appeared.

Toast messages are often designed to be visually unobtrusive. However, these design characteristics can also make the toast harder to find by users with low vision. For users who rely on screen magnification, the toast message may not appear in their viewing area at all unless the user shifts to the correct corner of the interface.

Reading the Toast

When toast messages automatically disappear, this imposes a time limit on the user to find and read the message. Time limits can prevent access by users who need more time to locate the content. They can also block users with cognitive or learning disabilities such as dyslexia or psychiatric disabilities such as anxiety.

Ignoring the Toast

Toast messages can be distracting, particularly for users with disabilities related to attention or focus. Frequent toast messages may constantly pull a user’s attention away from their main task.

Improvements

• Consider including a nonvisual notification of a new toast message, such as a sound. The sound should not exceed 3 seconds, and ideally should be much shorter.
• Code the toast messages as polite alerts. This will trigger certain assistive devices, such as screenreaders, to announce the content at a convenient moment after the toast appears.
• Give users control. When users have options, they can configure the toast to meet their needs. Users should be able to control whether toast messages appear, whether they have a sound notification, where they appear, and how long they remain visible.
• Consider alternatives. Whether in addition to or instead of a toast, status updates in the page content itself or a permanently available activity log can provide the same information with fewer potential accessibility barriers.

The best way to understand how well your toast messages are working is to test them with real users with disabilities. Learn more about the flexible Accessibility Testing process at Accessible Web.