WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Where should focus be on page load?


From: Geethavani.Shamanna
Date: Dec 6, 2021 6:39AM

I would like to add another item to this well-compiled list.

When adding items to the shopping cart on a popular supermarket site, on selecting the quantity for an item and clicking the Add button, the page refreshes and focus moves to the top of the page. Here the focus should ideally move to the item following the one that has already been added. If an item is added without altering the quantity, then the focus moves to the next item as expected. On supermarket sites where shoppers are likely to add dozens of items, testing the focus behaviour is very critical.

-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of Birkir R. Gunnarsson
Sent: 06 December 2021 11:59
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] Where should focus be on page load?

CAUTION: This mail comes from outside the University. Please consider this before opening attachments, clicking links, or acting on the content.

If it's a full page reload focus should go to the top of the page (its expected behavior).
By full page reload I basially mean the whole main content of the page is refreshed and the title is changed.
If the page has more than 5 focusable elements in the header, it should ahve a skip link anyway to quickly get the usre back to main content (the 5 rule is my best practice, not WCAG).

If the reload happened as a result of the user clicking the "back"
button, focus should go to the link used to navigate to that page.

If focus is returning from a modal dialog or tooltip, focus should be placed back on the element used to trigger its display (unless the user took action in the dialog that changed the context, e.g. delete an item or navigate elsewhere).

If the user deleted an item from a table or list, focus should either go to the top of the table/list or to the element prior to the one being deleted (or the ome immediately following), no hard rule but it makes sense, you don't want to interup the user's train of thought and they might not be done interacting with that content.

If you have an accordion or tab that the user activates, the focus stays on the trigger used to display content, it does not move.

If you trigger display of content that does not immediately follow the location of the trigger, the focus should go to the beginning of that content.

For other issues, use your best judgment or consult with your UX team and/or usability testing.

On 12/6/21, Mark Magennis < <EMAIL REMOVED> > wrote:
> Actually, not just interested to hear from screen reader users but
> keyboard users in general.
> -----Original Message-----
> From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of
> Mark Magennis
> Sent: 06 December 2021 10:30
> Subject: [EXTERNAL] [WebAIM] Where should focus be on page load?
> I'd be interested in hearing the opinions of screen reader users or
> those who are very familiar with screen reader users' experiences
> about where focus should be when a page loads. I see this as a
> usability issue rather than a compliance one.
> The way I've always looked at this is that when a new 'page' is opened
> - either a new URL or, in a single page application, a new distinct
> functional chunk (vague I know), focus should normally go to the top
> of the page. This helps with predictability and consistency. Only in
> exceptional circumstances should focus be moved to somewhere else such
> as the start of the unique page content.
> In my thinking, exceptional circumstances are when the user is engaged
> in a predictable workflow, where the current step leaves focus
> somewhere distant from the content the user will predictably need to
> read or interact with next. An example is a site search that opens a
> search results page. It is predictable that after submitting the
> search the user will want to immediately read the results. It's hard
> to imagine a scenario when this will not be the case. So when the
> search results page open, it is helpful to place focus at the start of
> the results, usually on a results statement such as "Showing 20 of
> 1,483 results for xxxxx". Other predictable workflows occur within
> multi-step processes such as purchasing or ticket booking where at
> each step the user will always want to go to the start of the step
> instructions or inputs. So it is helpful to place them there when the step is loaded.
> Am I looking at this the right way, or is it helpful to place focus at
> the start of the unique content more often, even on most pages perhaps?
> Aside from page loads, content changes with predictable workflows seem
> to occur whenever hidden content is revealed or new content is added to a page.
> For example, if a 'Show Table of Contents' button is used to open a
> content navigation panel should focus be moved to the panel because it
> is predictable that the user will want to use it (why would they have
> opened it otherwise)? Or when an 'Add New Record' button in a table
> toolbar causes a new row to be added to the table containing fields
> that need to be filled in. It seems predictable that the user will
> want to immediately fill them in, so should focus always be moved to
> the first field in the newly added row?
> Would be very interested to hear users' preferences. Thanks, Mark
> Mark Magennis (he/him)
> Senior Accessibility Specialist
> Skillsoft | mobile: +353 87 60 60 162
> www.skillsoft.com<;http://www.skillsoft.com/>;
> [Skillsoft / Sumtotal]
> > > archives at http://webaim.org/discussion/archives
> >

Work hard. Have fun. Make history.