Derniers tutoriels de développement web
 

Web WAI


WAI définit des lignes directrices pour les développeurs web.


WAI - Web Accessibility Initiative

WAI (W3C, 1997) est un ensemble de lignes directrices destinées aux développeurs et aux concepteurs Web, sur la façon de rendre le Web accessible aux personnes handicapées.

L'objectif de ces directives est l'accessibilité, mais ils vont aussi aider à rendre le contenu Web disponible pour d'autres navigateurs (navigateurs vocaux, les téléphones cellulaires, les appareils portatifs) et à plus d'utilisateurs travaillant dans des environnements difficiles (mains-libres, une forte lumière, l'obscurité, mauvaise vue, le bruit lourd).

Remarque Si votre site manque de fonctionnalités WAI (bon contraste, texte redimensionnable, images avec des descriptions), les personnes handicapées ne seront pas en mesure d'accéder à vos informations.

Raisons pour rendre votre site plus accessible:

  • Il permettra d'améliorer votre réputation et votre satisfaction de la clientèle
  • Il permettra d'augmenter votre nombre de visiteurs
  • Il permettra à vos visiteurs de rester plus longtemps sur votre site
  • Il rendra votre site plus utilisable pour les personnes avec un équipement plus ancien

Rappelez-vous "alt"

L'attribut alt vous permet de fournir un texte alternatif pour une image:

<img src="images/banana.jpg" alt="Banana">

Parfois, un navigateur Web ne sera pas afficher vos images. La raison pourrait être l'un des nombreux:

  • L'utilisateur a désactivé l'affichage des images
  • Le navigateur est un mini navigateur, sans affichage de l'image
  • Le navigateur est un navigateur vocal

Si vous utilisez l'attribut "alt", la plupart des navigateurs sera au moins l'affichage (ou lire) le texte "alt".


Ne pas utiliser Petites polices

Certains sites Web utilisent une petite taille du texte juste pour "presser" plus de texte dans chaque page, ou pour rendre la page plus "élégant".

Encore une fois, les visiteurs avec des équipements différents, les conditions d'observation, ou d'un handicap pourraient avoir des difficultés à lire le texte.

Remarque Ne forcez pas vos visiteurs pour agrandir la taille du texte à chaque fois qu'ils visitent votre site.

Choisissez la meilleure lettre et Interligne

Texte espacement supplémentaire lettre est facile à lire.

Texte avec un espacement réduit de lettre est difficile à lire.

Texte bon
interligne
est facile à lire.

Texte réduite
interligne
est difficile à lire.


Évitez Fantaisie Polices

polices normales sont faciles à lire.

Lespolices italiques ne sont pas si faciles à lire.

Les polices Serif sont plus difficiles à lire.


Évitez Pauvre couleur Contrastes

Le texte noir sur un fond blanc ou texte blanc sur fond noir, est le mieux pour les personnes handicapées de visualisation, et pour l'affichage sur le mauvais équipement.

Le texte en gris sur un fond clair peut donner un contraste médiocre:

Couleur du texte #AAAAAA sur fond blanc
Couleur du texte # 666666 sur fond blanc
Couleur du texte # 333333 sur fond blanc
Couleur du texte # 000000 sur fond blanc

Le texte en gris sur un fond sombre peut aussi donner un contraste médiocre:

Couleur du texte # 666666 sur fond noir
Couleur du texte #AAAAAA sur fond noir
Couleur du texte #CCCCCC sur fond noir
Couleur du texte #FFFFFF sur fond noir

Certaines combinaisons - comme noir et rouge, noir et bleu, jaune et vert - souche toujours l'oeil:

Le texte noir sur un fond rouge
Le texte noir sur un fond bleu
Texte jaune sur fond vert

Et certaines combinaisons ne sont pas si mauvais:

Le texte noir sur un fond gris
Texte noir sur bleu clair
Texte noir sur blanc antique
Texte blanc sur bleu foncé

Contexte Toujours définir la couleur

La plupart des pages Web utilisent des couleurs pour les différents éléments de texte. Les deux têtes et des liens sont souvent dans une couleur différente du corps du texte.

En tant que concepteur de sites Web, vous devez être conscient du fait que vos visiteurs sont en mesure de modifier leurs préférences de couleur par défaut.

Si vous définissez des couleurs pour vos éléments web (comme en-tête et les liens), vous devez également définir la couleur d'arrière-plan.

Remarque Si vous ne définissez pas une couleur de fond, votre site Web pourrait finir avec une certaine très mauvaise combinaison de couleurs (comme les en-têtes de lumière rouge sur un fond rouge, ou pire encore, du texte noir sur un fond noir).