[jaws-uk] Re: help explaining accessibility

  • From: "E.J. Zufelt" <lists@xxxxxxxxx>
  • To: jaws-uk@xxxxxxxxxxxxx
  • Date: Sun, 17 Jan 2010 13:56:29 -0500

Good afternoon,

A quick note regarding the example below. Input fields do not need to be nested within the label tag in order for assistive technology to recognize the relationship if the for and id attributes are used. Assistive technology * should * recognize the relationship without the for and id attributes provided that an input field is nested within the label field. Regardless, it is always best practice to use unique ids on all fields, this helps not only with accessibility, but with styling.

HTH,
Everett

Follow me on Twitter
http://twitter.com/ezufelt

View my LinkedIn Profile
http://www.linkedin.com/in/ezufelt



On 17-Jan-10, at 1:48 PM, Léonie Watson wrote:

        The reason some screen readers will have trouble picking up the form
labels, is that they haven't been coded properly. When you build a web form, the trick is to associate the label with the relevant form field. A screen reader looks for this association, and announces the relevant text when the
form field is landed on.

        At the moment, the code for a typical form field on this page looks
something like this:

First Name
<input type="text" name="FieldData0" value="" maxlength="100" size="30">

        To create the association between the label and the form field, two
things need to happen. The first is that the label tag must be used, like
this:

<label>First Name
<input type="text" name="FieldData0" value="" maxlength="100" size="30">
</label>

        The second is that two attributes have to be applied. One to the
label tag, and one to the input tag. Both attributes must share the same value, and it's this that creates the association between the two elements,
like this:

<label for="first_name">First Name
<input id="first_name" type="text" name="FieldData0" value=""
maxlength="100" size="30">
</label>

        It looks as though the website may have been created using a tool
such as Dreamweaver. There's quite a lot of unnescessary code in there,
particularly the use of tables to control the layout of each page.

        To keep things sensible, I've simplified the code examples above. A
web developer shouldn't have any trouble working from there though. A useful
guide to coding accessible web forms can also be found here:
http://www.accessify.com/features/tutorials/accessible-forms/


Léonie

-----Original Message-----
From: jaws-uk-bounce@xxxxxxxxxxxxx [mailto:jaws-uk-bounce@xxxxxxxxxxxxx ] On
Behalf Of David W Wood
Sent: 17 January 2010 17:18
To: jaws-uk@xxxxxxxxxxxxx
Subject: [jaws-uk] help explaining accessibility

All:

I am trying to tell the author of this site:

http://www.cwops.org/newmembersignup.php

the labelling is not very good, but I am not experienced enough to explain
it to him.

In particular, the links.

Also JFW isn't picking up the labelling of the edit fields automatically.
Is this also a coding issue.

Comments welcomed.
My contact there is biddable to suggestions.

TIA

David



--
I am using the free version of SPAMfighter.
We are a community of 6 million users fighting spam.
SPAMfighter has removed 927 of my spam emails to date.
Get the free SPAMfighter here: http://www.spamfighter.com/len

The Professional version does not have this message

** To leave the list, click on the immediately-following link:-
** [mailto:jaws-uk-request@xxxxxxxxxxxxx?subject=unsubscribe]
** If this link doesn't work then send a message to:
** jaws-uk-request@xxxxxxxxxxxxx
** and in the Subject line type
** unsubscribe
** For other list commands such as vacation mode, click on the
** immediately-following link:-
** [mailto:jaws-uk-request@xxxxxxxxxxxxx?subject=faq]
** or send a message, to
** jaws-uk-request@xxxxxxxxxxxxx with the Subject:- faq


** To leave the list, click on the immediately-following link:-
** [mailto:jaws-uk-request@xxxxxxxxxxxxx?subject=unsubscribe]
** If this link doesn't work then send a message to:
** jaws-uk-request@xxxxxxxxxxxxx
** and in the Subject line type
** unsubscribe
** For other list commands such as vacation mode, click on the
** immediately-following link:-
** [mailto:jaws-uk-request@xxxxxxxxxxxxx?subject=faq]
** or send a message, to
** jaws-uk-request@xxxxxxxxxxxxx with the Subject:- faq


Other related posts: