[Fix] Change all links from WCAG 2.1 to WCAG 2.2

src/assets/json/checklist/tests-web-en.json

@@ -199,7 +199,7 @@
 	"title": "Provide accessible flashes",
 	"type": ["Manual test"],
 	"tests": ["Inspect the animation and video contents of the page that flashes"],
-	"verifier": ["Make sure that any content does not show rapid flashes (more than 3 flashes per second) or the flashes are below the <a href='https://www.w3.org/TR/WCAG21/#dfn-general-flash-and-red-flash-thresholds' target='_blank'>general flash and red flash thresholds</a>."],
+	"verifier": ["Make sure that any content does not show rapid flashes (more than 3 flashes per second) or the flashes are below the <a href='https://www.w3.org/TR/WCAG22/#dfn-general-flash-and-red-flash-thresholds' target='_blank'>general flash and red flash thresholds</a>."],
 	"resultat": ["No rapid flash or beyond the general flash and red flash thresholds."],
 	"exception": "",
 	"raccourcis": "",
@@ -813,7 +813,7 @@
 	"title": "Make sure the autocomplete attribute is present to avoid entry errors",
 	"type": ["Manual test"],
 	"tests": ["Manual test", "Browse the forms", "Fill in the forms with specific information about the user"],
-	"verifier": ["For any field that collects specific information about the user (<a href='https://www.w3.org/TR/WCAG21/#input-purposes' target='_blank' aria-label='exhaustive list (new window)'> exhaustive list </a>), the <code> autocomplete </code> attribute of the field must be present and have an appropriate value "],
+	"verifier": ["For any field that collects specific information about the user (<a href='https://www.w3.org/TR/WCAG22/#input-purposes' target='_blank' aria-label='exhaustive list (new window)'> exhaustive list </a>), the <code> autocomplete </code> attribute of the field must be present and have an appropriate value "],
 	"resultat": ["The <code>autocomplete</code> attribute is:", "present", "and the value of this attribute is relevant"],
 	"exception": [],
 	"raccourcis": "",

src/assets/json/checklist/tests-web-fr.json

@@ -199,7 +199,7 @@
 	"title": "Rendre accessible les clignotements",
 	"type": ["Test manuel"],
 	"tests": ["Examiner les contenus de type animations et vidéos de la page qui clignotent"],
-	"verifier": ["Vérifier qu'il n'y a pas de contenu présentant des clignotements rapides (plus de 3 flash à la seconde) ou les <a href='https://www.w3.org/TR/WCAG21/#dfn-general-flash-and-red-flash-thresholds' target='_blank' hreflang='en'>flashs sont inférieurs au seuil général ou seuil de rouge</a>."],
+	"verifier": ["Vérifier qu'il n'y a pas de contenu présentant des clignotements rapides (plus de 3 flash à la seconde) ou les <a href='https://www.w3.org/TR/WCAG22/#dfn-general-flash-and-red-flash-thresholds' target='_blank' hreflang='en'>flashs sont inférieurs au seuil général ou seuil de rouge</a>."],
 	"resultat": ["Absence de clignotement ou de flash rapide ou dépassant le seuil général ou de rouge"],
 	"exception": "",
 	"raccourcis": "",
@@ -813,7 +813,7 @@
 	"title": "S'assurer que l'attribut autocomplete est mis en place afin d'éviter les erreurs de saisie",
 	"type": ["Test manuel"],
 	"tests": ["Test manuel", "Parcourir les formulaires", "Renseigner les formulaires avec des  informations spécifiques sur l'utilisateur"],
-	"verifier": ["Pour tout champ qui permet de collecter des informations spécifiques sur l'utilisateur (<a href='https://www.w3.org/TR/WCAG21/#input-purposes' target='_blank' aria-label='liste exhaustive (nouvelle fenêtre)'>liste exhaustive</a>), l'attribut <code>autocomplete</code> du champ doit être présent et avoir une valeur adéquate"],
+	"verifier": ["Pour tout champ qui permet de collecter des informations spécifiques sur l'utilisateur (<a href='https://www.w3.org/TR/WCAG22/#input-purposes' target='_blank' aria-label='liste exhaustive (nouvelle fenêtre)'>liste exhaustive</a>), l'attribut <code>autocomplete</code> du champ doit être présent et avoir une valeur adéquate"],
 	"resultat": ["L'attribut <code>autocomplete</code> est présent", "et la valeur de cet attribut est pertinente"],
 	"exception": [],
 	"raccourcis": "",

