5

My (mobile) interface uses switches, like this one:
Screenshot of a Switch UI component

What should I call this component for users?

I want to add a small text to my interface explaining what switches to choose in which situations so I want to tell the user "Select the switch below to...".

You'll say, if I have to explain how my interface works it's probably not a good interface, but that's not my question :)

||improve this question||||
3

When I design something like that and I have user whom I have to tell them to play with that toggle. I use "slider button' they easily understand what I want to say, they directly go there. In other way most of the user know what is toggle.

||improve this answer||||
  • I actually went for Button but that's a great input. The method I used was to take a screenshot and ask a random user what he would call it. His anser was button. I think slider button would be as understandable. The important thing is that the word button should appear as it's how users would call all of them. If you're a farmer, you'll probably refer to a cow by its breed but most people just call it a cow. – Thibault D. Mar 31 '16 at 11:13
  • That's a nice example by the way :) – Abhishek Sharma Apr 1 '16 at 4:16
1

Android/Material Design and iOS call it a switch, Microsoft/Windows Phone refer to it as a toggle switch.

In your copy you could refer to it as either, my preference is 'toggle' which is specifically a two position switch.

||improve this answer||||
  • Thank you but you're referring to documentation that targets developers, not users. I think it's important that we use the words the users understand, not necessarily the words we use. – Thibault D. Mar 31 '16 at 11:12
  • 1
    I agree with the principle of your point, but I disagree with your contention that 'toggle' is not understood by users. Either way as you originally identified, you shouldn't need to explain how to use the UI... – Midas Apr 1 '16 at 14:17
1

I checked the Apple Style Guide 2013, Microsoft Manual of Style 4th Edition, and the Apple, Microsoft, and Google support sites for examples of their documentation. It looks to me like Apple and Microsoft don't reference the control directly for end users. Instead, they prefer you to describe the action or service for that control, though both might allow button if necessary.

switch (n.) Avoid using to refer to an interface element that offers the user two mutually exclusive choices--usually on and off. Instead, describe the action the user takes.

Tap to turn on Location Services.
Tap to turn airplane mode on or off.

User lowercase for on and off, even though the control options are uppercase.
Avoid using the term slide; use tap instead.

Apple Style Guide 2013, p.144

If your iPhone, iPad, or iPod touch won't connect to a Wi-Fi network
...Tap Settings > Wi-Fi and make sure Wi-Fi is turned on....

Set up a Wallet PIN on Windows Phone

  1. Turn on Wallet PIN [Toggle switch image], enter and confirm your new PIN (it must be at least four digits), and then tap Done.

Google appears to use the term switch
Connect to Bluetooth - Nexus Help

3.Touch the switch to turn Bluetooth On or Off.

||improve this answer||||
1

As to not confuse users with range sliders (e.g. http://rangeslider.js.org), which you may use at some point in your interface, this control is a switch—just as you referred to it in your question—a type of toggle interface. Many users are familiar with hardware light switches and the idea of turning something on/off (toggling)—this interface control is literally a skeuomorphic switch.

For your copy, I would recommend associating the appropriate action such as, "Toggle the switch below to [state]" or if your product voice is more informal maybe, "Touch [or slide if the user actually slides it] the switch below to turn [on/off] [state]".

As with any interface language, be consistent and your users will learn quickly.

||improve this answer||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for?Browse other questions tagged or ask your own question.