alt Hacker NewsMeanwhile, GitHub is removing Toasts from Primer, their design system.[1] They’re next to impossible to implement in a way that retains accessibility across all needs, and if you try to restrict their usage to places where accessibility doesn’t matter so much (simple ephemeral confirmations) people misuse them anyway.
It’s notable that accessibility isn’t mentioned once in this post, or, in fact, in the component’s documentation.
Replies
GitHub is also limiting the new PR review page to only show 40 comments from reviewers. Who knows which 40. If you want to see more, they have a banner that tells you to switch back to the legacy view. No idea if they'll just silently lose the feature of "seeing all your PR's comments" once the legacy view is discontinued.
So I wouldn't take any inferences from their design system as gospel.
I’m the design leader for an enterprise software company and would love to get rid of toasts. Places where feedback is immediate don’t need them and simple forms can probably be fine with a banner or alert.
Reasons that toasts are difficult to get rid of:
- Easy for developers to implement consistently.
- Providing feedback where actions are taken on elements not on the screen (like bulk actions on a data grid, or within our workflow).
- Dense UIs where actions are taken frequently and injecting an alert or banner to be dismissed adds a ton of work for users. Also, causing the UI to jump isn’t great.
Would love to hear solutions to the above.
Not too hopeful with accessibility, as it isn't pleasant to use at all with reduced motion enabled. They flicker when added and linger around when swiped away.
When async notifications arrive from background processes… How is the user notified? (Not defending toasts, just curious how to do it better.)
> It’s notable that accessibility isn’t mentioned once in this post, or, in fact, in the component’s documentation.
It's a red flag for sure. That said, there's nothing preventing toasts from being accessible: https://react-spectrum.adobe.com/react-aria/useToast.html
I think it would be accurate for GitHub to say, "GitHub no longer uses toasts because we didn't want to make the effort to make them accessible or usable."