This content originally appeared on Adam Silver and was authored by Adam Silver
There’s been some comments about this on Twitter.
Snackbars—also known as toast messages—are little messages shown on top of the interface to give users feedback in response to an action they just did.
They’re designed to keep users focused on what they’re doing, which is why they’re small and automatically disappear after a few seconds.
But snackbars are problematic for lots of reasons. Here I’ll share what they are and offer some alternative solutions that don’t have these problems.
1. They disappear automatically #
Snackbars automatically disappear after a number of seconds. This rushes users to read or access them which can cause anxiety and stress.
Snackbars are especially challenging for people with cognitive and motor impairments, and people working in a busy environment.
Take someone who gets a phone call just as a snackbar appears and misses the message. They won’t know what’s happened after they put the phone down.
2. They’re hard to use via keyboard #
When snackbars appear, they don’t receive keyboard focus.
This makes it difficult for keyboard users to select the available actions because the snackbar is far away in terms of the tab sequence and will probably have disappeared by the time they get to it.
3. They can change state erratically #
Snackbars can change multiple times within a short space of time which makes them difficult to use.
For example, when you send an email with Gmail, the snackbar status changes 3 times:
It’s being sent #
Firstly, it says the email is being sent. The user can cancel or close the message.
This state is shown for less than a second which makes it almost impossible to click cancel. And there’s little point in closing the snackbar because the next state appears almost instantly.
It’s been sent but you can undo the send #
The snackbar updates to say the email has been sent. The user can undo, view the email or close the snackbar.
It’s been sent and you can’t undo the send #
After 5 seconds ‘Undo’ disappears, which leaves the user with the ability to view the email or close the snackbar.
It stays visible for 10 seconds before disappearing.
This erratic nature makes snackbars really hard to use.
4. They’re distracting and can obscure the screen #
Snackbars block out some of the screen which may cause users to stop what they’re doing in order to dismiss them. Or they could just wait for them to disappear.
Either way, distracting the users like this can be highly frustrating.
5. They’re hard to spot #
Snackbars are small and are shown at the bottom of the page—to the edge of the user’s view. This means there’s a risk the user won’t see them.
This problem is even worse for users who zoom in using a screen magnifier because there’s a good chance the snackbar will be completely out of view.
6. They’re inconsistently located compared to other messages #
Most system messages appear at the top of the page above the content. But snackbars appear at the bottom of the screen.
As different messages will appear in different locations, users will need to keep an eye on both locations which increases cognitive load.
What to use instead #
The short answer is to:
- show a prominent message at the top of the page
- draw focus to the message
- keep the message on screen until the user navigates away (or dismisses it)
The long answer is that alerts and notifications are complicated and need to take the specific context into account. More on this at the end.
Handling constant feedback #
Sometimes you need to give users constant feedback.
For example, when working on a Google doc the file is constantly switching between saved and unsaved states.
While the user needs to know whether the file is saved or not they don’t want to be constantly interrupted while they’re writing.
Google Docs puts a status message next to the menu at the top which works well in this context because it:
- doesn’t get in the way
- doesn’t draw user’s attention
- can be viewed at a glance
- can be clicked on to see what’s previously happened
Summary #
Notifications are meant to give users confidence about an action they perform so that they can proceed with confidence.
But, snackbars take control away from the user and can cause stress— turning the interface into a race against time.
If the user is working on something that requires close-to-constant feedback—like working on a Google doc—then add a persistent status area to the UI that users can check at a glance.
In most other cases just show the message front and center, without it automatically disappearing so users can see it and act on their own terms.
Thanks to Amy Hupe for editing this.
Notifications and alerts are a vital part of good design and I’ll be teaching my students all about them in my upcoming video course on good design.
I’ve got lessons on 8 different ways to deal with notifications and alerts depending on the situation and none of them involve a snackbar.
If this sounds interesting, you can sign up to my newsletter and get course updates below.
This content originally appeared on Adam Silver and was authored by Adam Silver
Adam Silver | Sciencx (2020-03-15T00:00:00+00:00) 6 reasons why toast messages are a bad idea and what to do instead. Retrieved from https://www.scien.cx/2020/03/15/6-reasons-why-toast-messages-are-a-bad-idea-and-what-to-do-instead/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.