Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Updated posters for Designing accessible services #331

Merged
merged 3 commits into from
Aug 23, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
Binary file removed src/_docs/posters/AutismSpect-en.pdf
Binary file not shown.
Binary file added src/_docs/posters/AutismSpect-en_2023.pdf
Binary file not shown.
Binary file added src/_docs/posters/Cognitif-fr_2023.pdf
Binary file not shown.
Binary file removed src/_docs/posters/Cognitive-en.pdf
Binary file not shown.
Binary file added src/_docs/posters/Cognitive-en_2023.pdf
Binary file not shown.
Binary file removed src/_docs/posters/Hearing-en.pdf
Binary file not shown.
Binary file added src/_docs/posters/Hearing-en_2023.pdf
Binary file not shown.
Binary file removed src/_docs/posters/LowVision-en.pdf
Binary file not shown.
Binary file added src/_docs/posters/LowVision-en_2023.pdf
Binary file not shown.
Binary file added src/_docs/posters/Malvoyants-fr_2023.pdf
Binary file not shown.
Binary file added src/_docs/posters/MoteurPhysique-fr_2023.pdf
Binary file not shown.
Binary file removed src/_docs/posters/MotorPhysical-en.pdf
Binary file not shown.
Binary file added src/_docs/posters/MotorPhysical-en_2023.pdf
Binary file not shown.
Binary file added src/_docs/posters/RevuesDecran-fr_2023.pdf
Binary file not shown.
Binary file removed src/_docs/posters/ScreenReader-en.pdf
Binary file not shown.
Binary file added src/_docs/posters/ScreenReader-en_2023.pdf
Binary file not shown.
Binary file added src/_docs/posters/Sourds-fr_2023.pdf
Binary file not shown.
Binary file added src/_docs/posters/SpectreAutistique-fr_2023.pdf
Binary file not shown.
16 changes: 8 additions & 8 deletions src/en/guides/design-accessible-services.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,12 +6,12 @@

<p>Printable posters <span id="das1">(PDF format)</span>:</p>
<ul>
<li><a href="{{ rootPath }}docs/posters/AutismSpect-en.pdf" id="das2" aria-labelledby="das2 das1">Designing for users on the autistic spectrum</a></li>
<li><a href="{{ rootPath }}docs/posters/Cognitive-en.pdf" id="das3" aria-labelledby="das3 das1">Design principles for users with cognitive disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/Hearing-en.pdf" id="das4" aria-labelledby="das4 das1">Designing for users who are deaf or hard of hearing</a></li>
<li><a href="{{ rootPath }}docs/posters/LowVision-en.pdf" id="das6" aria-labelledby="das6 das1">Designing for users with low vision</a></li>
<li><a href="{{ rootPath }}docs/posters/MotorPhysical-en.pdf" id="das7" aria-labelledby="das7 das1">Designing for users with physical or motor disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/ScreenReader-en.pdf" id="das8" aria-labelledby="das8 das1">Designing for users of screen readers</a></li>
<li><a href="{{ rootPath }}docs/posters/AutismSpect-en_2023.pdf" id="das2" aria-labelledby="das2 das1">Designing for users on the autistic spectrum</a></li>
<li><a href="{{ rootPath }}docs/posters/Cognitive-en_2023.pdf" id="das3" aria-labelledby="das3 das1">Design principles for users with cognitive disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/Hearing-en_2023.pdf" id="das4" aria-labelledby="das4 das1">Designing for users who are deaf or hard of hearing</a></li>
<li><a href="{{ rootPath }}docs/posters/LowVision-en_2023.pdf" id="das6" aria-labelledby="das6 das1">Designing for users with low vision</a></li>
<li><a href="{{ rootPath }}docs/posters/MotorPhysical-en_2023.pdf" id="das7" aria-labelledby="das7 das1">Designing for users with physical or motor disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/ScreenReader-en_2023.pdf" id="das8" aria-labelledby="das8 das1">Designing for users of screen readers</a></li>
</ul>
<h2>Designing for users on the autistic spectrum</h2>

