W3C home > Mailing lists > Public > w3c-wai-ig@w3.org > October to December 2015

Re: Error Handling Best Practice?

From: Alistair Garrison <alistair.j.garrison@gmail.com>
Date: Wed, 23 Dec 2015 14:56:22 +0000
Cc: David MacDonald <david100@sympatico.ca>, "Patrick H. Lauke" <redux@splintered.co.uk>, Michiel Bijl <michiel@agosto.nl>, "ajaysharma89003@gmail.com" <ajaysharma89003@gmail.com>, Jonathan Avila <jon.avila@ssbbartgroup.com>, "w3c-wai-ig@w3.org" <w3c-wai-ig@w3.org>
Message-Id: <2711FC96-CA3F-49CC-BD16-7580D57EF35B@gmail.com>
To: "Balusani, Shirisha" <sirib@uillinois.edu>
From testing it appears that legend's don't tend to be read out by AT on some mobile platforms.   Also, due to the small screen environment it would be good to keep the message box as small as possible. A definite advantage of including "error:" in the label of a form field that contains an error is that the fields can be navigated to via shortcuts.   

All the best 

Alistair

On 23 Dec 2015, at 14:31, Balusani, Shirisha wrote:

> Another possible   method is to keep error’s in an unordered list inside a div container with tabindex ="0"
> AT will read the number of errors at they are listed in an unordered list. In this way screen reader knows to go back to the list after correcting the firsts error.
>  
>  
> <div id="form_errMsg" tabindex="0" >
> <div>
> <h2">
> Error Messages :
> <ul>
> <li>
> <a href="#edit-name">You must enter name.</a>
> </li>
> <li>
> <a href="#edit-phone">You must enter your phone number.</a>
> </li>
> </ul>
> </h2">
> </div>
> </div>
>  
> In CSS:
>  
> #form_errMsg {
>     margin-bottom: 10px;
>     margin-right: 20px;
> }
>  
> Or you can also use field set and legend instead of div
>  
> <fieldset  ……………..tabindex="0">
> <legend>Please correct the following errors:<legend>
> <ul  >
> <li>…</li>
> <li>…</li>
> <li>…</li>
> …
> </ul>
> </fieldset
>  
>  
> From: David MacDonald [mailto:david100@sympatico.ca] 
> Sent: Tuesday, December 22, 2015 12:18 PM
> To: Patrick H. Lauke <redux@splintered.co.uk>
> Cc: Alistair Garrison <alistair.j.garrison@gmail.com>; Michiel Bijl <michiel@agosto.nl>; Balusani, Shirisha <sirib@uillinois.edu>; ajaysharma89003@gmail.com; Jonathan Avila <jon.avila@ssbbartgroup.com>; w3c-wai-ig@w3.org
> Subject: Re: Error Handling Best Practice?
>  
> An old school fix is to insert the error message inside the label tag for the label association with the input with the error
> 
> David & Kirsten MacDonald
>  
>  
>  
> On Tue, Dec 22, 2015 at 12:43 PM, David MacDonald <david100@sympatico.ca> wrote:
> Android/talkback is way behind on for accessibility. It's like Apple was in 2007.
>  
> It is not currently taken seriously by the blind community from what I can see. Google needs to figure this out... When you say "due to the number of users on Android..." I wouldn't say there are many blind users, and those who do, use Android  as a second device ... 
>  
> Working people and serious students who are blind currently use iPhone. There is no other option, really...  
>  
> I wish this wasn't the case but it is, I think.
> 
> David & Kirsten MacDonald
>  
>  
>  
> On Tue, Dec 22, 2015 at 11:45 AM, Patrick H. Lauke <redux@splintered.co.uk> wrote:
> On 22/12/2015 16:34, Alistair Garrison wrote:
> Thanks for the suggestion. It's really the where and how to present the
> error message that I suppose I'm searching for - be it:
> 
> So your dismissal of aria-describedby earlier in the thread is a red herring then, as that attribute can be used to tie the error message programmatically to the form control - it's orthogonal to where/how to present the message (as it's not a hidden attribute or anything, like aria-label)...
> 
> 
> P
> -- 
> Patrick H. Lauke
> 
> www.splintered.co.uk | https://github.com/patrickhlauke
> http://flickr.com/photos/redux/ | http://redux.deviantart.com
> twitter: @patrick_h_lauke | skype: patrick_h_lauke
> 
>  
>  
Received on Wednesday, 23 December 2015 14:56:55 UTC

This archive was generated by hypermail 2.3.1 : Wednesday, 23 December 2015 14:56:55 UTC