Designing Toast Messages for Accessibility

Three toast messages, the first is informational and says “great job” the second is success and says “the server configuration changed” with a close icon and the third is a warning saying “the configuration changed” with a link to reload the server and a close icon

Issue #1: How long should toasts stay up for?

iPhone notification center showing messages from Pokemon, New York Times, Grubmarket and Ibotta

Issue #2: What other Level AA accessibility guidelines do toast messages need to follow?

  1. Is not a full URL
  2. Is not vague (such as “learn more”) UNLESS you have an ARIA override which announces “learn more about restarting the server” or something more descriptive
  3. Is not the same link text announcement going to two different places
  4. Is not ALL CAPS

Issue #3: Are there other A11Y Best Practices that toast messages should follow?

Conclusion

--

--

--

LinkedIn Top Voice for Social Impact 2022. UX Collective Author of the Year 2020. Disability Inclusion SME. Sr Staff Accessibility Architect @ VMware.

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Launching the Nexon EV 3D Commerce Experience: Ambitions, Setbacks and success

5 Tips for Designing Data-Dense Products

Case study: User flow uncovering—Disney+

Home Elevator Fundamentals Explained

logo design service

IntroDPD Pre-test: kl875, Nicole Lai

Revamping the Qiscus website — a UX case study

Toon Shader

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Sheri Byrne-Haber, CPACC

Sheri Byrne-Haber, CPACC

LinkedIn Top Voice for Social Impact 2022. UX Collective Author of the Year 2020. Disability Inclusion SME. Sr Staff Accessibility Architect @ VMware.

More from Medium

Images and Alternative text

Picture showing the benefits of using alternative text for images as for screen reader interpretation, search engines, and broken images

Accessibility Personas

Persona for low vision user, Name Nat, 28yrs, Female, student in distance learning course, wants to be able to do everything independently. Frequently used devices are: Laptop, mobile phone and I-pad. Sites with great experience: Linked in,BBC, H&M

The accessibility no-win scenario: autocomplete and help text

A landmark that reads “Future Birthplace of Captain James T. Kirk March 22, 2228”

Day 16 — Inclusive Designs (Part 1 of 2)