Expand All @@ -20,7 +20,7 @@ <h2>Designing for users on the autistic spectrum</h2>
<p class="h3">Do:</p>
<ul>
<li>Use simple colours</li>
<li>Write in plain English</li>
<li>Write in plain language</li>
<li>Use simple sentences and bullets</li>
<li>Make buttons descriptive</li>
<li>Build simple and consistent layouts</li>
Expand Down Expand Up @@ -144,7 +144,7 @@ <h2>Designing for users with physical or motor disabilities</h2>
<p class="h3">Do:</p>
<ul>
<li>Make large clickable actions</li>
<li>Give form fields space</li>
<li>Give clickable elements space</li>
<li>Design for keyboard or speech only use</li>
<li>Design with mobile and touchscreen in mind</li>
<li>Provide shortcuts</li>
Expand Down
12 changes: 6 additions & 6 deletions src/en/guides/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -26,12 +26,12 @@ <h2 class="h3">Virtual Collaboration</h2>
<h2 id="design-accessible-services" class="h3"><a href="design-accessible-services">Designing accessible services</a></h2>
<p>Printable posters <span id="das1">(PDF format)</span>:
<ul>
<li><a href="{{ rootPath }}docs/posters/AutismSpect-en.pdf" id="das2" aria-labelledby="das2 das1">Designing for users on the autistic spectrum</a></li>
<li><a href="{{ rootPath }}docs/posters/Cognitive-en.pdf" id="das3" aria-labelledby="das3 das1">Design principles for users with cognitive disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/Hearing-en.pdf" id="das4" aria-labelledby="das4 das1">Designing for users who are deaf or hard of hearing</a></li>
<li><a href="{{ rootPath }}docs/posters/LowVision-en.pdf" id="das6" aria-labelledby="das6 das1">Designing for users with low vision</a></li>
<li><a href="{{ rootPath }}docs/posters/MotorPhysical-en.pdf" id="das7" aria-labelledby="das7 das1">Designing for users with physical or motor disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/ScreenReader-en.pdf" id="das8" aria-labelledby="das8 das1">Designing for users of screen readers</a></li>
<li><a href="{{ rootPath }}docs/posters/AutismSpect-en_2023.pdf" id="das2" aria-labelledby="das2 das1">Designing for users on the autistic spectrum</a></li>
<li><a href="{{ rootPath }}docs/posters/Cognitive-en_2023.pdf" id="das3" aria-labelledby="das3 das1">Design principles for users with cognitive disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/Hearing-en_2023.pdf" id="das4" aria-labelledby="das4 das1">Designing for users who are deaf or hard of hearing</a></li>
<li><a href="{{ rootPath }}docs/posters/LowVision-en_2023.pdf" id="das6" aria-labelledby="das6 das1">Designing for users with low vision</a></li>
<li><a href="{{ rootPath }}docs/posters/MotorPhysical-en_2023.pdf" id="das7" aria-labelledby="das7 das1">Designing for users with physical or motor disabilities</a></li>
<li><a href="{{ rootPath }}docs/posters/ScreenReader-en_2023.pdf" id="das8" aria-labelledby="das8 das1">Designing for users of screen readers</a></li>
</ul>
<footer class="small">
<p>Credits: <cite><abbr title="United Kingdom">UK</abbr> government</cite> (<a href="https://ukhomeoffice.github.io/accessibility-posters/" rel="external">source<span class="wb-inv">: Designing accessible services</span></a>)</p>
Expand Down
75 changes: 37 additions & 38 deletions src/fr/guides/design-accessible-services.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,63 +6,62 @@

