User friendly and clear way to present possible answers to a question

Question

Which way to answer the following question is more user friendly and more clear?

A)

B)

edit: Because I have to stick to the drop-list and don't really like options A and B, I thought of an third option. In this case the checkboxes are always visible when dropped down, and it isn't possible to select 'No' without selecting one of the options underneath it:

C)

Answer 1

Use either Responsive Disclosure or Responsive Enabling depending upon the standards in the format you're working in.

Responsive Disclosure would mean first showing a radio button like this...

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

...and then revealing the additional option in the whitespace if the user selects no, like this...

^{download bmml source}

Responsive Enabling would mean first showing the options greyed out instead of hidden, like so:

^{download bmml source}

You can also find Responsive Disclosure and Responsive Enabling in the Quince Infragistics pattern library and on pages 179-185 of Designing Interfaces, Second Edition by Jenifer Tidwell.

Note: I've changed from a droplist to radio buttons because there are only two options. Unless space is severely constrained or you're trying to nudge your user to stick with the default, radio buttons are the better pattern in this case. Also, if at least one of the options A, B, or C must be selected, it may be better to use a droplist with 7 explicit options instead of checkboxes, especially if you don't want an option selected by default.

Answer 2

I don't think either of these is the best option. Do you have to go with one drop down? I would prefer to see two. The first would display and the second would be hidden until the user selected either yes or no from the first. Once selected the second would display with the appropriate options.

Answer 3

If space is a consideration, you could also make a second step with a popup, or a second page. The first page consisting of a single Yes/No Choice, for example two buttons.

If the user chooses No, he will get a second page with the checkboxes to choose Options.

If you are at all concerned with people using touchscreens, this should be the best options, because they are used to having information and menus spread over several steps/pages in a work flow, but they would probably break their fingers with those combo-boxes...