1

I work on a site with various homepage widgets. I have been asked to provide a check box for each widget with the label "Show in mobile view" that is pre-checked.

Widgets have always been visible in mobile view and I think it would make more sense to reverse this so the text reads "Hide in mobile view" and the check box is not checked.

The reason I ask is although I think I am right, I cannot communicate the reason being as its nothing more than intuition on my part. I am a developer and have no formal training in design/user experience so was hoping to get some opinions from people here, and perhaps some phrase that can describe what I have done so I can convince others.

Thanks

3

Disclaimer: This is a subjective view, I cannot produce any evidence to support it.

It would be my view that checkboxes are used to promote a positive choice, hence why they (for the most part) display a tick when in their 'on' state. As such they should be paired with a positive slanted option request to 'turn' something 'on'.

What you are suggesting is pairing text suggesting to turn something 'off' with a visual indication of being 'on', which may be a little subconsciously jarring for some users causing them to spend more time properly evaluating what the option means.

Which looks better to you?

  1. Do you want to turn X on? Yes? Checkbox Has a Tick

  2. Do you want to turn X off? Yes? Checkbox Has a Tick

5
  • 1
    You're feeling is correct: checkboxen are used in a confirming manner. Nielsen / Norman state the following: Use positive and active wording for checkbox labels, so that it's clear what will happen if the user turns on the checkbox. In other words, avoid negations such as "Don't send me more email," which would mean that the user would have to check the box in order for something not to happen. – Ruudt May 1 '14 at 14:58
  • @Ruudt - thanks for the info, very interesting to know my gut 'feeling' wasnt too misplaced! – SW4 May 1 '14 at 15:00
  • The wording itself is subjective, I agree. However I do think that the approach from the question that I got was that the widgets shouldn't necessarily be displayed by default. In that case, updating the wording or the choice set would solve the negativity problem. – Francis Pelland May 1 '14 at 15:03
  • Fot the complete article, see: nngroup.com/articles/checkboxes-vs-radio-buttons – Ruudt May 1 '14 at 15:04
  • 1
    Brilliant answer. Thankyou. I have lots of nice phrases I can repeat to people now :) – DavidB May 1 '14 at 15:09
2

The only reason mobile should be default is if it won't hinder in any way the user experience. Does that widget in mobile look good, does it keep the UI clean, does it provide value? If you reply yes to all of these then it would be best to make a checkbox for "hide from mobile" as opposed to "show on mobile".

Only when you think showing something would cause problems should you make the checkbox be to "show on mobile". Yes the difference between the two is minor, however to the user if it provides a far different experience then you need to consider that on mobile "less is better".

If you do believe you are right, you can ask your boss the following:

  • I think having all the widgets available by default in mobile clutters the experience. Do you agree we can show less on the page and have users choose to see more?
  • The widgets have the potential to distract users from the actual content. How can we assure that users continue to pay attention to our content with the widgets enabled by default?

The key here is to get feedback and see why they are thinking something and letting them understand your point of view. Your point of view may be different from my own, so play with the feedback I provided to get your point across.

0
0

Does it have to be a checkbox? Can you not have some sort of 2-state button? For example, the sliders in iOS (apologies for the image size):

iOS toggle button

I think something like that, prefixed with "show in mobile view"; perhaps even with yes/no to indicate it textually as well as visually.

Edit You could use a JQuery plugin to achieve this; a quick search threw up this as an option: http://simontabor.com/labs/toggles/

2
  • That would be better, but Im using a framework we developed that uses standard html input controls – DavidB May 1 '14 at 15:10
  • @DavidB I updated the answer with a possible JQuery plugin you could use to achieve this. – Joe May 1 '14 at 15:14

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.