|
| |
|
|
Nicole
Posts: 2843
Joined: 9/15/2004
From: Nambucca / Kempsey, Australia
Status: offline
 |
Some Questions about Accessible Quizzes... - 7/24/2006 1:24:11
I have a quiz on a client’s site that I’m trying to make sure is accessible (See Screenshot). I’ve thought of some possible reasons why the current form isn’t accessible, despite it being laid out in tables, which will be converted to CSS, and I’ve also thought of some solutions to these problems but thought I’d post them here before I launched into these quizzes as perhaps some of you might know of reasons why my solutions won’t work, or maybe you can think of other better solutions.
First problem is that the check box appears before the response for each question which means that the opportunity to select the box has been missed by those using screen reader technology once the response is being read out.
One solution I’ve thought of is to position the question, the check boxes and the responses each in separate divs, float the response right and the checkbox left but have the right floated response appear first in the code.
Another solution to this and maybe even in addition to the first solution, is to make each question a #bookmark link and place a link after the last response for each question saying “Repeat this Question”. Then at the bottom of the entire quiz, to place another bookmark link back to the first question so they can opt to change any previous responses or check their responses.
Like skip links this would put a visible link on the page that sighted viewers would think was useless, but I can live with that.
The other issue is that this quiz doesn’t currently have the ability for the user to select the response text and by doing so checking the checkbox. I’m thinking about those who may be unable to control a mouse with ease and giving them more control this way? They would also be able to tab through the responses as usual, which I’ve just tried on the old table version of the quiz and you can tab through but you can’t seem to check a checkbox by pressing enter. It seems that pressing enter submits the quiz incomplete. Any solutions to this would be greatly appreciated.
I’ve been mulling over these solutions for about a week and these are the only solutions I can think of save for creating a different quiz with only one question per page. As the script for the answer pages have already been written, I don’t really think that’s an option though. Can anyone think of any other accessibility issues and also respond as to whether my solutions are going to make for a more accessible quiz, or are there any better solutions?
Thumbnail Image
 Attachment (1)
_____________________________
|
|
|
|
Tailslide
Posts: 6126
Joined: 5/10/2005
From: Out here on the raggedy edge
Status: online
|
RE: Some Questions about Accessible Quizzes... - 7/24/2006 2:05:19
The way you have it now is the "right way" for radio buttons and checkboxes - input, then text.
_____________________________
"My strategy is so simple an idiot could have devised it"
Little Blue Plane Web Design | Blood, Sweat & Rust - A Land Rover restoration project
| |
|
|
|
Nicole
Posts: 2843
Joined: 9/15/2004
From: Nambucca / Kempsey, Australia
Status: offline
|
RE: Some Questions about Accessible Quizzes... - 7/25/2006 1:42:42
Thanks Tail,
I have this quiz page working super-accessibly now, I've really learnt a lot. For instance I had the first response to each question selected by default using checked="checked" as a usability feature to show what the user is supposed to do to select a response, but having the first response to each question defaulting as "checked", I couldn't understand why when tabbing through the quiz, only the first response to each question was being tabbed to.
I then deleted all the "checked" defaults and was going to leave it like that but then with all the possible responses to questions now being selectable, I couldn't work out how somebody using a keyboard could select a response. I was tabbing to it and pressing enter and all sorts of other things until I found this link:
http://www.cs.tut.fi/~jkorpela/forms/kbd.html
Which explains how you use "space" to select a radio button or checkbox, and the up/down arrow keys to move between responses to a question.
Anyway, thanks for your help, my understanding of keyboard browsing took a giant leap forward today!
Nicole
_____________________________
| |
|
 New Messages |
 No New Messages |
 Hot Topic w/ New Messages |
 Hot Topic w/o New Messages |
 Locked w/ New Messages |
 Locked w/o New Messages |
|
Post New Thread
Reply to Message
Post New Poll
Submit Vote
Delete My Own Post
Delete My Own Thread
Rate Posts
|
|
|
Printable Version 
