WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Focus reset

for

From: Mark Magennis
Date: Apr 17, 2023 2:11AM

Option 1 would be appropriate if you can pretty much guarantee that the user will want to start interacting with the content on the right after it appears and won't want to select any other button. And in that case they should be links, not buttons.

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Sumit Patel
Sent: Monday 17 April 2023 05:38
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: [EXTERNAL] [WebAIM] Focus reset

Hai all,

I have come across a page where we have a group of buttons in the left side and related contents will be updating in the right side based on our selection in the left side. As we land on the page, no button is selected. so, right side, we don't have any contents.
In the dom order, first focus goes to the left side contents then to the right . so, it is fine .
I would like to know which way would be the right one to communicate to the screen reader user that contents updated in the right side after selecting any of the buttons

I could think of 3 ways.

1. Setting the focus to the start of the updated contents after selecting any of the buttons

But, I don't think this is the right way . Because, sighted keyboard-only user won't be interested with this approach as they have to do multiple shift+ tab always if they want to select other buttons and see related contents.

2. Giving an offscreen instruction at the top of the group of buttons and associating it with the group using aria-describedby . for
example: selection of any of these buttons add contents below

This works and does not create any trrouble for anyone. but, is it the better way . not sure Is it enough for a screen reader users ?

3. Providing an alert message as soon a the contents appears I think this is the better one. I assume this gives clear information to screen reader users .
but, what would be the right alert message ? we have a section heading like "product features".
Is it sufficient if we make this heading get announced ? or do we need to give any offscreen alert message like "contents are updated "

Please suggest me what would be the right solution


Thanks in advance,
Sumit .