src/en/accessibility.njk

@@ -30,7 +30,7 @@ css:
 
       <h3 class="h6 mt-4">Standard applied</h3>
       <p>
-        <a href="https://www.w3.org/TR/WCAG21/"><abbr title="Web Content Accessibility Guidelines">WCAG</abbr> version 2.1, level AA</a>.
+        <a href="https://www.w3.org/TR/WCAG22/"><abbr title="Web Content Accessibility Guidelines">WCAG</abbr> version 2.2, level AA</a>.
       </p>
     </div>
 

src/en/articles/aria-status-messages.md

@@ -9,7 +9,7 @@ tags:
 ---
 
 ## Status message and accessibility
-The WCAG 2.1 criterion <a href="https://www.w3.org/TR/WCAG21/#status-messages">4.1.3 Status Messages</a> requires that important informations for the user, which do not induce a change of context (no opening of a new window, no focus on the content, no modification of the content or the viewport), are seen via properties and roles (<abbr>ARIA</abbr>) by anyone using <abbr>AT</abbr> without taking focus on the message.
+The WCAG 2.1 criterion <a href="https://www.w3.org/TR/WCAG22/#status-messages">4.1.3 Status Messages</a> requires that important informations for the user, which do not induce a change of context (no opening of a new window, no focus on the content, no modification of the content or the viewport), are seen via properties and roles (<abbr>ARIA</abbr>) by anyone using <abbr>AT</abbr> without taking focus on the message.
 
 ## Some examples of status messages
 

src/en/articles/font-size-and-colors.md

