WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Including non-interactive elements in the tab order

for

From: Dean.Vasile@outlook.com
Date: Feb 27, 2024 11:17AM

Tim
Thank you for that tip. I will actually try that out later today.
I never even thought to do that.
Dean Vasile


617-799-1162

> On Feb 27, 2024, at 12:06 PM, <EMAIL REMOVED> wrote:
>
> So I will offer a pro-screen reader tip. If your screen reader provides an application/forms mode and a document/browse mode, you can avoid having the error messages appear if you review the form using the document/browse mode. This is because tabbing through these types of forms in application/forms mode will trigger the events that validate the fields. This won't happen if you tab while in document/browse mode.
>
> I do understand there are definitely many people who find inline validation annoying--whether or not they use a screen reader. However, keep in mind that from an accessibility viewpoint that if messages are popping up as the user tabs through the interface, some kind of approach needs to be used to inform screen reader users when those messages appear.
>
> If the developers involved in the original question believe that they are not allowed to use live regions to inform screen reader users as the messages appear, then making those error messages part of the tab order is likely the only solution they could come up with for making the inline validation accessible.
>
> Thanks!
> Tim
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of <EMAIL REMOVED>
> Sent: Tuesday, February 27, 2024 7:15 AM
> To: WebAIM Discussion List < <EMAIL REMOVED> >
> Subject: Re: [WebAIM] Including non-interactive elements in the tab order
>
> What you are saying about roll equals alert is true.
> I find that on Google forms all the time and it’s very frustrating when all I’m trying to do is read through the form and it stops reading with an alert that the field is required. I’m finding that more and more on forms and I do find it very frustrating.
> I would like them to find a better way such as alert me when there’s an error when I hit the submit button and then take me to that field.
> Dean Vasile
>
>
> 617-799-1162
>
>> On Feb 27, 2024, at 5:22 AM, Geethavani.Shamanna < <EMAIL REMOVED> > wrote:
>>
>> They do use aria-describedby, and have considered using aria-live for dynamic error messages, although that presents its own challenges. Role="alert" is a good option. However, if a screen reader user is merely exploring the form, they will hear the alerts as they tab through each required field.
>>
>> -----Original Message-----
>> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
>> <EMAIL REMOVED>
>> Sent: Monday, February 26, 2024 6:50 PM
>> To: 'WebAIM Discussion List' < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Including non-interactive elements in the tab
>> order
>>
>> External email: if the sender or content looks suspicious, please
>> click the Report Message icon, or forward it to report-phishing
>>
>> I think that some times people may misunderstand how screen readers work and they may assume that the screen reader needs to be able to tab to items to read them.
>>
>> I typically try to explain that most people who rely on the keyboard can see and do not use a screen reader. Also, screen reader users have other mechanisms that allow them to access non-interactive elements.
>>
>> If they are concerned that screen reader users will miss the inline validation messages, talk them through using something like aria-describedby to associate the error message with the field and use either role="alert" or an assertive live region to ensure the screen reader notifies the user immediately when the error message appears. That will end up being a better user experience for everyone.
>>
>> Thanks!
>> Tim
>> -----Original Message-----
>> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
>> <EMAIL REMOVED>
>> Sent: Monday, February 26, 2024 11:18 AM
>> To: WebAIM Discussion List < <EMAIL REMOVED> >
>> Subject: Re: [WebAIM] Including non-interactive elements in the tab
>> order
>>
>> Including non-interactive elements like error messages in the tab order generally isn't considered a best practice for accessibility. While it might not explicitly fail SC 2.4.3 (Focus Order), it can still pose usability challenges for users navigating the form, especially those who rely on keyboard navigation or assistive technologies.
>>
>> It's important to ensure that users can navigate through interactive elements in a logical and predictable order. Placing non-interactive elements like error messages within the tab order can disrupt this flow and confuse users. It's usually better to keep error messages separate from the tab order and provide alternative methods for users to locate and address any issues with form validation.
>> Dean Vasile
>>
>>
>> 617-799-1162
>>
>>>> On Feb 26, 2024, at 9:43 AM, Geethavani.Shamanna < <EMAIL REMOVED> > wrote:
>>>
>>> Hello all,
>>>
>>> I am trying to convince some developers that including non-interactive elements (such as error messages) in the tab order is not best practice. The forms in question are validated in real-time and error messages are dynamically inserted into the tab order if a required field is left blank. The error message appears as the next tab stop following the unpopulated required field.
>>>
>>> I came across a discussion in the archives about how including non-interactive elements in the tab order does not fail SC 2.4.3, Focus Order. In this instance, where error messages are included within the tab order, does this not fail SC 2.4.3?
>>>
>>> Thank you.
>> >> >> archives at http://webaim.org/discussion/archives
>> >>
>> >> >> archives at http://webaim.org/discussion/archives
>> >> >> >> archives at http://webaim.org/discussion/archives
>> > > > >
> > > >