-
Notifications
You must be signed in to change notification settings - Fork 5
/
Copy pathnavigation.html
executable file
·151 lines (133 loc) · 8.75 KB
/
navigation.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
<!DOCTYPE HTML>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=yes">
<title>Navigation - Défauts d’accessibilité : Impacts sur les utilisateurs</title>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
<link rel="stylesheet" href="css/styles.css" media="all">
<link rel="stylesheet" href="css/print.css" media="print">
</head>
<body>
<div class="main-header">
<div class="inside">
<ul class="skip-links">
<li><a href="#main">contenu</a></li>
<li><a href="#navigation">navigation</a></li>
</ul>
<header role="banner" class="header clear" id="banner">
<h1 class="title">Défauts d’accessibilité : Impacts sur les utilisateurs</h1>
</header>
<nav role="navigation" class="gp-sommaire" id="navigation" aria-label="Sommaire du guide">
<button id="btnSommaire" aria-expanded="false">Sommaire</button>
<ul class="sommaire is-hidden" id="sommaireToggle">
<li><a href="index.html">Introduction</a></li>
<li><a href="personnes.html">Personnes handicapées et navigation sur le web</a>
<ul>
<li><a href="handicap-visuel.html">Handicap visuel</a></li>
<li><a href="handicap-auditif.html">Handicap auditif</a></li>
<li><a href="handicap-moteur.html">Handicap moteur</a></li>
<li><a href="handicap-mental.html">Handicap mental</a></li>
</ul>
</li>
<li><a href="rgaa.html">Problématiques prises en charge par les critères du RGAA pour les utilisateurs en situation de handicap</a>
<ul>
<li><a href="images.html">Images</a></li>
<li><a href="cadres.html">Cadres</a></li>
<li><a href="couleurs.html">Couleurs</a></li>
<li><a href="multimedia.html">Multimédia</a></li>
<li><a href="tableaux.html">Tableaux</a></li>
<li><a href="liens.html">Liens</a></li>
<li><a href="scripts.html">Scripts</a></li>
<li><a href="obligatoires.html">Éléments obligatoires</a></li>
<li><a href="structuration.html">Structuration</a></li>
<li><a href="presentation.html">Présentation</a></li>
<li><a href="formulaires.html">Formulaires</a></li>
<li><a href="navigation.html">Navigation</a></li>
<li><a href="consultation.html">Consultation</a></li>
</ul>
</li>
</ul>
</nav>
<div class="github-link">
<p><a title="Contribuer / Télécharger sur Github" href="https://github.com/DISIC/guide-impacts_utilisateurs/">Contribuer / Télécharger</a></p>
</div>
</div>
</div>
<div id="wrapper">
<nav role="navigation" class="internav clear">
<ul>
<li><a class="prev" href="formulaires.html"><span aria-hidden="true"> « </span> Formulaires</a></li>
<li><a class="next" href="consultation.html">Consultation <span aria-hidden="true"> » </span></a></li>
</ul>
</nav>
<main id="main" role="main">
<h1 class="fiche-title">Navigation</h1>
<article class="article">
<p>Les utilisateurs principalement impactés sont les aveugles et grands malvoyants, les déficients visuels, les handicapés moteurs et les handicapés mentaux ou cognitifs.</p>
<p>Dans cette section :</p>
<ul>
<li><a href="#systemes">Systèmes de navigation de la page</a></li>
<li><a href="#ordre">Ordre de tabulation cohérent</a></li>
</ul>
</article>
<article class="article">
<h2 id="systemes">Systèmes de navigation de la page</h2>
<div class="col-1-2">
<h3>Critères</h3>
<ul>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-1">12.1</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-2">12.2</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-3">12.3</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-4">12.4</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-5">12.5</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-6">12.6</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-7">12.7</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-8">12.8</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-9">12.9</a></li>
</ul>
<h3>Utilisateurs principalement impactés</h3>
<p>Aveugles, déficients visuels, handicapés moteurs, handicapés mentaux.</p>
<h3 class="warning">Impact : Modéré à fort</h3>
<p>L’impact est très dépendant de la nature et du volume des problèmes rencontrés. Si l’absence d’un fil d’Ariane a un impact limité, l’absence de moyens de navigation alternatifs, le manque de cohérence visuelle des éléments de navigation et le déplacement des éléments de navigation d’une page à l’autre peuvent constituer de graves problèmes rendant la navigation laborieuse ou trop complexe.</p>
</div>
<div class="col-1-2">
<h3>Explication</h3>
<p>De manière générale tous les utilisateurs pourraient rencontrer des difficultés dans le cas où la navigation dans le site ou un ensemble de pages ne dépend que d’un système de navigation unique.</p>
<p>Pour les handicapés moteurs les difficultés pourraient devenir majeures s’ils ne sont pas en capacité d’utiliser un menu de navigation trop complexe en l’absence de système de navigation alternatif, comme un plan du site par exemple.</p>
<p>Les aveugles et grands malvoyants pourraient, en outre rencontrer des difficultés pour repérer les éléments de navigation si ceux-ci sont déplacés d’une page à l’autre dans le code de la page.</p>
<p>Les handicapés mentaux ou cognitifs pourraient également rencontrer des difficultés si les éléments de navigation adoptent des styles et des présentations très différentes d’une page à l’autre.</p>
<p>Enfin, pour tous ces utilisateurs, la navigation dans le site peut être rendue laborieuse ou complexe en l’absence d’information d’orientation comme l’indication de la page active dans les menus de navigation ou la mise à disposition d’un fil d’Ariane.</p>
</div>
</article>
<article class="article">
<h2 id="ordre">Ordre de tabulation cohérent</h2>
<div class="col-1-2">
<h3>Critères</h3>
<ul>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-13">12.13</a></li>
<li><a href="http://references.modernisation.gouv.fr/referentiel/criteres.html#crit-12-14">12.14</a></li>
</ul>
<h3>Utilisateurs principalement impactés</h3>
<p>Aveugles, déficients visuels, handicapés moteurs, handicapés mentaux et cognitifs.</p>
<h3 class="warning">Impact : Fort à majeur</h3>
<p>Bien que certaines incohérences dans l’ordre de tabulation peuvent n’avoir qu’un impact limité, les difficultés potentielles sont toujours très impactantes, ce qui nécessite qu’elles soient traitées sans délai. </p>
</div>
<div class="col-1-2">
<h3>Explication</h3>
<p> L'ordre de tabulation est déterminant à la fois dans l’exploration des contenus, mais surtout dans la manipulation d’éléments complexes ou dans l’enchaînement d’actions successives. Tous les utilisateurs vont rencontrer des difficultés importantes si celui-ci n’est pas correct.</p>
<p>Dans le cas de piège au clavier, les handicapés moteurs seront dans l’incapacité de quitter l’élément en cours de consultation et seront contraints de quitter le navigateur pour retrouver le contrôle du curseur.</p>
</div>
</article>
</main>
<footer id="footer" role="contentinfo" class="clear">
<h2>Licence d'utilisation</h2>
<p class="logo-smgap"><a href="http://references.modernisation.gouv.fr/"><img src="img/modernisation-logo.jpg" alt="Secrétariat général pour le modernisation de l'action publique"></a></p>
<p>Ce document est la propriété du Secrétariat général à la modernisation de l'action publique français (SGMAP). Il est placé sous la <a href="https://www.etalab.gouv.fr/licence-ouverte-open-licence">licence ouverte 1.0 ou ultérieure</a>, équivalente à une licence <i lang="en">Creative Commons BY</i>. Pour indiquer la paternité, ajouter un lien vers la version originale du document disponible sur le <a href="https://github.com/DISIC">compte <span lang="en">GitHub</span> de la DInSIC</a>.</p>
</footer>
</div>
<script src="js/script.js"></script>
</body>
</html>