Re: a single label where multiple fields follow

Thanks so far for everyones comments
 
Jim, 
 
So without getting wanting to start a debate about form layout and the use of tables. If a table is used and there for the label is in one cell and the input is in another cell, I understand this removes the ability to use fieldset etc. 
 
So with this in mind, still assuming visual design dictates they are multiple inputs and using the scenario of date of birth (3 inputs, dd,mm,yyyy) or credit card (4 inputs), would you consider it better to have :-
 
1. a label for each input and for the additional inputs to position there labels off screen not using "hidden" in the class namimg convention (not sure if this would always inform the user the data is split across field when they encounter the first input)
 
or
 
2. having a label for the first inputs and titles for the subsequent inputs (I seem to recall reading that  it is not advised to use both, but not sure)
 
or
 
3. not have a label for the first input but have titles for all inputs (only where multiple inputs apply, all remaing 1 to 1 ratio would still use labels)
 
or 
 
4. there is a  better way
 
hope I have been clear on the scenrios but it confuses me which to go for
 
Antony


----- Original Message ----
From: Jim Thatcher <jim@jimthatcher.com>
To: Michael S Elledge <elledge@msu.edu>
Cc: w3c-wai-ig@w3.org
Sent: Thursday, 21 September, 2006 4:03:41 PM
Subject: RE: a single label where multiple fields follow


Michael, that's a good technique too. Strange thing is that class "hidden"
could also be display:none. Turns out that screen readers ignore
display:none content, as I think they should, except when it is in a label
element!

By the way, in a previous post, I wrongly attributed code where the labele
element contained three inputs to David Dorward - it was not his, it was
Paul Collins'.

Jim

Accessibility Consulting: http://jimthatcher.com/
512-306-0931

-----Original Message-----
From: w3c-wai-ig-request@w3.org [mailto:w3c-wai-ig-request@w3.org] On Behalf
Of Michael S Elledge
Sent: Thursday, September 21, 2006 9:42 AM
To: Terrence Wood
Cc: w3c-wai-ig@w3.org; Antony Tennant
Subject: Re: a single label where multiple fields follow


I suspect I may get some critical responses...
:-)

however, where the input fields are self-evident to sighted users (such 
as for month/day/year drop downs) but still useful for screen reader 
users, you can consider moving labels off screen using CSS. That way you 
have the benefit of providing additional context without relying solely 
on title tags or causing unnecessary screen clutter:

            <fieldset>
                <legend>Dates for Stay:</legend>
                Check in:
                <label for="CheckInMonth" class="hidden">Check in month: 
</label><br />
                <select name="monIn" id="CheckInMonth" title="Check in 
Month">
                    <option value="1">Jan</option>
                    <option value="2">Feb</option>
                </select>

                <label for="CheckInDay" class="hidden">Check in day: 
</label>
                <select name="dayIn" id="CheckInDay" title="Check in Day">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="25">25</option>
                </select>

                <label for="CheckInYear" class="hidden">Check in year: 
</label>
                <select name="yearIn" id="CheckInYear" title="Check in 
Year">
                    <option value="2006">2006</option>
                    <option value="2007">2007</option>
                </select><br /><br />
               
                Check out: <br />
                <label for="CheckOutMonth" class="hidden">Check out 
month: </label>
                <select name="monOut" id="CheckOutMonth" title="Check 
Out Month">
                    <option value="1">Jan</option>
                    <option value="2">Feb</option>
                </select>
              
                <label for="CheckOutDay" class="hidden">Check out day: 
</label>
                <select name="dayOut" id="CheckOutDay" title="Check Out 
Day">
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="27">27</option>
                </select>
               
                <label for="CheckOutYear" class="hidden">Check out year: 
</label>
                <select name="yearOut" id="CheckOutYear" title="Check 
Out Year">
                    <option value="2006">2006</option>
                    <option value="2007">2007</option>
                </select><br />
            </fieldset>

.hidden {
    position: absolute;
    left: -500px;
    top: -500px;
}

Mike

Terrence Wood wrote:
>
>
> On 22/09/2006, at 12:43 AM, Antony Tennant wrote:
>> I would like to get some opinions on the best practise for assigning 
>> <label for""> to inputs where there are multiple inputs
>
> Labels relate to one control only, however, a control can have 
> multiple labels.
>
> Group related controls together using fieldset and legend.
>
> Telephone Example (inputs omitted for brevity)
>
> <fieldset><legend>Telephone number</legend>
> <label for="countrycode">...
> <label for="areacode">...
> <label for="number">...
> </fieldset>
>
>
>
> kind regards
> Terrence Wood.
>
>