WebAIM - Web Accessibility In Mind

E-mail List Archives

Thread: Firefox visual focus indication

for

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

From: Schafer, Carmen
Date: Thu, Sep 28 2017 10:22AM
Subject: Firefox visual focus indication
No previous message | Next message →

Are others considering it a violation of 2.4.7 (Focus Visible) when a website doesn't enhance the browser's default focus indicator since Firefox's default thin black dotted line focus indicator is difficult to see yet Chrome has a more distinct default focus indicator (solid blue line)?

I just want to be clear what is considered a true violation of 2.4.7.

Thanks,
Carmen

From: Patrick H. Lauke
Date: Thu, Sep 28 2017 10:30AM
Subject: Re: Firefox visual focus indication
← Previous message | Next message →

On 28/09/2017 17:22, Schafer, Carmen wrote:
> Are others considering it a violation of 2.4.7 (Focus Visible) when a website doesn't enhance the browser's default focus indicator since Firefox's default thin black dotted line focus indicator is difficult to see yet Chrome has a more distinct default focus indicator (solid blue line)?
>
> I just want to be clear what is considered a true violation of 2.4.7.

Taking a strict reading of WCAG 2, there's no real requirement for how
"visible" a focus indicator needs to be (as "visible" is not really a
testable adjective).

https://github.com/w3c/wcag/issues/302

So going strictly by WCAG 2, an indicator that's difficult to see is
still "visible", so you'd pass it...but I would definitely note that
although it passes nominally, it's really insufficient and the author
should provide an explicit strong indicator.

P
--
Patrick H. Lauke

www.splintered.co.uk | https://github.com/patrickhlauke
http://flickr.com/photos/redux/ | http://redux.deviantart.com
twitter: @patrick_h_lauke | skype: patrick_h_lauke

From: Beranek, Nicholas
Date: Thu, Sep 28 2017 10:37AM
Subject: Re: Firefox visual focus indication
← Previous message | Next message →

Using the default browser focus indicator is a sufficient technique: https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G165

It becomes a failure when the focus indicator is suppressed via CSS through means of outline: none, for example (see www.outlinenone.com for more details!).

If you roll your own, you need to ensure that it's "highly visible". WCAG does not define this term, but we have interpreted it to mean that we should strive for a 4.5 to 1 color contrast ratio.

Nick Beranek
Capital One

From: John Foliot
Date: Thu, Sep 28 2017 11:15AM
Subject: Re: Firefox visual focus indication
← Previous message | Next message →

Hi All,

FWIW, there is a proposed new Success Criteria being advanced for WCAG 2.1.
-

*Success Criterion 1.4.12 User Interface Component Contrast (Minimum)
- (Level AA)*
http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#user-interface-component-contrast-(minimum)

It currently states:


Essential
<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-essential>;
visual
identifiers of user interface components
<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-user-interface-component>;
have
a contrast ratio
<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-contrast-ratio>;
of
at least 4.5:1 against the immediate surrounding color(s), except for the
following situations:
ThickerA contrast ratio of at least 3:1 is required where the minimum width
and height are at least 3 CSS pixels
<http://rawgit.com/w3c/wcag21/accessible-name-terminology-sync/guidelines/#dfn-css-pixel>;,
for the essential visual identifier;InactiveDisabled or otherwise inactive
user interface components;User Agent ControlThe color(s) of the user
interface component and any adjacent color(s) are determined by the user
agent and are not modified by the author.
NOTE

Examples of essential visual identifiers of user interface components may
include (a border, edge, or icon), current value (such as non-text visual
indication of aria-valuenow on a slider) and current state (such as
selection indicator, focus indicator) or other essential visual indication
(which do not rely on color alone).
EDITOR'S NOTE

- Under consideration: simplify this Success Criterion by setting the
minimum color contrast requirement to 3:1 and removing any need for
measuring thickness.
- Under consideration: will review to see if it is possible to combine
with proposed WCAG 2.1 SC 1.4.11 Graphics Contrast.

HTH

JF

On Thu, Sep 28, 2017 at 11:37 AM, Beranek, Nicholas via WebAIM-Forum <
= EMAIL ADDRESS REMOVED = > wrote:

> Using the default browser focus indicator is a sufficient technique:
> https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/G165
>
> It becomes a failure when the focus indicator is suppressed via CSS
> through means of outline: none, for example (see www.outlinenone.com for
> more details!).
>
> If you roll your own, you need to ensure that it's "highly visible". WCAG
> does not define this term, but we have interpreted it to mean that we
> should strive for a 4.5 to 1 color contrast ratio.
>
> Nick Beranek
> Capital One
>
>

From: Schafer, Carmen
Date: Thu, Sep 28 2017 11:49AM
Subject: Re: Firefox visual focus indication
← Previous message | No next message

Thanks for all the useful feedback!

Carmen