tldr: Say no to switch toggles. Say yes to checkboxes. (Unless you are Airbnb)
Switches can be ambiguous about their state and their intent.
IRL, they are usually vertical
Which side is on?
Or labeled for choosing modes
They don’t do RTL well
Using an RTL language? Which is the on side—turned to the right, or to the left?
The accent colours on the switch are a helpful clue.
But the colours can’t help when Digital Wellbeing turns on the grayscale mode.
But Google uses them
Yes, they do. They also appear to be learning the folly of their ways. Check out these screenshots from upcoming Android 12:
If it’s filled, it’s on. If it’s empty, it’s not.
There’s no right, left, up or down. Language doesn’t matter. Colour doesn’t matter. No ambiguity1. No confusion.
But we still wan’t to use switches
My hippo/designer/PM/developer wants to use a switch instead of a checkbox, and I can’t/won’t convince them otherwise.
There’s still two options. Both are more work, but the users will (quietly) thank you.
1. Use explicit state indicators
Don’t just use the default switch, put some effort into it. (Or just copy the best — Airbnb do it really well.)
2. Use explicit labels
I love this example.
- There’s a third mode often seen: the ‘dash’ed checkbox. First advice: never use it. If you have to use it, only use it to show a mixed state of a sub-group of checkboxes. Even then, don’t use it. ↩