WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Placing focus on form element

for

Number of posts in this thread: 4 (In chronological order)

From: Lovely, Brian (CONT)
Date: Tue, May 09 2017 12:05PM
Subject: Placing focus on form element
No previous message | Next message →

We have a search form that is presented as a modal. When the modal opens, focus is placed on the modal container, which in this case is the actual form element. I can't find any clarification as to this being correct or not. It does not seem to be causing any issues, but I feel like focus would be better placed on a non-semantic container. Any comments?



Brian Lovely
Digital Accessibility Team
= EMAIL ADDRESS REMOVED =




The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.

From: Jared Smith
Date: Tue, May 09 2017 1:10PM
Subject: Re: Placing focus on form element
← Previous message | Next message →

> When the modal opens, focus is placed on the modal container, which in this case is the actual form element.
> I can't find any clarification as to this being correct or not.

The *draft* ARIA practices document provides documentation on this -
http://w3c.github.io/aria-practices/#dialog_modal

They recommend focusing the first interactive control within the
dialog, or if the first interactive control is preceded by important
text that can't be associated to that control, that focus be set to
the first reasonable block of text in the dialog (such as the dialog
title text, first paragraph, etc. with tabindex="-1"). I'm not really
sure why in this case they don't recommend setting focus to the dialog
element itself - this seems most logical to me.

Jared

From: Lovely, Brian (CONT)
Date: Tue, May 09 2017 1:26PM
Subject: Re: Placing focus on form element
← Previous message | Next message →

Thanks Jared! There are a number of issues with the current markup. There's no role of dialog either. I'd like to see them refactor it like this:

Container with role of dialog

Close button

Form with role of search.

...and place focus on the close button when the modal opens.

-----Original Message-----
From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf Of Jared Smith
Sent: Tuesday, May 09, 2017 3:10 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] Placing focus on form element

> When the modal opens, focus is placed on the modal container, which in this case is the actual form element.
> I can't find any clarification as to this being correct or not.

The *draft* ARIA practices document provides documentation on this - http://w3c.github.io/aria-practices/#dialog_modal

They recommend focusing the first interactive control within the dialog, or if the first interactive control is preceded by important text that can't be associated to that control, that focus be set to the first reasonable block of text in the dialog (such as the dialog title text, first paragraph, etc. with tabindex="-1"). I'm not really sure why in this case they don't recommend setting focus to the dialog element itself - this seems most logical to me.

Jared
The information contained in this e-mail is confidential and/or proprietary to Capital One and/or its affiliates and may only be used solely in performance of work or services for Capital One. The information transmitted herewith is intended only for use by the individual or entity to which it is addressed. If the reader of this message is not the intended recipient, you are hereby notified that any review, retransmission, dissemination, distribution, copying or other use of, or taking of any action in reliance upon this information is strictly prohibited. If you have received this communication in error, please contact the sender and delete the material from your computer.

From: Birkir R. Gunnarsson
Date: Wed, May 10 2017 6:29AM
Subject: Re: Placing focus on form element
← Previous message | No next message

There have been some issues, e.g. in Jaws with setting focus on the
dialog continer, I think the focus order got blocked or something.
Apart from actual assistive technology bugs I don´t see why it
wouldn´t be acceptable to place focus on the container.

Just give the form element role of dialog and an accessible name using
aria-label (if it is a search pop up, just use aria-label="search" and
skip the additional ARIA search landmark inside, too many landmarks
actually clutter up the screen reader interface and make webpages
harder to use)




On 5/9/17, Lovely, Brian (CONT) < = EMAIL ADDRESS REMOVED = > wrote:
> Thanks Jared! There are a number of issues with the current markup. There's
> no role of dialog either. I'd like to see them refactor it like this:
>
> Container with role of dialog
>
> Close button
>
> Form with role of search.
>
> ...and place focus on the close button when the modal opens.
>
> -----Original Message-----
> From: WebAIM-Forum [mailto: = EMAIL ADDRESS REMOVED = ] On Behalf
> Of Jared Smith
> Sent: Tuesday, May 09, 2017 3:10 PM
> To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
> Subject: Re: [WebAIM] Placing focus on form element
>
>> When the modal opens, focus is placed on the modal container, which in
>> this case is the actual form element.
>> I can't find any clarification as to this being correct or not.
>
> The *draft* ARIA practices document provides documentation on this -
> http://w3c.github.io/aria-practices/#dialog_modal
>
> They recommend focusing the first interactive control within the dialog, or
> if the first interactive control is preceded by important text that can't be
> associated to that control, that focus be set to the first reasonable block
> of text in the dialog (such as the dialog title text, first paragraph, etc.
> with tabindex="-1"). I'm not really sure why in this case they don't
> recommend setting focus to the dialog element itself - this seems most
> logical to me.
>
> Jared
> > > http://webaim.org/discussion/archives
> > >
> The information contained in this e-mail is confidential and/or proprietary
> to Capital One and/or its affiliates and may only be used solely in
> performance of work or services for Capital One. The information transmitted
> herewith is intended only for use by the individual or entity to which it is
> addressed. If the reader of this message is not the intended recipient, you
> are hereby notified that any review, retransmission, dissemination,
> distribution, copying or other use of, or taking of any action in reliance
> upon this information is strictly prohibited. If you have received this
> communication in error, please contact the sender and delete the material
> from your computer.
> > > > >


--
Work hard. Have fun. Make history.