Re: Proper Coding for Yes/No Questions

• From: Kynn Bartlett <kynn-edapta@idyllmtn.com>
• Date: Tue, 5 Mar 2002 16:21:12 -0800
• To: RUST Randal <RRust@COVANSYS.com>, "WAI (E-mail)" <w3c-wai-ig@w3.org>
• Message-Id: <a05101001b8ab1052ede0@[10.0.1.2]>

At 11:57 AM -0500 3/5/02, RUST Randal wrote:
>I have several forms with simple "yes/no" questions on them.  I need to use
>radio buttons for the selections.
>
>Is the following code correct for accessibility?
>
>----------
>
><label for="smart">Are you smart?</label>
><label for="smartYes">Yes</label><input type="radio" id="smartYes" />
><label for="smartNo">No</label><input type="radio" id="smartNo" />

No, but close. You want something like this:

<fieldset>
   <legend>Are you smart?</legend>
   <label for="smartYes">Yes</label>
   <input type="radio" id="smartYes" value="yes" name="smartYes" />
   <label for="smartNo">No</label>
   <input type="radio" id="smartNo" value="no" name="smartNo" />
</fieldset>

The redundant name attribute is there for backwards compatibility.
You could eliminate the for attributes if you wanted, by
wrapping the <label> around the <input>:

<fieldset>
   <legend>Are you smart?</legend>
   <label>
     Yes
     <input type="radio" id="smartYes" value="yes" name="smartYes" />
   </label>
   <label>
     No
     <input type="radio" id="smartNo" value="no" name="smartNo" />
   </label>
</fieldset>

Hope this helps!

--Kynn

-- 
Kynn Bartlett <kynn@idyllmtn.com>                 http://kynn.com
Chief Technologist, Idyll Mountain            http://idyllmtn.com
Web Accessibility Expert-for-hire          http://kynn.com/resume
Next Book: Teach Yourself CSS in 24       http://cssin24hours.com

Received on Tuesday, 5 March 2002 19:31:13 UTC