Labeling for a Form's Radio Boxes

Trying to label my radio boxes without overkill

[Jeremy_H]

Hello,

I'm creating a survey which will comprise of about 20 statements. Each statement can be answered with one of five radio boxes, for "Strongly Agree", "Agree", "Neutral", "Disagree", and "Strongly Disagree". Pretty much a standard form you see all the time in print.

I'm trying to have each statement and five radio box option pairs to each have their own line. With the statement on the left, and the boxes on the right (forming five columns).

What I'm trying to do is create one set of labels at the top of the columns, instead of having to label each and everyone of the radio boxes.

I'm running into problems, and was hoping somebody might be able to shed some light. Thanks

This is what I have so far:

<label for="q01a q02a q03a">Strongly Agree</label>
<label for="q01b q02b q03b">Agree</label>
<label for="q01c q02c q03c">Neutral</label>
<label for="q01d q02d q03d">Disagree</label>
<label for="q01e q02e q03e">Strongly Disagree</label>

<legend>Statement Number One</legend>
<input id="q01a" name="01" type="radio" value="5">
<input id="q01b" name="01" type="radio" value="4">
<input id="q01c" name="01" type="radio" value="3">
<input id="q01d" name="01" type="radio" value="2">
<input id="q01e" name="01" type="radio" value="1">

<legend>Statement Number Two</legend>
<input id="q02a" name="02" type="radio" value="5">
<input id="q02b" name="02" type="radio" value="4">
<input id="q02c" name="02" type="radio" value="3">
<input id="q02d" name="02" type="radio" value="2">
<input id="q02e" name="02" type="radio" value="1">

<legend>Statement Number Three</legend>
<input id="q03a" name="03" type="radio" value="5">
<input id="q03b" name="03" type="radio" value="4">
<input id="q03c" name="03" type="radio" value="3">
<input id="q03d" name="03" type="radio" value="2">
<input id="q03e" name="03" type="radio" value="1">

[kaled]

Perhaps I'm misunderstanding something but...

The purpose of a label (around a radio box) is to allow the box to be checked by clicking the label. Surely, therefore, it is meaningless to associate one label with multiple radio boxes (unless you are attempting to check multiple boxes with a single click).

Kaled.

[Jeremy_H]

Thanks for your reply,

I didn't realize this about labels and radio boxes. My understanding was that labels help people using screen readers or other related type equipment to make associations over which radio boxes mean what.

I understand now that it would be meaningless to have a label associated to multiple radio boxes.

[Robin_reala]

Well, it's actually there for both reasons :) But yeah, I do think that it'd be better to associate one label to one control.

[encyclo]

One possible idea: you could see this as tabular data, and so you could place each radio button in a table cell with appropriate

headers

attribute to associate it with the

id

for the cell with the Strongly Agree, Agree, etc. text.

[bedlam]

Radio buttons are rarely necessary--they can almost always be replaced by other controls. Besides that, something seems a little conceptually strange about marking up the possible answers with the label element. I'd suggest something along these lines:

<legend>"All cows eat grass"</legend>
<label for="statement_1">Answer</label>:
<select name="statement_1">
<option value="5">Strongly Agree</option>
<option value="5">Agree</option>
<option value="5">Neutral</option>
<option value="5">Disagree</option>
<option value="5">Strongly Disagree</option>
</select>

This would also be much easier to code since the only things that change from question to question will be the label and legend elements and the 'name' attribute of the select...

-b