<p>Affiches imprimables <span id="das1">(format PDF)</span>&nbsp;:</p>
<ul>
<li><a href="{{ rootPath }}docs/posters/Cognitif-fr.pdf" id="das2" aria-labelledby="das2 das1">Principes de conception pour les utilisateurs avec handicap cognitif</a></li>
<li><a href="{{ rootPath }}docs/posters/SpectreAutistique-fr.pdf" id="das3" aria-labelledby="das3 das1">Concevoir pour les utilisateurs dans le spectre autistique</a></li>
<li><a href="{{ rootPath }}docs/posters/Sourds-fr.pdf" id="das4" aria-labelledby="das4 das1">Concevoir pour les utilisateurs sourds ou malentendants</a></li>
<li><a href="{{ rootPath }}docs/posters/Malvoyants-fr.pdf" id="das5" aria-labelledby="das5 das1">Concevoir pour les utilisateurs malvoyants</a></li>
<li><a href="{{ rootPath }}docs/posters/MoteurPhysique-fr.pdf" id="das6" aria-labelledby="das6 das1">Concevoir pour les utilisateurs avec un handicap physique ou moteur</a></li>
<li><a href="{{ rootPath }}docs/posters/RevuesDecran-fr.pdf" id="das7" aria-labelledby="das7 das1">Concevoir pour les utilisateurs de revues d’écran</a></li>
<li><a href="{{ rootPath }}docs/posters/SpectreAutistique-fr_2023.pdf" id="das2" aria-labelledby="das2 das1">Concevoir pour les utilisateurs dans le spectre autistique</a></li>
<li><a href="{{ rootPath }}docs/posters/Cognitif-fr_2023.pdf" id="das3" aria-labelledby="das3 das1">Principes de conception pour les utilisateurs avec handicap cognitif</a></li>
<li><a href="{{ rootPath }}docs/posters/Sourds-fr_2023.pdf" id="das4" aria-labelledby="das4 das1">Concevoir pour les utilisateurs sourds ou malentendants</a></li>
<li><a href="{{ rootPath }}docs/posters/Malvoyants-fr_2023.pdf" id="das5" aria-labelledby="das5 das1">Concevoir pour les utilisateurs malvoyants</a></li>
<li><a href="{{ rootPath }}docs/posters/MoteurPhysique-fr_2023.pdf" id="das6" aria-labelledby="das6 das1">Concevoir pour les utilisateurs avec un handicap physique ou moteur</a></li>
<li><a href="{{ rootPath }}docs/posters/RevuesDecran-fr_2023.pdf" id="das7" aria-labelledby="das7 das1">Concevoir pour les utilisateurs de revues d’écran</a></li>
</ul>

<h2>Principes de conception pour les utilisateurs avec handicap cognitif</h2>
<h2>Concevoir pour les utilisateurs dans le spectre autistique</h2>

<div class="row">
<div class="col-md-6">
<p class="h3">À faire :</p>
<ul>
<li>Permettez aux utilisateurs de contrôler le contraste et les couleurs sur l'écran</li>
<li>Alignez les textes sur la marge gauche, gardez une disposition cohérente et utilisez une police sans empattements à 12 Pts</li>
<li>Gardez le contenu court,clair et simple</li>
<li>Utilisez des images et des diagrammes pour soutenir le texte et les idées complexes</li>
<li>Utilisez des couleurs simples et utilisez du papier de couleur comme le jaune ou le rose</li>
<li>Utilisez des supports audio et vidéo pour interagir avec les utilisateurs</li>
<li>Utiliser des couleurs simples</li>
<li>Écrire dans un langage clair</li>
<li>Utiliser des phrases simples et des listes à puces</li>
<li>Faire des boutons descriptifs</li>
<li>Faire des mises en pages simples et homogènes</li>
</ul>
</div>
<div class="col-md-6">
<p class="h3">À ne pas faire :</p>
<p class="h3">Chose à ne pas faire :</p>
<ul>
<li>Surcharger les utilisateurs avec trop d'informations en même temps</li>
<li>Écrire de pleines pages de texte en grandes colonnes</li>
<li>Utiliser des expressions du langage familier</li>
<li>Augmenter la charge cognitive des utilisateurs en exigeant qu'ils se souviennent des informations </li>
<li>Utiliser des couleurs vives et contrastantes; évitez de trop fortes stimulations</li>
<li>Presser les utilisateurs ou définir de courts délais pour accomplir des tâches</li>
<li>Utiliser des couleurs vives et contrastées</li>
<li>Utiliser des figures de style et des expressions imagées</li>
<li>Créer des textes très longs</li>
<li>Mettre en place des boutons qui ne précisent pas l’action à effectuer</li>
<li>Faire des mises en pages complexes et surchargées</li>
</ul>
</div>
</div>


