-
Notifications
You must be signed in to change notification settings - Fork 3
/
Copy pathaide.html
executable file
·199 lines (163 loc) · 11.4 KB
/
aide.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
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="utf-8" />
<title>Aide et accessibilité</title>
<link rel="stylesheet" href="style-modele.css" />
</head>
<body>
<header>
<h1>Aide et accessibilité</h1>
</header>
<main>
<div class="article">
<div class="col-a">
<h2>Introduction</h2>
<p>Cette page vise à vous guider dans l'utilisation du site.</p>
<p>Pour connaître le niveau d'accessibilité de ce site, visitez la <a href="declaration-de-conformite.html">déclaration de conformité au RGAA 3 2016</a>.</p>
<p>L'initiative internationale pour l'accessibilité du Web (<abbr title="Web Accessiblity Initiative" lang="en">WAI</abbr>) définit l'accessibilité du Web comme suit :</p>
<blockquote>L'accessibilité du Web signifie que les personnes en situation de handicap peuvent utiliser le Web. Plus précisément, qu'elles peuvent percevoir, comprendre, naviguer et interagir avec le Web, et qu'elles peuvent contribuer sur le Web. L'accessibilité du Web bénéficie aussi à d'autres, notamment les personnes âgées dont les capacités changent avec l'âge.<br />L'accessibilité du Web comprend tous les handicaps qui affectent l'accès au Web, ce qui inclut les handicaps visuels, auditifs, physiques, de parole, cognitifs et neurologiques.</blockquote>
<p>Voir l'<a href="http://www.w3.org/WAI/intro/accessibility.php" title="Voir l'introduction de la WAI - page en anglais">introduction de la WAI</a>.</p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2>Organisation du site</h2>
<h3>Navigation principale</h3>
<p>Le site est structuré en 6 rubriques, chacune accessible depuis le menu de navigation principal :</p>
<ul>
<li>Accueil</li>
<li>Démarches administratives</li>
<li>Vie citoyenne</li>
<li>Vie associative</li>
<li>Votre commune</li>
<li>Actualités</li>
</ul>
<h3>Autres systèmes de navigation</h3>
<ul>
<li>un plan du site accessible via un lien situé en pied de page ;</li>
<li>un moteur de recherche placé tout en haut du site ;</li>
<li>un fil d’Ariane placé directement sous le menu principal vous indique où vous vous trouvez et le chemin parcouru pour arriver à la page où vous êtes.</li>
</ul>
</div>
<div class="note required col-b">
<h3>Note concernant la section</h3>
<p>Décrivez ici la structure générale du site, avec ses éléments de navigation principaux.<p>
<p>Le RGAA 3 2016 rend obligatoire la mise à disposition d'au moins 2 systèmes de navigation sur chaque page du site, parmi : un menu de navigation principal, une table de contenu, un plan du site ou un moteur de recherche.<br /><a href="http://references.modernisation.gouv.fr/rgaa/criteres.html#crit-12-1">Critère 12.1</a> : Chaque ensemble de pages dispose-t-il de deux systèmes de navigation différents, au moins (hors cas particuliers) ?</p>
<p>Le <a href="https://references.modernisation.gouv.fr/rgaa/glossaire.html#moteur-de-recherche-interne--un-site-web">moteur de recherche</a>, s'il est présent, doit indexer tous les contenus du site pour être considéré comme un système de navigation.<p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2>Navigation par titres</h2>
<ul>
<li>Le titre de niveau 1 correspond au titre principal du site.</li>
<li>Le titre de niveau 2 est le titre de l’article consulté.</li>
</ul>
<p>La plupart des technologies d’assistance et des navigateurs facilitent la navigation par les titres. La plupart des lecteurs d’écran fournissent une fonctionnalité pour sauter au titre suivant.</p>
</div>
<div class="col-b note required">
<h3>Note concernant la section</h3>
<p><strong>Note :</strong> Décrivez ici la structure du document avec les titres.</p>
<p>Le RGAA demande à ce qu'au moins un titre de niveau 1 soit présent sur chaque page. Vous pouvez organiser votre hiérarchie comme vous le souhaitez, à condition qu'elle soit cohérente (Critère niveau A).<br />
<a href="http://references.modernisation.gouv.fr/rgaa/criteres.html#crit-9-1">Critère 9.1</a> : Dans chaque page Web, l'information est-elle structurée par l'utilisation appropriée de titres ?</p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2>Liens d’accès rapide</h2>
<p>Les liens d’accès rapide, présents au début du document, permettent une navigation facilitée vers les régions principales des pages.</p>
</div>
<div class="note required col-b">
<h3>Note concernant la section</h3>
<p>Les liens d'accès rapide sont une obligation du niveau simple A du RGAA 3 2016. Il s'agit de liens de navigation interne dont la fonction est de permettre de naviguer plus rapidement à l'intérieur du contenu. On parle aussi de liens (liens d'évitement, lien d'accès direct au formulaire de recherche ou au menu, etc.). <br /><a href="http://references.modernisation.gouv.fr/rgaa/criteres.html#crit-12-11">Critère 12.11</a> : Dans chaque page Web, des liens d'évitement ou d'accès rapide aux groupes de liens importants et à la zone de contenu sont-ils présents (hors cas particuliers) ?</p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2>Autres améliorations</h2>
</div>
<div class="note col-b">
<h3>Note concernant la section</h3>
<p>Si le site propose d'autres dispositifs relatifs à l'amélioration de l'accessibilité, vous pouvez les décrire dans cette section et indiquer leur fonctionnement (raccourcis clavier, etc.)</p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2><span lang="en">Plugin</span>s nécessaires à la consultation du site</h2>
</div>
<div class="note col-b">
<h3>Note concernant la section</h3>
<p>Si la consultation de certains médias nécessite l'installation de <span lang="en">plugin</span>s, vous devez les lister dans cette section, ainsi que les moyens de téléchargement. Il peut s'agir de modules pour lire le Flash ou des animations dans des formats propriétaires ou de logiciels nécessaires pour la lecture de documents dans certains formats, comme les PDF.</p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2>Navigation clavier pour les composants interactifs</h2>
<p>Le site embarque des composants basés sur la technologie JavaScript. Leur structure et leur comportement au clavier respectent les recommandations internationales.</p>
<p>Pour que ces composants fonctionnent de manière prédictible et selon les notices d'utilisation que nous vous fournissons ci-dessous, les utilisateurs de lecteurs d'écrans doivent les atteindre en mode formulaire, ou activer le mode formulaire une fois dessus.</p>
<p>Nous listons ci-dessous les composants présents sur le site et leur utilisation au clavier.</p>
<ul>
<li><a href="composants.html#tabpanel">Système d'onglets</a></li>
<li><a href="composants.html#slider">Potentiomètre</a></li>
<li><a href="composants.html#dialogmodal">Fenêtre modale</a></li>
<li><a href="composants.html#tooltip"><span lang="en">Tooltip</span></a></li>
<li><a href="composants.html#accordion">Accordéon</a></li>
<li><a href="composants.html#menu">Menu</a></li>
<li><a href="composants.html#tree">Arborescence</a></li>
<li><a href="composants.html#datepicker">Calendrier</a></li>
<li><a href="composants.html#autocomplete">Autocomplétion</a></li>
</ul>
</div>
<div class="note required col-b">
<h3>Note concernant la section</h3>
<p>Si le site comporte des composants interactifs en JavaScript utilisant un rôle WAI-ARIA, décrivez leur utilisation au clavier qui devra être conforme au comportement défini dans la spécification WAI-ARIA. Vous trouverez la liste des composants WAI-ARIA avec des liens vers leur notice d'utilisation respective. Dans votre page d'aide, il est recommandé de faire apparaître ces notices pour guider les utilisateurs pas toujours au fait de ces nouvelles technologies. Recopiez les passages correspondant aux implémentations de votre site dans cette section.</p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2>Signaler un dysfonctionnement</h2>
<p>Si, malgré notre vigilance, vous rencontriez le moindre problème d’accessibilité sur notre site, n’hésitez pas à nous écrire à <a href="mailto:[email protected]">[email protected]</a>.</p>
</div>
<div class="note required col-b">
<h3>Note concernant la section</h3>
<p>La mention d'un contact au sein de l'administration déclarante est obligatoire sur cette page d'aide.</p>
</div>
</div>
<div class="article">
<div class="col-a">
<h2>Défenseur des droits</h2>
<p>Si vous constatez un défaut d'accessibilité vous empêchant d'accéder à un contenu ou une fonctionnalité du site, que vous nous le signalez et que vous ne parvenez pas à obtenir une réponse rapide de notre part, vous êtes en droit de faire parvenir vos doléances ou une demande de saisine au Défenseur des droits. Plusieurs moyens sont à votre disposition : </p>
<ul>
<li>un <a href="http://www.defenseurdesdroits.fr/contact">formulaire de contact</a> ;</li>
<li>la <a href="http://www.defenseurdesdroits.fr/office/">liste du ou des délégués de votre région</a> avec leurs informations de contact direct ;</li>
<li>une adresse postale : Le Défenseur des droits - 7 rue Saint-Florentin - 75409 Paris Cedex 08.</li>
</ul>
</div>
<div class="note required col-b">
<h3>Note concernant la section</h3>
<p>La mention des coordonnées du Défenseur des droits est obligatoire sur cette page d'aide.</p>
</div>
</div>
</main>
<footer>
<h2>Droits de reproduction</h2>
<div class="col-1-3">
<p>Ce document est placé sous <a href="https://www.etalab.gouv.fr/licence-ouverte-open-licence">licence ouverte 1.0 ou ultérieure</a>.</p>
<p class="clear">Vous êtes libres de :</p>
<ul>
<li>Reproduire, copier, publier et transmettre ces informations ;</li>
<li>Diffuser et redistribuer ces informations ;</li>
<li>Adapter, modifier, extraire et transformer ces informations, notamment pour créer des informations dérivées ;</li>
<li>Exploiter ces informations à titre commercial, par exemple en la combinant avec d'autres informations, ou en l'incluant dans votre propre produit ou application.</li>
</ul>
</div>
<div class="col-2-3">
<p>Ces libertés s'appliquent sous réserve de mentionner la paternité de l'information d'origine : sa source et la date de sa dernière mise à jour. Le réutilisateur peut notamment s'acquitter de cette condition en indiquant un ou des liens hypertextes (URL) renvoyant vers le présent site et assurant une mention effective de sa paternité.</p><p>Cette mention de paternité ne doit ni conférer un caractère officiel à la réutilisation de ces informations ni suggérer une quelconque reconnaissance ou caution par le producteur de l'information, ou par toute autre entité publique, du réutilisateur ou de sa réutilisation.</p>
</div>
<div class="col-3-3">
<img src="img/modernisation-logo.jpg" alt="Secrétariat général pour la modernisation de l'action publique" />
</div>
</footer>
</body>
</html>