5 ms·
This is cool, but I really dislike those kinds of switches. Pretty, yes, but also confusing to users unfamiliar with them. Say the switch is to the right, and
by mistercow 13y ago
This is cool, but I really dislike those kinds of switches. Pretty, yes, but also confusing to users unfamiliar with them.
Say the switch is to the right, and then word ON is to the left. If you click the switch, it moves to the left. Does that mean you turned the switch on, since the switch moved to where the word "ON" was? Or does it mean the switch is off because now the word "OFF" is visible?
Even knowing the answer, as an only-occasional mobile user I still find these switches require extra cognitive load, which is not what you want from a UI element.
- dools 13y agoI can't find the article but someone posted a rather elegant solution to this which basically involves cutting a hole in the switch so you can see the word beneath it.
- jagan123 13y agoYes, I remember reading that blog post. Couldn't find the link now. The author tried explaining various types of switches and provided best alternatives - one among those is having a hole in the switch. One more is having a 'push' effect on the switch.
- dools 13y agoSorted!
- dools 13y agoHey jagan123 I can't reply to you directly but it looks as though you're banned so no-one can see your comments.
- ams6110 13y agoMy suggestion last time I commented on this was to do it like a real sliding switch, put the labels outside the control, something like: ON |XX | OFF (Where XX is the sliding part).
- minor_nitwit 13y agoGood point. On android the state is written on the slider itself, so that there's no question of what the state is. If it says on it's on, when you slide it the other way it will no doubt be off.
- arnarbi 13y agoI don't like these switches either, but I doubt they are generally confusing. They've been around for a long time in the physical world. http://blogs.hillandknowlton.com/scottmckenzie/files/2012/03/Light-switch.jpg http://blogs.hillandknowlton.com/scottmckenzie/files/2012/03...
- ceol 13y agoIt's easy to tell when a light switch has been turned on or off. Not quite as easy when the switch is on a settings option called "email me a digest every week" or similar.
- H3g3m0n 13y agoWhich is exactly when websites want users confused. I remember Real Player had a bunch of 'opt-in' email options, they where in a scroll box. By default the visible ones where unticked, but if you scrolled down there where pages of preticked ones.
- mediascreen 13y agoI would not rely on people reading that text... But usually the physical world gives you a bit more feedback on the actual state the switch controls. If the electricity just went out and you go to the fusebox and find a row of breakers where one is pointing the other way and says off, it's pretty obvious what it does - and you get immediate feedback when you flip it.
- pkj 13y agoI doubt people really know ON/OFF by reading the text. More of a sense of alignment. In India, you don't have text on the switches. Also, it's opposite to the direction of the switches in US (Pressing down is ON). Further, if you have 2-way switches there is no way of labeling them.
- bencoder 13y agoI don't believe I have ever seen a switch like that (UK) so your comment isn't universal.
- purephase 13y agoI feel like I have this argument on every project I'm involved in. Designers seem to love these switches but end-user testing has always been lukewarm as users can't quite tell the actual state. I think there is a reason there is no HTML element for this and that zurb/bootstrap (and their earlier ilk) don't include them either. But, given that I lose this argument every time I appreciate projects that make them easier to implement. Thanks for sharing.
- Cyykratahk 13y agoIt's better to have the labels outside the control itself: ON [--O] OFF But that kind of defeats the purpose of the design in the first place.
- TazeTSchnitzel 13y agoIt's easy to do it right: Put a hole in the sliding panel, so you can slide it over ON to "check" it and over OFF to "uncheck" it.