Accessibilité & NodeJs

Nous oublions souvent une chose: des personnes qui ont des déficiences visuels, cognitives et de mobilités veulent naviguer sur nos sites.

Du coup, ils auront sur leur poste des outils qui vont "lire" notre site Web afin de mieux les aider. En France, il existe une norme se nommant "RGAA" qui référencent les points d'attentions et également les démarches à réaliser sur la conception de notre site (respecter des gammes de couleurs, mettres des titres sur les liens ...): http://references.modernisation.gouv.fr/rgaa-3-0

Après, il n'est pas toujours évidemment de savoir si ce que nous avons fait respect parfaitement ces conventions.



Addy Osmani (encore lui) nous fournit un outils sur NodeJs qui va analyser notre site Web et nous donner des indications de modifications: a11y

Même si cet outils ne couvre pas tout, il a vous permettre de dégrossir notre travail. Pour l'installer, rien de plus simple:

> npm install -g a11y



Ensuite, nous aurons la commande "a11y" qui prend en paramètre un lien d'un site Web (ce dernier sera lancé dans PhantomJs pour ensuite être analysé). Et nous aurons à l'écran les retours.


Pour ce faire, j'ai suivi le tutorial, j'ai tapé la commande:

> a11y www.w3.org/WAI/demos/bad/before/home.html





Nous avons alors dans notre shell une liste plutôt importante de défauts d'accessibilités.



Une fois les corrections faites, nous lançons:

> a11y www.w3.org/WAI/demos/bad/after/home.html





Et là déjà, nous voyons que c'est bien mieux.


Un petit outils à ce garder sous le coude !

Commentaires

Enregistrer un commentaire

Posts les plus consultés de ce blog

ISO: liens & outils utiles

Image
Voici quelques normes ISO à connaître et que vous aurez à faire face dans vos développements. Et quelques liens / outils permettant de s'assurer que nous faisons correctement leurs intégrations Code Pays https://countrycode.org/ est super site qui permet de lister les pays du monde avec leur country code (en mode number et iso): Et par pays, nous pouvons avoir des informations supplémentaires, comme le format téléphone, la position géographique, la time zone, la monnaie, etc: Ce site du coup regroupe les country code: En ISO 3166 name (où un nom est attribué à un pays) En ISO 3166 numeric (où un chiffre numérique est attribué à un pays) En ISO 3166-1 alpha-2 (code en 2 alpha majuscule) En ISO 3166-1 alpha-3 (code en 3 alpha majuscule) Ainsi que les langues. Tout cela est d'ailleurs regroupés dans ce fichier téléchargeable . Code langue / locale Là, nous tombons dans un des plus grands soucis d'un développeur: co...
Lire la suite

NodeJs et SSL: une petite analyse

Le but de cet article est de faire un petit tour d'horizon de l'usage de SSL dans nos applications NodeJs, en l'occurence, quand nous souhaitons faire une application Web, une API REST, ou les deux. Nous allons avoir 6 étapes pour de réalisation d'un serveur NodeJs, avec à chaque fois 12 clients: Un client NodeJs sans certificats SSL - strictSSL à false Un client NodeJs sans certificats SSL - strictSSL à true Un client NodeJs avec un certificat SSL client non fiable - strictSSL à false Un client NodeJs avec un certificat SSL client non fiable - strictSSL à true Un client NodeJs avec un certificat SSL server non fiable - strictSSL à false Un client NodeJs avec un certificat SSL server non fiable - strictSSL à true Un client NodeJs avec un certificat SSL client fiable - strictSSL à false Un client NodeJs avec un certificat SSL client fiable - strictSSL à true Un client NodeJs avec un certificat SSL serveur fiable - strictSSL à false...
Lire la suite

Créer sa commande slack en quelques minutes

Image
Le but de cet article est de vous montrer que très simplement, nous pouvons créer une commande personnalisée pour Slack. Ici, nous allons afficher des chats :)" Tout d'abord, nous allons nous créer des comptes sur: Slack:  https://slack.com Heroku:  http://www.heroku.com/ qui permettra d'héberger notre service REST pour Slack Gitlab: https://gitlab.com  qui permet évidemment d'héberger notre code, mais qui pourra de manière automatiser déployer notre application sur Heroku à chaque commit (et cela, même en mode "gratuit") Concentrons-nous tout d'abord sur Heroku et Gitlab. Créons un compte Heroku. Une fois cela fait, aller dans votre compte :. Vous verrez alors une section nommée "API key": Cliquez sur "Reveal" pour voir la valeur et conservez la bien en mémoire. Ensuite, sur en retournant sur votre dashboard d'applications Heroku , cliquez sur "New" et créez une nouvelle application. Dans...
Lire la suite