E-mail List Archives
Thread: urgent sample of good code
Number of posts in this thread: 9 (In chronological order)
From: Lucy Greco
Date: Thu, Jan 31 2013 6:47PM
Subject: urgent sample of good code
No previous message | Next message →
Hello:
Does anyone have a sample of a survey using a table lay out for a
ranking set of questions. I need to provide a contractor a sample of what
I am looking for and they wanted it in a hurry.
The idea is the user is given ten ideas they need to agree or disagree
with in a scale of one to 5 and they are using radio buttons for the
scale. They have laid this out in a table and have not even tried to lay
it out with roe or columns headers. I think a better way to do it is treat
each idea as a separate question but I lost that fight. If anyone has the
sample code I could give them I would really appreciate it. The thing that
kills me is the front page of the survey said it was w3c compliant well I
have to say if my screen reader set to out of box default settings could
not tell what I was agreeing to or that I was even agreeing or disagreeing
it isn't Lucy
From: John Hicks
Date: Mon, Feb 04 2013 7:13AM
Subject: Re: [!! SPAM] urgent sample of good code
← Previous message | Next message →
Hi
Although the table sounds like it is being misused, the solution to the
problem you mention lies more in using fieldsets and labels correctly.
A fieldset for each question and proper labels (for/id) for each of the
5 radio buttons in each question.
Presentation tables in themselves are not non-compliant. (Although they
are cumbersome).
I even gather that "tables for layout" are back "in" .... whatever that
means.
But the accessibility problème you are asking about revolves around form
labels and fieldsets (I believe).
John
Le 01/02/2013 02:47, Lucy Greco a écrit :
> Hello:
> Does anyone have a sample of a survey using a table lay out for a
> ranking set of questions. I need to provide a contractor a sample of what
> I am looking for and they wanted it in a hurry.
> The idea is the user is given ten ideas they need to agree or disagree
> with in a scale of one to 5 and they are using radio buttons for the
> scale. They have laid this out in a table and have not even tried to lay
> it out with roe or columns headers. I think a better way to do it is treat
> each idea as a separate question but I lost that fight. If anyone has the
> sample code I could give them I would really appreciate it. The thing that
> kills me is the front page of the survey said it was w3c compliant well I
> have to say if my screen reader set to out of box default settings could
> not tell what I was agreeing to or that I was even agreeing or disagreeing
> it isn't Lucy
> > > >
--
John Hicks ( = EMAIL ADDRESS REMOVED = )
Ingénieur Consultant en Accessibilité
Docteur en Sciences Cognitives
www.Urbilog.fr -- Solutions Accessibles
From: John Hicks
Date: Mon, Feb 04 2013 7:14AM
Subject: Re: urgent sample of good code
← Previous message | Next message →
(resending with clean subject line)
Hi
Although the table sounds like it is being misused, the solution to the
problem you mention lies more in using fieldsets and labels correctly.
A fieldset for each question and proper labels (for/id) for each of the
5 radio buttons in each question.
Presentation tables in themselves are not non-compliant. (Although they
are cumbersome).
I even gather that "tables for layout" are back "in" .... whatever that
means.
But the accessibility problème you are asking about revolves around form
labels and fieldsets (I believe).
John
Le 01/02/2013 02:47, Lucy Greco a écrit :
> Hello:
> Does anyone have a sample of a survey using a table lay out for a
> ranking set of questions. I need to provide a contractor a sample of what
> I am looking for and they wanted it in a hurry.
> The idea is the user is given ten ideas they need to agree or disagree
> with in a scale of one to 5 and they are using radio buttons for the
> scale. They have laid this out in a table and have not even tried to lay
> it out with roe or columns headers. I think a better way to do it is treat
> each idea as a separate question but I lost that fight. If anyone has the
> sample code I could give them I would really appreciate it. The thing that
> kills me is the front page of the survey said it was w3c compliant well I
> have to say if my screen reader set to out of box default settings could
> not tell what I was agreeing to or that I was even agreeing or disagreeing
> it isn't Lucy
> > > >
--
John Hicks ( = EMAIL ADDRESS REMOVED = )
Ingénieur Consultant en Accessibilité
Docteur en Sciences Cognitives
www.Urbilog.fr -- Solutions Accessibles
From: Lucy Greco
Date: Mon, Feb 04 2013 10:15AM
Subject: Re: urgent sample of good code
← Previous message | Next message →
Hello:
Your write it is a the best answer to use filed sets but I can't get them
to fix it at all Lucy
From: John Hicks
Date: Mon, Feb 04 2013 1:45PM
Subject: Re: urgent sample of good code
← Previous message | Next message →
What did you try?
A fieldset needs a legend tag inside it.
A quick google on these terms will reveal all .... if you spell them
correctly.
I have been away from the list for a while and I don't know if posting
of code is encouraged, but what you need is
<fieldset>
<legend> Question about X </legend>
.... the radio buttons, each with their own <label></label>
</fieldset>
The fieldsets will create lines, you need to get rid of them with CSS.
hope that helps.
Le 04/02/2013 18:15, Lucy Greco a écrit :
> Hello:
> Your write it is a the best answer to use filed sets but I can't get them
> to fix it at all Lucy
>
>
From: Corbett, James
Date: Mon, Feb 04 2013 2:01PM
Subject: Re: urgent sample of good code
← Previous message | Next message →
Hi:
There is a bit of a glitch to all of this. If by default the radio buttons are not selected then tabbing through the array will not announce the legend.
Jim
From: John Hicks
Date: Tue, Feb 05 2013 4:25AM
Subject: Re: urgent sample of good code
← Previous message | Next message →
It works for me (announcing the legend) under IE, FF, and Chrome.
Or are you saying that putting it all into some table disrupts this?
I used Jaws 13.
John
Le 04/02/2013 22:01, Corbett, James a écrit :
> Hi:
>
> There is a bit of a glitch to all of this. If by default the radio buttons are not selected then tabbing through the array will not announce the legend.
>
> Jim
>
>
From: Corbett, James
Date: Tue, Feb 05 2013 6:18AM
Subject: Re: urgent sample of good code
← Previous message | Next message →
Hmmm, I've been testing our external apps for the past year and a half and haven't seen a suitable working example.
j.
From: James Nurthen
Date: Tue, Feb 05 2013 3:33PM
Subject: Re: urgent sample of good code
← Previous message | No next message
If you can't do fieldset/legend due to styling and/or incompatibilities
with a table-based layout you could see if the aria role of group (with a
corresponding aria-labelledby) would work for you.
i.e.
<table role="presentation">
....
<tr role="group" aria-labelledby="questionX">
<td role="presentation" id="questionX">Question Text?</td>
<td role="presentation"><input type="radio" aria-label="1"></td>
<td role="presentation"><input type="radio" aria-label="2"></td>
<td role="presentation"><input type="radio" aria-label="3"></td>
<td role="presentation"><input type="radio" aria-label="4"></td>
<td role="presentation"><input type="radio" aria-label="5"></td>
</tr>
....
</table>
Note: I haven't tested this and I'm not sure this is the exact thing you
want - but this should work.
Additional note: role="presentation" shouldn't be necessary on the TD
elements as it should inherit from the table, but IE seems to leave
singleton gridcell elements if you don't do this.
Regards,
James
On Tue, Feb 5, 2013 at 5:18 AM, Corbett, James
< = EMAIL ADDRESS REMOVED = >wrote:
> Hmmm, I've been testing our external apps for the past year and a half and
> haven't seen a suitable working example.
>
> j.
>
>
>