Skip to content

Commit

Permalink
Update references in non-normative docs (#3854)
Browse files Browse the repository at this point in the history
- Replace reference to focus section of HTML 4.01 spec with reference to
focus section of the HTML living standard in non-normative documents
- correct uses of lists to be either unordered or ordered as appropriate
- correct relative links

---------

Co-authored-by: Patrick H. Lauke <[email protected]>
Co-authored-by: Alastair Campbell <[email protected]>
Co-authored-by: Mike Gower <[email protected]>
Co-authored-by: Wilco Fiers <[email protected]>
Co-authored-by: Mike Gower <[email protected]>
Co-authored-by: Giacomo Petri <[email protected]>
Co-authored-by: Bruce Bailey <[email protected]>
  • Loading branch information
8 people authored Jun 11, 2024
1 parent 9139768 commit e041c1c
Showing 1 changed file with 23 additions and 73 deletions.
96 changes: 23 additions & 73 deletions understanding/20/focus-order.html
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,6 @@ <h2>In brief</h2>
<section id="intent">
<h2>Intent of Focus Order</h2>


<p>The intent of this Success Criterion is to ensure that when users navigate sequentially
through content, they encounter information in an order that is consistent with the
meaning of the content and can be operated from the keyboard. This reduces confusion
Expand All @@ -34,10 +33,9 @@ <h2>Intent of Focus Order</h2>
<p>The way that sequential navigation order is determined in Web content is defined by
the technology of the content. For example, simple HTML defines sequential navigation
via the notion of tabbing order. Dynamic HTML may modify the navigation sequence using
scripting along with the addition of a tabindex attribute to allow focus to additional
elements. If no scripting or tabindex attributes are used, the navigation order is
the order that components appear in the content stream. (See HTML 4.01 Specification,
section 17.11, "Giving focus to an element").
scripting along with the addition of a <code class="language-html">tabindex</code> attribute to allow focus to additional
elements. If no scripting or <code class="language-html">tabindex</code> attributes are used, the navigation order is
the order that components appear in the content stream. (See <a href="https://html.spec.whatwg.org/multipage/interaction.html#focus"><cite>Focus</cite> in the HTML Living Standard</a>).
</p>

<p>An example of keyboard navigation that is not the sequential navigation addressed
Expand All @@ -50,7 +48,7 @@ <h2>Intent of Focus Order</h2>
</p>

<p>The focus order may not be identical to the programmatically determined reading order
(see Success Criterion 1.3.2) as long as the user can still understand and operate
(see <a href="meaningful-sequence.html">Success Criterion 1.3.2</a>) as long as the user can still understand and operate
the Web page. Since there may be several possible logical reading orders for the content,
the focus order may match any of them. However, when the order of a particular presentation
differs from the programmatically determined reading order, users of one of these
Expand Down Expand Up @@ -145,7 +143,7 @@ <h2>Examples of Focus Order</h2>
<p>An HTML Web page is created with the left hand navigation occurring in the HTML after
the main body content, and styled with CSS to appear on the left hand side of the
page. This is done to allow focus to move to the main body content first without requiring
tabIndex attributes or JavaScript.
<code class="language-html">tabindex</code> attributes or JavaScript.
</p>

<div class="note">
Expand Down Expand Up @@ -186,110 +184,62 @@ <h2>Resources for Focus Order</h2>
<section id="techniques">
<h2>Techniques for Focus Order</h2>


<section id="sufficient">
<h3>Sufficient Techniques for Focus Order</h3>


<ul>

<li>

<a href="../Techniques/general/G59" class="general">Placing the interactive elements in an order that follows sequences and relationships
within the content
</a>

<li>
<a href="../Techniques/general/G59">Placing the interactive elements in an order that follows sequences and relationships within the content</a>
</li>

<li>

<p>Giving focus to elements in an order that follows sequences and relationships within
the content using one of the following techniques:
<p>Giving focus to elements in an order that follows sequences and relationships within the content using one of the following techniques:
</p>

<ul>

<li>

<a href="../Techniques/css/C27" class="css">Making the DOM order match the visual order</a>

<li>
<a href="../Techniques/css/C27">Making the DOM order match the visual order</a>
</li>

<li>

<a href="../Techniques/pdf/PDF3" class="pdf"></a>

<a href="../Techniques/pdf/PDF3"></a>
</li>

</ul>

</li>

<li>

<p>Changing a Web page dynamically using one of the following techniques:</p>

<ul>

<li>

<a href="../Techniques/client-side-script/SCR26" class="script">Inserting dynamic content into the Document Object Model immediately following its
trigger element
<li>
<a href="../Techniques/client-side-script/SCR26">Inserting dynamic content into the Document Object Model immediately following its trigger element
</a>

</li>

<li>

<a href="../Techniques/HTML/H102" class="script">Creating modal dialogs with the HTML dialog element</a>

<li>
<a href="../Techniques/HTML/H102" class="script">Creating modal dialogs with the HTML dialog element</a>
</li>

<li>

<a href="../Techniques/client-side-script/SCR27" class="script">Reordering page sections using the Document Object Model</a>

<li>
<a href="../Techniques/client-side-script/SCR27" class="script">Reordering page sections using the Document Object Model</a>
</li>

</ul>

</li>

</ul>

</ul>
</section>

<section id="advisory">
<h3>Additional Techniques (Advisory) for Focus Order</h3>

</section>

<section id="failure">
<h3>Failures for Focus Order</h3>


<ul>

<li>

<a href="../Techniques/failures/F44" class="failure">Failure of 2.4.3 due to using tabindex to create a tab order that does not preserve
meaning and operability
<li>
<a href="../Techniques/failures/F44" class="failure">Failure of 2.4.3 due to using <code class="language-html">tabindex</code> to create a tab order that does not preserve meaning and operability
</a>

</li>

<li>

<a href="../Techniques/failures/F85" class="failure">Failure of Success Criterion 2.4.3 due to using dialogs or menus that are not adjacent
to their trigger control in the sequential navigation order
</a>

<li>
<a href="../Techniques/failures/F85" class="failure">Failure of Success Criterion 2.4.3 due to using dialogs or menus that are not adjacent to their trigger control in the sequential navigation order
</a>
</li>

</ul>

</section>

</section>

</body>
Expand Down

0 comments on commit e041c1c

Please sign in to comment.