Re: Error Handling Best Practice?

There are many challenges with error messaging alerts.

The summarized method all in one div for web works great as an alert since the screen reader will announce all the error fields.

In-line is good in that it does show the user each field that has an error. Developers are often challenged to make the page/app announce all inline errors in one announcement if you will.

Moving to mobile, I still like the one place alert, a popup works great as it can get announced, then the user can go to the inline marked/labeled fields in error to fix.


Regards,

Alan






Sent from Windows Mail





From: Jonathan Avila
Sent: ‎Tuesday‎, ‎17‎ ‎November‎, ‎2015 ‎9‎:‎04‎ ‎AM
To: Alistair Garrison, public-mobile-a11y-tf@w3.org






Ø  So, in your opinions what would be the best "best practice method" for error handling and error presentation on a mobile.

 

One thought might be to summarize the errors at the top but to indicate and associate them inline and focus the first field in error after submit.  I would agree with others that inline is probably best when you have more than 2 or 3 fields.  Any inline messages would also need to be very visually apparent as well to help the user understand that the form was submitted but an error was found and they need to address the error to continue.  

 

Jonathan

 


-- 
Jonathan Avila 
Chief Accessibility Officer
SSB BART Group 
jon.avila@ssbbartgroup.com

Phone 703.637.8957  
Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter

 



From: Alistair Garrison [mailto:alistair.j.garrison@gmail.com] 
Sent: Tuesday, November 17, 2015 5:31 AM
To: public-mobile-a11y-tf@w3.org
Subject: Error Handling Best Practice?

 

Dear All, 


 


Seemingly one of the best methods for telling people about errors in form data is to allow the user to submit the form, then by either by client-side or server-side means validate the data.  If the data contains errors a message box is placed before the form with all the error messages in it, and focus (visual and keyboard) is taken to this box (http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/SCR32).  At least, this is one of the best methods on desktop…


 


Trying to translate this concept to a mobile is a little difficult, due mostly to the smaller screen size - as content pushed in at the top moves all the other content down "below the fold".


 


I've done a little research around HTML5 validation, but the inconsistent native support / AT support means the method cannot be broadly relied upon.  The million and one JavaScript validation methods are also an option for telling people if the value they have entered is correct, but it is also a lot more confusing that the single error message box (mentioned above).


 


So, in your opinions what would be the best "best practice method" for error handling and error presentation on a mobile.


 


All the best 


 


Alistair