Yes/No radio buttons: Vertical or horizontal Alignment

Currently looking at a long form with a lot of "yes/no" options presented as radio buttons. Is there any evidence to suggest that displaying radio buttons aligned vertically or horizontally is preferable?

Answer

I'm not a fan of horizontal layouts for radio buttons for four big reasons:

1. As soon as you have more than two choices, it becomes difficult to see which label belongs to which radio unless you use a lot of padding. That can cause problems.


2. Horizontal radio designs do not work if the line wraps. It looks like two questions. This means that you can only add a limited number of options to your radios, and can't translate your app into a language with potentially longer UI text. And because you want to be using the same pattern for all radio buttons in your app, that's a significant constraint. In large projects, constraints are like kryptonite - something to avoid at all costs.


3. Because users have trouble resolving items buried in rows, horizontal designs aren't great if a user might enter a form looking for a particular option or answer to provide (common in config forms)


4. You need width, and that's limited on the web. You can expand vertically easily, but you never want to force users to horizontally scroll.