E-mail List Archives
Thread: Trapping focus in an alert
Number of posts in this thread: 10 (In chronological order)
From: Lovely, Brian
Date: Thu, Apr 05 2018 11:37AM
Subject: Trapping focus in an alert
No previous message | Next message →
We have an alert that tells the user they have so many minutes remaining in their session. The alert also contains two buttons, one to continue and one to sign out. The container has a role of alert, and focus is shifted to the container when the alert is displayed. My question is whether or not to trap focus in the alert so the user cannot navigate away until they have activated one of the buttons.
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: Steve Green
Date: Thu, Apr 05 2018 12:12PM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
I invariably advise our clients that they should use a modal dialog i.e. trap the focus as you describe. It's particularly good for people using keyboard navigation or screen readers because it prevents them from accidentally navigating back into the page and then finding it difficult to locate the buttons again.
I suppose it's possible that there are some applications where it is critical that users do not get interrupted during a process (other than hearing or seeing the alert) but I can't think of any.
Steve Green
Managing Director
Test Partners Ltd
From: Meacham, Steve - FSA, Kansas City, MO
Date: Thu, Apr 05 2018 12:13PM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
Assuming this is a web page, a modal dialog containing such an alert should not only trap keyboard focus, but make the controls underneath inert and visually obscured or dimmed, and do likewise with ARIA via aria-hidden or aria-modal.
I could imagine (not recommend) this being done non-modal. In that case, no, do not trap the focus.
From: Sarah Jevnikar
Date: Thu, Apr 05 2018 1:33PM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
Hi there,
From a non-technical end-user perspective, trapping the focus seems to make sense to me, so long as the alert is read and reviewable, and the buttons are clearly labelled so a screen reader user in particular won't suddenly hear nothing and not know why
Sarah Jevnikar
Accessibility Consultant
Digital Echidna
p: 519-858-4438 ex. 211
e: = EMAIL ADDRESS REMOVED =
From: Glen Walker
Date: Fri, Apr 06 2018 10:47AM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
I agree with the modal recommendation and trapping the focus but I have an additional question. Does your timeout dialog have a timer? I often see a "are you still there?" type dialog with a continue and logoff button, but I'm not told how long I have before I'm logged off. If I stepped away from my computer and came back to hear the dialog, I wouldn't know if I had to hurry to find the continue button. I like timers but you obviously don't want a live region that updates every second.
From: Lovely, Brian
Date: Fri, Apr 06 2018 10:53AM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
I have to admit I simplified my description slightly. It is not actually coded yet, and I was performing a design assessment. That said, the phrase in the alert about your session ending included 4:59 or something like that. I don't now recall the exact amount of time, but I was satisfied that it was sufficient. I toyed with suggesting that the time announce periodically, but every second would be waaay to verbose, and coding it so it only updated on a custom cadence seemed like overkill, and there was sufficient time indicated in the design that I figured a user could see the time remaining and be able to choose to either continue or to log out without feeling rushed.
From: Meacham, Steve - FSA, Kansas City, MO
Date: Fri, Apr 06 2018 2:37PM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
Would aria-live="polite" be too verbose?
From: Jonathan Cohn
Date: Fri, Apr 06 2018 2:47PM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
I wouldn't want a polite region like this updated any more often than 4 times a minute.
> On Apr 6, 2018, at 4:37 PM, Meacham, Steve - FSA, Kansas City, MO < = EMAIL ADDRESS REMOVED = > wrote:
>
> Would aria-live="polite" be too verbose?
>
>
From: Steve Faulkner
Date: Fri, Apr 06 2018 4:58PM
Subject: Re: Trapping focus in an alert
← Previous message | Next message →
Hi Brian, 2 suggestions
Use role=alertdialog as the alert role is not for dialogs and does not
convey the appropriate semantics.
Follow the Alert dialog design pattern
https://www.w3.org/TR/wai-aria-practices/#alertdialog
On Thursday, 5 April 2018, Lovely, Brian via WebAIM-Forum <
= EMAIL ADDRESS REMOVED = > wrote:
> We have an alert that tells the user they have so many minutes remaining
> in their session. The alert also contains two buttons, one to continue and
> one to sign out. The container has a role of alert, and focus is shifted to
> the container when the alert is displayed. My question is whether or not to
> trap focus in the alert so the user cannot navigate away until they have
> activated one of the buttons.
> >
> 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.
> > > > >
--
--
Regards
SteveF
Current Standards Work @W3C
<http://www.paciellogroup.com/blog/2015/03/current-standards-work-at-w3c/>
From: Birkir R. Gunnarsson
Date: Sat, Apr 07 2018 11:35AM
Subject: Re: Trapping focus in an alert
← Previous message | No next message
I was going to mention the alertdialog role but Steve beat me to it.
THe aert role is for noninteractive alerts that do not grab fous.
When you have an alert that the user has to respond to, code it as an
alertdialog, use aria-labelledby or aria-label to call it "Session
timeout", use aria-describedby to connect it with the message (your
session will time out in x seconds) or whatever, and place focus on
the primary CTA button in the dialog, probably "continue" or "extend"
session.
Use role="time" on the span with the time remaining (it is a vie
region role with value of off, a screen reader should only announce
updates to it if the user has screen reader focus right on th element
itself.
HTML would look something like
<div role='alertdialog" aria-modal="true" aria-labelledby="toHeading"
aria-describedby="toMessage">
<h4 id="toHeading">Session timeout alert</h4>
<p id="toMessage">Your session will expire in <span
role="timer">45</spn> seconds.</p>
<!-- this button should get focus when dialog is displayed. -->
<button class="primary">Extend session</button>
<button class="secondary">Log out</button>
</div>
On 4/6/18, Steve Faulkner < = EMAIL ADDRESS REMOVED = > wrote:
> Hi Brian, 2 suggestions
> Use role=alertdialog as the alert role is not for dialogs and does not
> convey the appropriate semantics.
>
> Follow the Alert dialog design pattern
>
> https://www.w3.org/TR/wai-aria-practices/#alertdialog
>
> On Thursday, 5 April 2018, Lovely, Brian via WebAIM-Forum <
> = EMAIL ADDRESS REMOVED = > wrote:
>
>> We have an alert that tells the user they have so many minutes remaining
>> in their session. The alert also contains two buttons, one to continue and
>> one to sign out. The container has a role of alert, and focus is shifted
>> to
>> the container when the alert is displayed. My question is whether or not
>> to
>> trap focus in the alert so the user cannot navigate away until they have
>> activated one of the buttons.
>> >>
>> 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.
>> >> >> >> >>
>
>
> --
> --
>
> Regards
>
> SteveF
> Current Standards Work @W3C
> <http://www.paciellogroup.com/blog/2015/03/current-standards-work-at-w3c/>
> > > > >
--
Work hard. Have fun. Make history.