Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add notes to 2.4.3 understanding #1643

Open
wants to merge 18 commits into
base: main
Choose a base branch
from
Open
Changes from 1 commit
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Jump to
Jump to file
Failed to load files.
Diff view
Diff view
30 changes: 14 additions & 16 deletions understanding/20/focus-order.html
Expand Up @@ -53,25 +53,27 @@ <h2>Intent of Focus Order</h2>
sets of users and does not appear to either of them to jump around randomly.
</p>

<p>Focus order also does not need to follow the visual presentation of the web page,
<p>Focus order needs to allow the user to navigate focusable elements in a logical order,
and that order needs to preserve any meaning or operation that the page is conveying.
Focus order does not necessarily need to follow the visual layout of the web page,
as long as the order in which elements receive focus is logical, and the hierarchy and relationship
of content implied by the visual presentation is preserved. For instance, in a two-column
layout, the assumption in western left-to-right systems may be that elements in the
left-hand column would receive focus first – and, more generally, that focus order proceeds across lines,
from components in the top-left corner of the viewport to the bottom-right corner.
However, if meaning and operation are not affected, in this case it is not a failure if elements in the right-hand
column receive focus first. As a best practice, though, make sure the focus order reinforces the reading order.
layout, the assumption in western left-to-right systems may be that focus moves through the elements in the
left-hand column first, from the top to the bottom of the column, and then proceed to the right-hand column.
However, if the two columns are independent of each other, and meaning/operation are not affected, it is not
a failure if elements in the right-hand column receive focus first, followed by the elements in the left-hand column.
As a best practice, though, make sure the focus order reinforces the reading order implied by the visual layout.
</p>

<div class="note">
<p>It is not a failure of this success criterion if static/non-interactive content
receives focus. Making an element that does not act as an actionable user interface component
patrickhlauke marked this conversation as resolved.
Show resolved Hide resolved
focusable, or programmatically moving focus to such an element, does not necessarily constitute
patrickhlauke marked this conversation as resolved.
Show resolved Hide resolved
a failure of this success criterion. This situation is a failure if these additional focus stops
impede the operation of the content, or create illogical focus orders - for example, a control
appearing to receive focus multiple times due to the use of nested focusable elements.</p>
a failure of this Success Criterion. This situation is a failure if these additional focus stops
impede the operation of the content, or create confusing and/or illogical focus orders - for example,
a control appearing to receive focus multiple times due to the use of nested focusable elements.</p>
<pre><code>&lt;div tabindex="0"&gt;&lt;button&gt;...&lt;/button&gt;&lt;/div&gt;</code></pre>
<p>As a best practice, avoid having focusable elements which cannot be operated
<p>As a best practice, avoid having too many focusable elements which cannot be operated
patrickhlauke marked this conversation as resolved.
Show resolved Hide resolved
or actioned, as these are likely to make operation tedious for keyboard users.</p>
</div>

Expand All @@ -80,14 +82,10 @@ <h2>Intent of Focus Order</h2>
<ol>

<li>Focusable components need to receive focus in an order that preserves meaning and
operability only when navigation sequences affect meaning and operability.
operability.
</li>

<li>Focus order does not necessarily need to follow visual presentation or layout.</li>

<li>In those cases where it is required, there may be more than one order that will preserve
meaning and operability.
</li>
<li>Focus order does not necessarily need to follow the visual presentation or layout.</li>

<li>If there is more than one order that preserves meaning and operability, only one of
them needs to be provided.
Expand Down