@@ -16,19 +16,19 @@ In this article, we will try to answer the following questions concerning the ac
 ## What do the guidelines say ?
 
 The [WCAG](https://www.w3.org/WAI/standards-guidelines/wcag/) do not impose a minimum size or colors for texts. However two criteria must be taken into consideration:
-- <a href="https://www.w3.org/TR/WCAG21/#resize-text"> 1.4.4 Resize text </a>
-- <a href="https://www.w3.org/TR/WCAG21/#contrast-minimum"> 1.4.3 Contrast (Minimum) </a> 
+- <a href="https://www.w3.org/TR/WCAG22/#resize-text"> 1.4.4 Resize text </a>
+- <a href="https://www.w3.org/TR/WCAG22/#contrast-minimum"> 1.4.3 Contrast (Minimum) </a> 
 
 ### Text size enlargement
 
-If the guidelines do not impose a minimum size for characters, [criterion 1.4.4](https://www.w3.org/TR/WCAG21/#resize-text) indicates that the user must be able to increase text size up to 200% without loss of content or functionality. To comply with this criterion, it is essential to test. The procedure to increase text size is available on the following page: [Text size enlargement](https://a11y-guidelines.orange.com/en/web/toolbox/methods-and-test-tools/text-zoom/).
+If the guidelines do not impose a minimum size for characters, [criterion 1.4.4](https://www.w3.org/TR/WCAG22/#resize-text) indicates that the user must be able to increase text size up to 200% without loss of content or functionality. To comply with this criterion, it is essential to test. The procedure to increase text size is available on the following page: [Text size enlargement](https://a11y-guidelines.orange.com/en/web/toolbox/methods-and-test-tools/text-zoom/).
 Sometimes the sizing of certain blocks of text, in particular using sizes in pixels, can lead to loss of information (truncated texts), it is therefore advisable to use relative units (%, em, rem ...). 
 
 ### Color contrast
 
 The guidelines do not require the use or even prohibit the use of certain colors for texts. However, a light gray text on a white background, for example, could be difficult. It is therefore essential to check that the text color and the background color provide a sufficient level of contrast (see levels below). This can be done easily with help [of tools](https://a11y-guidelines.orange.com/en/web/toolbox/methods-and-test-tools/color-contrast-level/).
 
-[Criterion 1.4.3 of the standard](https://www.w3.org/TR/WCAG21/#contrast-minimum) details the required contrast levels.
+[Criterion 1.4.3 of the standard](https://www.w3.org/TR/WCAG22/#contrast-minimum) details the required contrast levels.
 
 For standard texts (not bold):
 - size less than 24px: contrast of 4.5:1 minimum

src/en/articles/form/part2/index.md

@@ -264,7 +264,7 @@ In the example above:
 
 ### Using the autocomplete attribute
 
-The <code>autocomplete</code> attribute makes it easier to fill in fields that contain personal information. All fields whose type is listed in <a href="https://www.w3.org/TR/WCAG21/#input-purposes" lang="en">7. InputPurposes for User Interface Components</a> must contain the <code>autocomplete</code> attribute.
+The <code>autocomplete</code> attribute makes it easier to fill in fields that contain personal information. All fields whose type is listed in <a href="https://www.w3.org/TR/WCAG22/#input-purposes" lang="en">7. InputPurposes for User Interface Components</a> must contain the <code>autocomplete</code> attribute.
 
 In our example the fields below should have an <code>autocomplete</code> attribute:
 <ul>

src/en/articles/test-wcag-253.md

@@ -12,7 +12,7 @@ tags:
 
 ### General explanation
 
-The purpose of [this criterion](https://www.w3.org/TR/WCAG21/#label-in-name) is to ensure that if a button, link, or other interface element contains some screen visible text, its <a href="/en/articles/accessible-name/">accessible name</a> must contain at least the same text as the one displayed.
+The purpose of [this criterion](https://www.w3.org/TR/WCAG22/#label-in-name) is to ensure that if a button, link, or other interface element contains some screen visible text, its <a href="/en/articles/accessible-name/">accessible name</a> must contain at least the same text as the one displayed.
 This is to ensure that users of technical aids can understand and interact with the component. Indeed, the technical aids are based on the accessible name of the components. For example, a voice recognition user will be able to click on a button simply by pronouncing its accessible name.
 
 The visible text and the accessible name do not have to be identical, but the visible text must be present in the accessible name, preferably first.

src/en/mobile/android/design/colors-and-contrasts.md

@@ -34,8 +34,8 @@ The text "film | 20h40 ..." does not have sufficient contrast. It will not be re
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#contrast-minimum">1.4.3 Contrast minimum</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#non-text-contrast">1.4.11 Non text contrast</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#contrast-minimum">1.4.3 Contrast minimum</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#non-text-contrast">1.4.11 Non text contrast</a>
 
 <br/><br/>
 
@@ -80,5 +80,5 @@ Do not use color or sensory information (shape, size, sound, orientation, visual
 
 
 **Référence <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#sensory-characteristics">1.3.3 Sensory characteristics</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#use-of-color">1.4.1 Use of color</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#sensory-characteristics">1.3.3 Sensory characteristics</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#use-of-color">1.4.1 Use of color</a>

src/en/mobile/android/design/focus-navigation.md

@@ -25,9 +25,9 @@ To manage keyboard and Switch Access navigation, there are 2 things to check:
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#keyboard">2.1.1 Keyboard</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#name-role-value">4.1.2 Name, Role, Value</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#focus-visible">2.4.7 Focus Visible</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#keyboard">2.1.1 Keyboard</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#name-role-value">4.1.2 Name, Role, Value</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#focus-visible">2.4.7 Focus Visible</a>
 
 
 ## Order keyboard navigation
@@ -51,8 +51,8 @@ For more information on [focus management on Android](http://developer.android.c
 - You are never trapped in a part of the screen (what we call a keyboard trap)
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#meaningful-sequence">1.3.2 Meaningful Sequence</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#no-keyboard-trap">2.1.2 No Keyboard Trap</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#focus-order">2.4.3 Focus Order</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#meaningful-sequence">1.3.2 Meaningful Sequence</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#no-keyboard-trap">2.1.2 No Keyboard Trap</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#focus-order">2.4.3 Focus Order</a>
 
 

src/en/mobile/android/design/form.md

@@ -28,9 +28,9 @@ It is essential to indicate to the user, for a good understanding of the input s
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#headings-and-labels">2.4.6 Headings and labels</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#labels-or-instructions">3.3.2 Labels or instructions</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#identify-input-purpose">1.3.5 Identify input purpose</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#headings-and-labels">2.4.6 Headings and labels</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#labels-or-instructions">3.3.2 Labels or instructions</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#identify-input-purpose">1.3.5 Identify input purpose</a>
 
 
 ## Identify input errors in the form
@@ -52,5 +52,5 @@ It is also recommended to provide the user with a correction suggestion.
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#error-identification">3.3.1 Error identification</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#error-suggestion">3.3.3 Error suggestion</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#error-identification">3.3.1 Error identification</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#error-suggestion">3.3.3 Error suggestion</a>

src/en/mobile/android/design/general-navigation.md

@@ -39,8 +39,8 @@ In the examples below, the frame with border corresponds to the size of the inte
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#target-size">2.5.5 Target Size</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#pointer-cancellation">2.5.2 Pointer Cancellation</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#target-size">2.5.5 Target Size</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#pointer-cancellation">2.5.2 Pointer Cancellation</a>
 
 
 <br/><br/>
@@ -65,7 +65,7 @@ The application can be used in both portrait and landscape mode.
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#orientation">1.3.4 Orientation</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#orientation">1.3.4 Orientation</a>
 
 <br/><br/>
 ## Propose an alternative to gestural actions
@@ -92,8 +92,8 @@ Navigating between several pages using a horizontal swipe (especially with ViewP
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#pointer-gestures">2.5.1 Pointer Gestures</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#motion-actuation">2.5.4 Motion Actuation</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#pointer-gestures">2.5.1 Pointer Gestures</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#motion-actuation">2.5.4 Motion Actuation</a>
 
 <br/><br/>
 ## Have readable texts
@@ -115,7 +115,7 @@ Android natively offers the Roboto font which has 16 variants, including many sa
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#text-spacing">1.4.12 Text Spacing</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#text-spacing">1.4.12 Text Spacing</a>
 
 <br/><br/>
 ## Use native components
@@ -151,5 +151,5 @@ However, not all phones use a recent version of Android, it is recommended to pr
 - A timeout has a configurable delay.
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#timing-adjustable">2.2.1 Timing Adjustable</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#timing-adjustable">2.2.1 Timing Adjustable</a>
 

src/en/mobile/android/design/headers.md

@@ -25,4 +25,4 @@ A common mistake is to put a unique title for all the pages of an application (o
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#page-titled">2.4.2 Page titled</a> 
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#page-titled">2.4.2 Page titled</a> 

src/en/mobile/android/design/magnification.md

@@ -32,6 +32,6 @@ The text size magnification accessibility option, present in the phone settings.
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#resize-text">1.4.4 Resize text</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#reflow">1.4.10 Reflow</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#resize-text">1.4.4 Resize text</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#reflow">1.4.10 Reflow</a>
 

src/en/mobile/android/design/multimedia.md

@@ -24,8 +24,8 @@ In addition, multimedia content must be able to be controlled at any time by the
 - There is no automatic start of the video when the page loads.
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#audio-control">1.4.2 Audio Control</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#pause-stop-hide">2.2.2 Pause, Stop, Hide</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#audio-control">1.4.2 Audio Control</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#pause-stop-hide">2.2.2 Pause, Stop, Hide</a>
 
 ## Transcribe audio or video content
 
@@ -44,11 +44,11 @@ It is essential to provide an access to visual and auditory information for peop
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#audio-only-and-video-only-prerecorded">1.2.1 Audio-only and Video-only (Prerecorded)</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#captions-prerecorded">1.2.2 Captions (Prerecorded)</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#audio-description-or-media-alternative-prerecorded">1.2.3 Audio Description or Media Alternative (Prerecorded)</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#captions-live">1.2.4 Captions (Live)</a>
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#audio-description-prerecorded">1.2.5 Audio Description (Prerecorded)</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#audio-only-and-video-only-prerecorded">1.2.1 Audio-only and Video-only (Prerecorded)</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#captions-prerecorded">1.2.2 Captions (Prerecorded)</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#audio-description-or-media-alternative-prerecorded">1.2.3 Audio Description or Media Alternative (Prerecorded)</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#captions-live">1.2.4 Captions (Live)</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#audio-description-prerecorded">1.2.5 Audio Description (Prerecorded)</a>
 
 
 ## Avoid epileptic risk contents
@@ -64,4 +64,4 @@ In order to prevent the content of the application from causing epileptic seizur
 
 
 **Reference <abbr>WCAG</abbr>&nbsp;:**  
-- <a lang="en" href="https://www.w3.org/TR/WCAG21/#three-flashes-or-below-threshold">2.3.1 Three Flashes or Below Threshold</a>
+- <a lang="en" href="https://www.w3.org/TR/WCAG22/#three-flashes-or-below-threshold">2.3.1 Three Flashes or Below Threshold</a>