Skip to content

Commit

Permalink
Broken link fixes to 2.2 documents (#3481)
Browse files Browse the repository at this point in the history 
- fixed links to Accessible Auth (Minimum) in Accessible Auth (Enhanced)
- Updated understanding Understanding:
  - fix all in-page links
  - replace references to WCAG 2.1 with WCAG 2.2
- fix links to Accessible Auth criteria in Redundant Entry 
- fix broken links in techniques → about. (side note: that list hasn't
been updated in over three years)
- fix links to 2.2 criteria

---------

Co-authored-by: Mike Gower <mikegower@gmail.com>
  • Loading branch information
@fstrr @mbgower
fstrr and mbgower committed May 28, 2024
1 parent 6624385 commit 9bc3388
Show file tree
Hide file tree
Showing 18 changed files with 85 additions and 118 deletions.
16 changes: 6 additions & 10 deletions techniques/aria/ARIA20.html
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<!DOCTYPE html><html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"><head><title>Using the region role to identify a region of the page</title><link rel="stylesheet" type="text/css" href="../../css/editors.css" class="remove"/></head><body><h1>Using the region role to identify a region of the page</h1><section class="meta"><p class="id">ID: ARIA20</p><p class="technology">Technology: aria</p><p class="type">Type: Technique</p></section><section id="applicability"><h2>When to Use</h2>
<p>Technologies that support <a href="https://www.w3.org/TR/wai-aria/">Accessible Rich Internet Applications</a>.</p>
</section><section id="description"><h2>Description</h2>
<p>This technique demonstrates how to assign a generic <code class="language-html">region</code> role to a section of a page so that user agents and assistive technologies may be able to programmatically identify it. The <code class="language-html">region</code> role demarcates a segment of the page that contains content of significance so that it is more readily discoverable and navigable. The generic region should be used when the section cannot be marked up using a standard document landmark role (see <a href="../aria/ARIA11">ARIA11</a>).</p>
<p>This technique demonstrates how to assign a generic <code class="language-html">region</code> role to a section of a page so that user agents and assistive technologies may be able to programmatically identify it. The <code class="language-html">region</code> role demarcates a segment of the page that contains content of significance so that it is more readily discoverable and navigable. The generic region should be used when the section cannot be marked up using a standard document landmark role (see <a href="ARIA11">ARIA11</a>).</p>
<p>It is important to name regions, because they are generic grouping elements and users will need some way to tell which region they are in. Regions can be named using <code class="language-html">aria-labelledby</code>, <code class="language-html">aria-label</code>, or another technique. Doing so helps to better expose content and information relationships on the page. The role of <code class="language-html">region</code> should be used prudently, because if overused they can make the page overly verbose for screen reader users.</p>
</section><section id="examples"><h2>Examples</h2>
<section class="example">
Expand Down Expand Up @@ -92,15 +92,11 @@ <h3>Identifying a portlet with a generic region</h3>
<li>Checks #1-3 are true.</li>
</ul>
</section>
</section>
<section id="related">
<h2>Related Techniques</h2>
<ul>
<li><a href="../aria/ARIA11">ARIA11</a></li>
<li><a href="../aria/ARIA12">ARIA12</a></li>
<li><a href="../aria/ARIA13">ARIA13</a></li>
</ul>
</section>
</section><section id="related"><h2>Related Techniques</h2><ul>
<li><a href="ARIA11">ARIA11</a></li>
<li><a href="ARIA12">ARIA12</a></li>
<li><a href="ARIA13">ARIA13</a></li>
</ul></section>
<section id="resources">
<h2>Resources</h2>
<ul>
Expand Down
3 changes: 1 addition & 2 deletions techniques/aria/ARIA24.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,8 +2,7 @@
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<title>Semantically identifying a font icon with role="img"</title>
<link rel="stylesheet" type="text/css" href="https://rawgit.com/w3c/wcag21/master/css/sources.css"/>
<link rel="stylesheet" type="text/css" href="../../css/editors.css"/>
<link rel="stylesheet" type="text/css" href="../../css/editors.css" class="remove" />
</head>
<body>

Expand Down
4 changes: 2 additions & 2 deletions techniques/client-side-script/SCR38.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -144,9 +144,9 @@ <h2>Related Techniques</h2>
<h2>Resources</h2>
<ul>
<li>
<a href="../css/C29#C29-sa1">Using Cookies</a>
<a href="../css/C29#using-cookies">Using Cookies</a>
</li>
<li><a href="../css/C29#C29-sa2">Progressive Enhancement and Unobtrusive JavaScript</a>
<li><a href="../css/C29#progressive-enhancement-and-unobtrusive-javascript">Progressive Enhancement and Unobtrusive JavaScript</a>
</li>
</ul>
</section>
Expand Down
8 changes: 4 additions & 4 deletions techniques/css/C30.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ <h2>Description</h2>
<p>This technique can be used to meet Success Criterion 1.4.5 or 1.4.9 if a presentation that does not include images of text is available and as long as the user interface control that is provided to allow users to switch to an alternate presentation meets the relevant criteria. Where possible, authors should deliver the presentation that does not include images of text as the default presentation. In addition, the control used to switch should be located near the beginning of the page.</p>
<p>A variety of "image replacement" techniques have been developed to address a variety of user agent, configuration and compatibility with assistive technology issues (See resources for more information). While there are a variety of approaches authors may use to replace text, it is important to consider compatibility with assistive technology, whether the technique will work correctly if scripting, CSS, images (or combinations of these) are turned off. Since it can be difficult to find a single solution that works in all cases, this technique recommends the use of a control that allows users to switch to a presentation that does not include an image replacement technique.</p>
<div class="note">
<p>This technique can be used in combination with a style switching technique to present a page that is a <a>conforming alternate version</a> for non-conforming content. Refer to <a href="../css/C29">C29</a> and <a href="../Understanding/conformance#conforming-alt-versions">Understanding Conforming Alternate Versions</a> for more information.</p>
<p>This technique can be used in combination with a style switching technique to present a page that is a <a>conforming alternate version</a> for non-conforming content. Refer to <a href="C29">C29</a> and <a href="../../Understanding/conformance#conforming-alt-versions">Understanding Conforming Alternate Versions</a> for more information.</p>
</div>
</section>
<section id="examples">
Expand Down Expand Up @@ -106,7 +106,7 @@ <h3>Expected Results</h3>
<section id="related">
<h2>Related Techniques</h2>
<ul>
<li><a href="../css/C29">C29</a></li>
<li><a href="C29">C29</a></li>
<li><a href="../failures/F3">F3</a></li>
</ul>
</section>
Expand All @@ -123,10 +123,10 @@ <h2>Resources</h2>
<a href="https://www.digital-web.com/articles/in_defense_of_fahrner_image_replacement/">In Defense of Fahrner Image Replacement</a>
</li>
<li>
<a href="https://en.wikipedia.org/wiki/Fahrner_Image_Replacement">Fahrner Image Replacement</a>
<a href="https://en.wikipedia.org/wiki/CSS_image_replacement">CSS image replacement</a>
</li>
<li>
<a href="https://www.w3.org/TR/CSS2/colors.html#background-properties">CSS2: 14.2.1 Background properties: 'background-color', 'background-image', 'background-repeat', 'background-attachment', 'background-position', and 'background'</a>
<a href="https://www.w3.org/TR/css-backgrounds/">CSS Backgrounds And Borders Module</a>
</li>
</ul>
</section>
Expand Down
8 changes: 5 additions & 3 deletions techniques/failures/F105.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ <h2>Applicability</h2>
<h2>Description</h2>
<p>The objective of this Failure is to describe situations where authors have implemented a function that is operated via a path-based gesture, and no alternative ways of operating this function via simple pointer gestures exist.</p>
<p>If you did not create the content and functionality you can find path-based gestures by exploring the content on a touch screen, or checking the page code for the existence of specific event handlers such as touchstart or touchend. See the <a href="../../Understanding/pointer-gestures.html">Understanding document for Pointer Gestures</a> for more on the path-based gestures.</p>
<p><em>Note:</em> For functionality implemented with a path-based gesture, the possibility of also operating it via the keyboard is beneficial (and may serve to meet Success Criterion 2.1.1 Keyboard). The point of Success Crtierion 2.5.1, however, is to ensure that pointer users who on many devices will have no keyboard available, have alternative ways of operating the function via simple pointer input.</p>
<p><em>Note:</em> For functionality implemented with a path-based gesture, the possibility of also operating it via the keyboard is beneficial (and may serve to meet <a href="../../Understanding/keyboard">Success Criterion 2.1.1 Keyboard</a>). The point of Success Criterion 2.5.1, however, is to ensure that pointer users who on many devices will have no keyboard available, have alternative ways of operating the function via simple pointer input.</p>
</section>
<section id="examples">
<h2>Examples</h2>
Expand Down Expand Up @@ -51,16 +51,18 @@ <h3>Expected Results</h3>
<section id="related">
<h2>Related Techniques</h2>
<ul>
<li><a href="../general/G216">Providing single point activation for a control slider</a></li>
<li><a href="../failures/F101">Failure of Success Criterion 2.5.2 due to activating a control on the down-event</a>.</li>
<li><a href="F101">Failure of Success Criterion 2.5.2 due to activating a control on the down-event</a>.</li>
<li><a href="../general/G216">Providing single point activation for a control slider</a></li>
</ul>
</section>
<!--
<section id="resources">
<h2>Resources</h2>
<p class="instructions">Provide links to external resources that are relevant to users of the technique. This section is optional.</p>
<ul>
<li>Link</li>
</ul>
</section>
-->
</body>
</html>
39 changes: 14 additions & 25 deletions techniques/failures/F41.html
View file
Original file line number Diff line number Diff line change
@@ -1,30 +1,19 @@
<!DOCTYPE html><html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"><head><title>Failure of Success Criterion 2.2.1, 2.2.4, and 3.2.5 due to using meta refresh to reload the page</title><link rel="stylesheet" type="text/css" href="../../css/editors.css" class="remove"/></head><body><h1>Failure of Success Criterion 2.2.1, 2.2.4, and 3.2.5 due to using meta refresh to reload the page</h1><section class="meta"><p class="id">ID: F41</p><p class="technology">Technology: failures</p><p class="type">Type: Failure</p></section><section id="applicability"><h2>When to Use</h2>
<p>HTML</p>
</section><section id="description"><h2>Description</h2>
<p>
meta
http-equiv of refresh is often used to periodically refresh
pages or to redirect users to another page. If the time interval is too
short, and there is no way to turn auto-refresh off, people who are blind will not have enough time to make their screen
readers read the page before the page refreshes unexpectedly and causes the
screen reader to begin reading at the top. Sighted users may also be
disoriented by the unexpected refresh.</p>
</section><section id="examples"><h2>Examples</h2>
</section>
<section id="description">
<h2>Description</h2>
<p><code class="language-html">meta http-equiv</code> of <code class="language-html">refresh</code> is often used to periodically refresh pages or to redirect users to another page. If the time interval is too short, and there is no way to turn auto-refresh off, people who are blind will not have enough time to make their screen readers read the page before the page refreshes unexpectedly and causes the screen reader to begin reading at the top. Sighted users may also be disoriented by the unexpected refresh.</p>
</section>
<section id="examples">
<h2>Examples</h2>
<section class="example">

<p> This is a deprecated example that changes the user's page at regular
intervals. Content developers should not use this technique to
simulate "push" technology. Developers cannot predict how much time
a user will require to read a page; premature refresh can disorient
users. Content developers should avoid periodic refresh and allow
users to choose when they want the latest information. (The number
in the content attribute is the refresh interval in
seconds.)</p>
<p>This is a deprecated example that changes the user's page at regular intervals. Content developers should not use this technique to simulate "push" technology. Developers cannot predict how much time a user will require to read a page; premature refresh can disorient users. Content developers should avoid periodic refresh and allow users to choose when they want the latest information. (The number in the content attribute is the refresh interval in seconds.)</p>

<pre xml:space="preserve"><code class="language-html">&lt;!doctype&gt;
&lt;html lang="en"&gt;
&lt;head&gt;
&lt;title&gt;HTML Techniques for WCAG 2.0&lt;/title&gt;
&lt;title&gt;HTML Techniques for WCAG 2&lt;/title&gt;
&lt;meta http-equiv="refresh" content="60" /&gt;
&lt;/head&gt;
&lt;body&gt;
Expand All @@ -34,13 +23,13 @@
</section>
</section><section id="tests"><h2>Tests</h2>
<section class="procedure"><h3>Procedure</h3>
<p>For a page that uses <code>meta http-equiv="refresh"</code>:</p>
<p>For a page that uses <code class="language-html">meta http-equiv="refresh"</code>:</p>
<ol>
<li>Check that the numerical value for seconds until refresh in the <att>content</att> attribute is present.</li>
<li>Check that the numerical value for seconds until refresh in the <att>content</att> attribute is less than one or greater than 72,000.</li>
<li>Check if the page qualifies for Real-time or Essential Exceptions in <a href="/TR/WCAG/#timing-adjustable">Success Criterion 2.2.1 Timing Adjustable</a>.</li>
<li>Check that the numerical value for seconds until refresh in the <code class="language-html">content</code> attribute is present.</li>
<li>Check that the numerical value for seconds until refresh in the <code class="language-html">content</code> attribute is less than one or greater than 72,000.</li>
<li>Check if the page qualifies for Real-time or Essential Exceptions in <a href="../../Understanding/timing-adjustable">Success Criterion 2.2.1 Timing Adjustable</a>.</li>
<li>Check if the user is provided an opportunity to turn off, extend, or adjust the timing of the page refresh.</li>
<li>Check if the page does not refresh after the duration specified in the <att>content</att> attribute.</li>
<li>Check if the page does not refresh after the duration specified in the <code class="language-html">content</code> attribute.</li>
</ol>
</section>
<section class="results"><h3>Expected Results</h3>
Expand Down
6 changes: 3 additions & 3 deletions techniques/failures/F42.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@
agents including assistive technology may not be able to identify the links
in the content as links. They may be recognized as interactive controls but still not recognized as links. Such elements do not appear in the links
list generated by user agents or assistive technology.</p>
<p><div class="note">It is possible to use the ARIA <code class="language-html">role</code> attribute to identify an anonymous element as link control for assistive technologies. However, best practice for ARIA calls for <a href="https://www.w3.org/TR/aria-in-html/#first-rule-of-aria-use">making use of native elements whenever possible</a>, so the use of the <code class="language-html">role</code> attribute to identify anonymous elements as links is not recommended.</div></p>
<p><div class="note">It is possible to use the ARIA <code class="language-html">role</code> attribute to identify an anonymous element as link control for assistive technologies. However, best practice for ARIA calls for <a href="https://www.w3.org/TR/aria-in-html/#rule1">making use of native elements whenever possible</a>, so the use of the <code class="language-html">role</code> attribute to identify anonymous elements as links is not recommended.</div></p>
<p>The <code class="language-html">a</code> and <code class="language-html">area</code>
elements are intended to mark up links.</p>
</section><section id="examples"><h2>Examples</h2>
Expand Down Expand Up @@ -116,13 +116,13 @@ <h3>Scripting a <code class="language-html">div</code> element</h3>
</ul>
</section>
</section><section id="related"><h2>Related Techniques</h2><ul>
<li><a href="../general/G115">G115</a></li>
<li><a href="../failures/F59">F59</a></li>
<li><a href="../general/G115">G115</a></li>
</ul></section><section id="resources"><h2>Resources</h2>

<ul>
<li>
<a href="https://www.w3.org/TR/wai-aria/">Accessible Rich Internet Applications (WAI-ARIA) Version 1.0</a>
<a href="https://www.w3.org/TR/wai-aria/">Accessible Rich Internet Applications (WAI-ARIA)</a>
</li>
</ul>

Expand Down
12 changes: 2 additions & 10 deletions techniques/failures/F47.html
View file
Original file line number Diff line number Diff line change
@@ -1,19 +1,11 @@
<!DOCTYPE html><html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml"><head><title>Failure of Success Criterion 2.2.2 due to using the blink element</title><link rel="stylesheet" type="text/css" href="../../css/editors.css" class="remove"/></head><body><h1>Failure of Success Criterion 2.2.2 due to using the blink element</h1><section class="meta"><p class="id">ID: F47</p><p class="technology">Technology: failures</p><p class="type">Type: Failure</p></section><section id="applicability"><h2>When to Use</h2>
<p>HTML</p>
</section><section id="description"><h2>Description</h2>
<p>The blink element, while not part of the official HTML or XHTML
specification, is supported by many user agents. It causes any text inside
the element to blink at a predetermined rate. This cannot be interrupted by
the user, nor can it be disabled as a preference. The blinking continues as
long as the page is displayed. Therefore, content that uses
blink fails the Success Criterion because blinking can continue
for more than three seconds.</p>
<p>The blink element, while not part of the official HTML specification, is supported by many user agents. It causes any text inside the element to blink at a predetermined rate. This cannot be interrupted by the user, nor can it be disabled as a preference. The blinking continues as long as the page is displayed. Therefore, content that uses blink fails the Success Criterion because blinking can continue for more than three seconds.</p>
</section><section id="examples"><h2>Examples</h2>
<section class="example">

<p>A product list page uses the blink element to draw
attention to sale prices. This fails the Success Criterion because
users cannot control the blink.</p>
<p>A product list page uses the blink element to draw attention to sale prices. This fails the Success Criterion because users cannot control the blink.</p>

<pre xml:space="preserve"><code class="language-html">&lt;p&gt;My Great Product &lt;blink&gt;Sale! $44,995!&lt;/blink&gt;&lt;/p&gt;</code></pre>
</section>
Expand Down
Loading

0 comments on commit 9bc3388

Please sign in to comment.