Should radio buttons be pre-selected?

Question

I am working on a re-design for a eCommerce site and they have a section where they offer a free gift card if the user makes a purchase over $1000. The idea of the gift card is to get users to purchase more on the site and since the products are generally expensive (its a jewelry site) chances are they will spend the gift card plus some more money on the site.

So the question I have is should the radio button group which asks user if they want a free gift card be pre-selected ?

^{download bmml source – Wireframes created with Balsamiq Mockups}

There are two aspects to it which I am trying to consider and I would appreciate it if answers consider those a parameters

1. The user experience if the radio button is pre-selected as yes and the user is wondering when did he sign up for a gift card even though its free
2. The aspect of conversion from a e-commerce perspective

Answer 1

First of all: why do you ask at all? Why not simply always send the gift card with the order? Who would object to getting more value than what they ordered? If you don't ask, you don't have your problem to begin with. Generally, asking fewer questions from the user results in higher conversion, so from that perspective, removing the whole question would be an obvious step to take. As long as they don't cash the gift cards, there is no cost incurred for the shop, and if they do and spend more money besides, you'll have reached your goal with including them in the first place.

But if you insist you need to ask: radio button groups should always have exactly one selected item. So, that would mean that you should indeed select one of the items. What is the meaning of a group of radio buttons without a selected item? However, for a yes-or-no question, I don't think a radio button is the right control to use. Instead, use a check box.

Answer 2

If you have a default that will be true in most cases, you should consider using it. Otherwise, I would avoid pre-selecting radio buttons. The prime reason being that you have no way of knowing whether someone actually wants it selected or they just missed it.

In addition to that, if your radio buttons are only a Yes/No question, then I would suggest using a single checkbox instead with the checkbox representing the positive choice.

Answer 3

If you use radio buttons for Yes and No without pre-selection, there are three states: yes, no, and undefined (null). Therefore, radio buttons are not the right choice. Use an unselected checkbox instead to reflect the two possible values yes and no.

[ ] I want a free gift card

is much clearer.

Answer 4

Don't pre-set the radio button. Either leave it blank, or use a checkbox control that defaults to empty.

The problem with setting a radio button is that do you want to presume to 'speak for' the user - trying to opt them in will cause distrust, but seeming to try and opt them out will seem stingy (as though you want to send as few gift cards as possible).

The solution is either to leave the radio buttons blank, or, use a checkbox control instead (which can be left blank without arousing suspicions, because a blank checkbox is the default state across operating systems and applications).

Answer 5

tl;dr: Use a checkbox defaulted to checked: X-Send me a giftcard ($30 Free!)

Important Caveat about All Radio Buttons:

About a checkbox that is not defaulted: it must always be invalid for nothing to be checked. If 'nothing checked' is a valid option, and the user accidently checks something, then changes their mind, we have a serious problem. You do the math! (That's can't be the case with this situation, however, it's suprisingly prevalent).

Details...

That reality understood, here are the two choices that come into play with a simple yes/no question only (3 or more radio buttons have different nuances).

with a checkbox, you can't tell the difference between "The user didn't read the page and missed the question" and "I didn't want to check it (or uncheck a 'defaulted checked'box)".

2 Yes/No radio buttons with one defaulted is functionally equivalent to a checkbox, defaulted checked or not.

with undefaulted option buttons, you FORCE the user to think about the question and pick what you want. Do this for times when you really care that the user answers it properly, e.g., "this item is out of stock. Place on backorder? O-yes O-no".

OK those are the general rules about the situation. However you seem conflicted as to where you want to push the customer, and you could be getting 'too honest for business' here. You can see how a site operator can work this to their advantage. For example:
" X(pre-checked) - Send my Tons of Spam about this".
They're hoping you'll NOT read it!

For your case, you are pitting making more money against good UI design. UI design always loses when you cut to the chase, sorry!. For example, if the item on your site with the smallest profit margin is a profit margin of $50, what do you have to lose by giving them a free $30? And, who is going to care if they automatically get a free $30?

I take back the tl;dr ... Just give them the giftcard all the time!

Answer 6

Here's a simple rule of thumb:

If there are only two options, and you need to force a choice, use radio buttons and do not pre-select one. It's ok to make an exception to the rule that a radio button set should always have a default selection in this case. See Luke Wroblewski's "Form Design" page 158.

But in your case, let them just click a checkbox if they want the gift card. That way, you're only giving cards to people who really want them. Users have a quick/easy choice too.

Answer 7

It depends on your privacy policy.

If your privacy policy allows you to send the user promotional emails (and has been accepted), the user has ALREADY given you permission to send him gift vouchers and the whole question should be skipped. Simply send the voucher to everybody.

If your privacy policy does not allow you to do so, you have to ask:

The radio button should be a checkbox, really, but if not, the radio button should be selected: if it is not selected, it will either prevent the user from submitting the form (telling the client he is wrong at checkout time is not a good thing) or it will be submitted blank (=no).

If you preselect "yes", a number of users will reactively select "no" as a knee jerk reaction because it looks like asking for more spam. If you preselect "no", the opposite might be true, but some people will also just not bother changing it.

From a conversion point of view, this is a perfect candidate for an AB test.

About annoying users who leave it on "yes" by mistake, I would personally not bother about it because the same users are just as likely to forget they gave you the permission and be upset anyway. As long as the option is not hidden and that you do not change it back automatically (for instance, the user submit the form, there is an error, and the radio button reverts back to the default as it often does), you have to assume that the user meant to submit what he did.

Answer 8

I think the labelling is confusing and could be much more engaging. You have 2 goals: developing your business and delivering a great UX.

To answer your original question, I would say yes by default as it's almost a nonsense to ask your users if they want something followed by a default "NO".

Instead you could improve the labelling to make your free gift card more desirable, which makes a default yes more engaging. Here are a couple examples to illustrate what I mean:

• Include 's free gift card (add 1 liner core value)
• Send me my free gift card (add 1 liner core value)

You get the idea.

Answer 9

As some one said, who wouldn't want a free gift card. But what if someone actually did not want one ?
I, as a programmer and as a seller would make sure the radio button yes is selected AND since you said this : The idea of the gift card is to get users to purchase more on the site and since the products are generally expensive (its a jewelry site) chances are they will spend the gift card plus some more money on the site.
I would apply the gift cards value to the total being checked out, inform the user of the applied discount and ask the user if s/he wants to apply the gift card for this check out or for another time.
P.S: Your question in the wireframe is actually asking the user to send you a gift card ;)