<h2>Concevoir pour les utilisateurs dans le spectre autistique</h2>
<h2>Principes de conception pour les utilisateurs avec handicap cognitif</h2>

<div class="row">
<div class="col-md-6">
<p class="h3">À faire :</p>
<ul>
<li>Utiliser des couleurs simples</li>
<li>Écrire dans un langage clair</li>
<li>Utiliser des phrases simples et des listes à puces</li>
<li>Faire des boutons descriptifs</li>
<li>Faire des mises en pages simples et homogènes</li>
<li>Permettez aux utilisateurs de contrôler le contraste et les couleurs sur l'écran</li>
<li>Alignez les textes sur la marge gauche, gardez une disposition cohérente et utilisez une police sans empattements à 12 Pts</li>
<li>Gardez le contenu court,clair et simple</li>
<li>Utilisez des images et des diagrammes pour soutenir le texte et les idées complexes</li>
<li>Utilisez des couleurs simples et utilisez du papier de couleur comme le jaune ou le rose</li>
<li>Utilisez des supports audio et vidéo pour interagir avec les utilisateurs</li>
</ul>
</div>
<div class="col-md-6">
<p class="h3">À ne pas faire :</p>
<p class="h3">Chose à ne pas faire :</p>
<ul>
<li>Utiliser des couleurs vives et contrastées</li>
<li>Utiliser des figures de style et des expressions imagées</li>
<li>Créer des textes très longs</li>
<li>Mettre en place des boutons qui ne précisent pas l’action à effectuer</li>
<li>Faire des mises en pages complexes et surchargées</li>
<li>Surcharger les utilisateurs avec trop d'informations en même temps</li>
<li>Écrire de pleines pages de texte en grandes colonnes</li>
<li>Utiliser des expressions du langage familier</li>
<li>Augmenter la charge cognitive des utilisateurs en exigeant qu'ils se souviennent des informations </li>
<li>Utiliser des couleurs vives et contrastantes; évitez de trop fortes stimulations</li>
<li>Presser les utilisateurs ou définir de courts délais pour accomplir des tâches</li>
</ul>
</div>
</div>
Expand All @@ -81,7 +80,7 @@ <h2>Concevoir pour les utilisateurs sourds ou malentendants</h2>
</ul>
</div>
<div class="col-md-6">
<p class="h3">À ne pas faire :</p>
<p class="h3">Chose à ne pas faire :</p>
<ul>
<li>Utiliser des mots compliqués ou des figures de style</li>
<li>Mettre du contenu audio ou vidéo uniquement</li>
Expand All @@ -106,9 +105,9 @@ <h2>Concevoir pour les utilisateurs malvoyants</h2>
</ul>
</div>
<div class="col-md-6">
<p class="h3">À ne pas faire :</p>
<p class="h3">Chose à ne pas faire :</p>
<ul>
<li>Mettre les boutons et les notifications en contexte</li>
<li>Utiliser des contrastes de couleurs faibles et des polices de petite taille</li>
<li>Ensevelir l’information dans le contenu téléchargé</li>
<li>Utiliser que la couleur pour transmettre l’information</li>
<li>Répartir le contenu sur toute la page</li>
Expand All @@ -131,7 +130,7 @@ <h2>Concevoir pour les utilisateurs avec un handicap physique ou moteur</h2>
</ul>
</div>
<div class="col-md-6">
<p class="h3">À ne pas faire :</p>
<p class="h3">Chose à ne pas faire :</p>
<ul>
<li>Exiger de la précision</li>
<li>Mélanger les interactions</li>
Expand All @@ -156,7 +155,7 @@ <h2>Concevoir pour les utilisateurs de revues d’écran</h2>
</ul>
</div>
<div class="col-md-6">
<p class="h3">À ne pas faire :</p>
<p class="h3">Chose à ne pas faire :</p>
<ul>
<li>Afficher l’information que dans une image ou une vidéo</li>
<li>Répartir le contenu sur toute la page</li>
Expand Down
12 changes: 6 additions & 6 deletions src/fr/guides/index.html
Original file line number Diff line number Diff line change
Expand Up @@ -24,12 +24,12 @@ <h2 class="h3">Collaboration Virtuelle</h2>
<h2 class="h3"><a href="./design-accessible-services">Principes de conception pour des services accessibles</a></h2>
<p>Affiches imprimables <span id="das1">(format PDF)</span>&nbsp;:</p>
<ul>
<li><a href="{{ rootPath }}docs/posters/Cognitif-fr.pdf" id="das2" aria-labelledby="das2 das1">Principes de conception pour les utilisateurs avec handicap cognitif</a></li>
<li><a href="{{ rootPath }}docs/posters/SpectreAutistique-fr.pdf" id="das3" aria-labelledby="das3 das1">Concevoir pour les utilisateurs dans le spectre autistique</a></li>
<li><a href="{{ rootPath }}docs/posters/Sourds-fr.pdf" id="das4" aria-labelledby="das4 das1">Concevoir pour les utilisateurs sourds ou malentendants</a></li>
<li><a href="{{ rootPath }}docs/posters/Malvoyants-fr.pdf" id="das5" aria-labelledby="das5 das1">Concevoir pour les utilisateurs malvoyants</a></li>
<li><a href="{{ rootPath }}docs/posters/MoteurPhysique-fr.pdf" id="das6" aria-labelledby="das6 das1">Concevoir pour les utilisateurs avec un handicap physique ou moteur</a></li>
<li><a href="{{ rootPath }}docs/posters/RevuesDecran-fr.pdf" id="das7" aria-labelledby="das7 das1">Concevoir pour les utilisateurs de revues d’écran</a></li>
<li><a href="{{ rootPath }}docs/posters/SpectreAutistique-fr_2023.pdf" id="das2" aria-labelledby="das2 das1">Concevoir pour les utilisateurs dans le spectre autistique</a></li>
<li><a href="{{ rootPath }}docs/posters/Cognitif-fr_2023.pdf" id="das3" aria-labelledby="das3 das1">Principes de conception pour les utilisateurs avec handicap cognitif</a></li>
<li><a href="{{ rootPath }}docs/posters/Sourds-fr_2023.pdf" id="das4" aria-labelledby="das4 das1">Concevoir pour les utilisateurs sourds ou malentendants</a></li>
<li><a href="{{ rootPath }}docs/posters/Malvoyants-fr_2023.pdf" id="das5" aria-labelledby="das5 das1">Concevoir pour les utilisateurs malvoyants</a></li>
<li><a href="{{ rootPath }}docs/posters/MoteurPhysique-fr_2023.pdf" id="das6" aria-labelledby="das6 das1">Concevoir pour les utilisateurs avec un handicap physique ou moteur</a></li>
<li><a href="{{ rootPath }}docs/posters/RevuesDecran-fr_2023.pdf" id="das7" aria-labelledby="das7 das1">Concevoir pour les utilisateurs de revues d’écran</a></li>
</ul>
<p class="small">Crédits&nbsp;: Gouvernement du Royaume-Uni (<a href="https://ukhomeoffice.github.io/accessibility-posters/" rel="external">source<span lang="en" class="wb-inv"> : Designing accessible services</span></a>).</p>
</div>
Expand Down