Skip to content

Commit

Permalink
deploy: 9a12fc8
Browse files Browse the repository at this point in the history
  • Loading branch information
pya35 committed Mar 6, 2024
1 parent 162f6ed commit 6bae3fd
Showing 1 changed file with 15 additions and 17 deletions.
32 changes: 15 additions & 17 deletions fr/articles/how-to-test-ios/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -201,10 +201,10 @@ <h3 id="parametrage-des-raccourcis-daccessibilite">Paramétrage des raccourcis d
<li>Réglages &gt; Accessibilité &gt; Raccourci Accessibilité.</li>
<li>Choisir : &quot;Contrôle de sélection&quot;, &quot;VoiceOver“, &quot;Contrôle vocal&quot; et &quot;Accès complet au clavier&quot;.</li>
</ul>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/74baf176-593e-499e-a0a8-8f1267216b3d" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/74baf176-593e-499e-a0a8-8f1267216b3d" alt="" class="img-fluid"></p>
<p><strong>Le raccourci d'accessibilité s'active en appuyant 3 fois sur le bouton latéral de l'iPhone.</strong></p>
<p>Vous pouvez aussi ajouter les raccourcis d’accessibilité au centre de contrôle (Réglages &gt; Centre de contrôle) pour y accéder sans avoir à réaliser la manipulation avec le bouton latéral.</p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/423eeffd-e3db-40c4-94ff-041da2ebe565" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/423eeffd-e3db-40c4-94ff-041da2ebe565" alt="" class="img-fluid"></p>
<h3 id="parametrage-du-controle-de-selection">Paramétrage du Contrôle de sélection <a class="header-anchor" href="#parametrage-du-controle-de-selection" aria-labelledby="a11y_heading_anchor_label">#</a></h3>
<p>Aller dans Réglages &gt; Accessibilité &gt; Contrôle de sélection &gt; Boutons<br>
Sans dispositif externe, il convient de configurer simplement :</p>
Expand All @@ -213,13 +213,13 @@ <h3 id="parametrage-du-controle-de-selection">Paramétrage du Contrôle de séle
<li>type: “Ecran”</li>
<li>action: “Sélectionner un élément”</li>
</ul>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/0e85631b-a638-4b6e-af34-a3abed2e439a" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/0e85631b-a638-4b6e-af34-a3abed2e439a" alt="" class="img-fluid"></p>
<p>De cette manière, une succession de taps n'importe où sur l'écran permettra de contrôler l'avancée du focus et les actions associées (nous détaillerons le principe plus bas dans l'article).</p>
<h3 id="police-plus-grande-dans-le-centre-de-controle">&quot;Police plus grande&quot; dans le centre de contrôle <a class="header-anchor" href="#police-plus-grande-dans-le-centre-de-controle" aria-labelledby="a11y_heading_anchor_label">#</a></h3>
<p>Toujours pour faciliter l'accès aux fonctions d'accessibilité, il est possible d'ajouter le réglage de la taille des textes.<br>
Aller dans Réglages &gt; Centre de contrôle et sélectionner &quot;Taille du texte&quot;.<br>
Vous pourrez alors accéder facilement à l'option.</p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/20e7a11e-d3f8-481d-a021-ec4f7ab4632a" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/20e7a11e-d3f8-481d-a021-ec4f7ab4632a" alt="" class="img-fluid"></p>
<h2 id="prise-en-main-des-options-daccessibilite">Prise en main des options d'accessibilité <a class="header-anchor" href="#prise-en-main-des-options-daccessibilite" aria-labelledby="a11y_heading_anchor_label">#</a></h2>
<h3 id="voice-over">Voice Over <a class="header-anchor" href="#voice-over" aria-labelledby="a11y_heading_anchor_label">#</a></h3>
<p>La navigation à l'aide du lecteur d'écran n'est pas toujours aisée quand on débute, mais quelques gestes de base assez simples permettent de naviguer dans une application.</p>
Expand All @@ -240,25 +240,25 @@ <h3 id="controle-de-selection">Contrôle de sélection <a class="header-anchor"
<li>Pour que le focus se déplace à l'intérieur d'un conteneur, il suffit de taper une fois lorsque le focus arrive sur ce conteneur.</li>
<li>Dès lors, un tap supplémentaire fera apparaître les options d'intéractions possibles avec chaque élément ayant le focus (tap, défilement haut/bas, glissé...)</li>
</ol>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/6fde5e3b-5084-4199-8e09-0925d3a763cf" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/6fde5e3b-5084-4199-8e09-0925d3a763cf" alt="" class="img-fluid"></p>
<h3 id="navigation-clavier">Navigation clavier <a class="header-anchor" href="#navigation-clavier" aria-labelledby="a11y_heading_anchor_label">#</a></h3>
<p>Il est possible d'utiliser son téléphone seulement avec un clavier externe.</p>
<ol>
<li>Connecter un clavier au téléphone</li>
<li>Activer l’option “Accès complet au clavier”</li>
</ol>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/dd8e2a5a-607c-4f77-921c-be43dfdf5e2e" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/dd8e2a5a-607c-4f77-921c-be43dfdf5e2e" alt="" class="img-fluid"></p>
<ol start="3">
<li>A présent, toutes les fonctionnalités disponibles à la souris doivent l’être également à l’aide du clavier.<br>
La navigation se fait de la même manière que pour un clavier sur desktop, touche <code>TAB</code> pour avancer, <code>SHIFT+TAB</code> pour reculer, <code>ESPACE</code> pour activer un élément.<br>
Des combinaisons sont également spécifiques à l'environnement mobile iOS.</li>
<li>La navigation clavier permet également de vérifier que l'ordre de navigation est respecté.</li>
La navigation se fait de la même manière que pour un clavier sur desktop, touche <code>TAB</code> pour avancer, <code>SHIFT+TAB</code> pour reculer, <code>ESPACE</code> pour activer un élément.</li>
</ol>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/f3e1bb95-27dc-47ce-9b16-fa89a91079e8" alt="image" class="img-fluid"></p>
<ol start="5">
<p>Des combinaisons sont également spécifiques à l'environnement mobile iOS :</p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/f3e1bb95-27dc-47ce-9b16-fa89a91079e8" alt="" class="img-fluid"></p>
<ol start="4">
<li>La navigation clavier permet également de vérifier que l'ordre de navigation est respecté.</li>
<li>Si le focus n'est pas assez visible, il est possible d'augmenter son contraste dans les paramètres de l'option</li>
</ol>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/d1e966c5-bc5b-447f-a8db-b0fea6140fec" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/d1e966c5-bc5b-447f-a8db-b0fea6140fec" alt="" class="img-fluid"></p>
<h3 id="controle-vocal">Contrôle vocal <a class="header-anchor" href="#controle-vocal" aria-labelledby="a11y_heading_anchor_label">#</a></h3>
<p>Lorsque « Contrôle vocal » est activé, vous pouvez énoncer des commandes comme :</p>
<ul>
Expand All @@ -268,13 +268,13 @@ <h3 id="controle-vocal">Contrôle vocal <a class="header-anchor" href="#controle
<li>« Monter le volume »</li>
</ul>
<p>Par défaut, le nom des éléments est superposé. Aussi, pour qu'une application soit pilotable de la sorte, il faut que les composants interactifs aient un nom accessible simple et cohérent (en particulier dans le cas d'une image-lien ou image-bouton sans libellé visible).</p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/ec76969b-d442-484e-8a80-c36376dcdc92" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/ec76969b-d442-484e-8a80-c36376dcdc92" alt="" class="img-fluid"></p>
<p>Il est également possible d'afficher le numéro des éléments ou même une grille numérotée pour les atteindre.</p>
<h3 id="police-plus-grande">Police plus grande <a class="header-anchor" href="#police-plus-grande" aria-labelledby="a11y_heading_anchor_label">#</a></h3>
<ol>
<li>Agrandir la police de caractères à partir du raccourci configuré plus haut</li>
</ol>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/20e7a11e-d3f8-481d-a021-ec4f7ab4632a" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/20e7a11e-d3f8-481d-a021-ec4f7ab4632a" alt="" class="img-fluid"></p>
<ol start="2">
<li>
<p>Il est possible d'activer l'agrandissement de texte jusqu'à 310%, mais les recommandations d'accessibilité demandent un affichage correct jusqu'à 235%.</p>
Expand All @@ -283,9 +283,7 @@ <h3 id="police-plus-grande">Police plus grande <a class="header-anchor" href="#p
<p>Si l'application a été prévue pour supporter l'agrandissement (Dynamic Type), alors les textes seront correctement restitués, lisibles et sans perte d'information (pas de texte tronqué ni de superposition)</p>
</li>
</ol>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/d40af4bc-6397-48e6-9e72-e76bf97a8df4" alt="image" class="img-fluid"><br>
<img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/8a186731-ec78-4b2d-b7de-1a42ac265c4e" alt="image" class="img-fluid"><br>
<img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/76ef0b5a-382b-48be-847a-4517cf0a512a" alt="image" class="img-fluid"></p>
<p><img src="https://github.com/Orange-OpenSource/a11y-guidelines/assets/105045667/f3bd6e96-b44b-44a8-b2f2-cd5136c82993" alt="" class="img-fluid"></p>

</div>
</main>
Expand Down

0 comments on commit 6bae3fd

Please sign in to comment.