De bonnes habitudes à prendre (2/2)

Pour l'accessibilité

Le CSS, oui mais …

Le CSS permet de faire des choses très réussies, comme le prouvent ces deux sites en anglais : le site d'Eric Meyer et Cutting Edge CSS de Stu Nicholls. Mais n'oubliez jamais : ce que font ces sites ne sont possibles qu'en séparant le contenu en HTML de la présentation en CSS.

Pensez toujours que certains utilisent encore des navigateurs textuels (navigateurs non-graphiques), et plus que vous ne le croyez. C'est pour eux qu'il est nécessaire d'utiliser correctement le HTML. Une liste est une liste, un tableau est un tableau de données. Ne misez donc pas tout sur votre CSS : votre page doit rester compréhensible (par ex. l'ordre des éléments) même si le navigateur de votre visiteur ne supporte pas le CSS.

 

Les attributs alt et title : ob-li-ga-toires !

Les attributs alt et title doivent figurer à chaque fois que vous mettez un lien ou une image sur votre page. Pas d'exception ! Pour les liens, utilisez l'attribut title. Dans la spécification du HTML par le W3C, l'attribut title fournit des informations consultatives concernant l'élément sur lequel il se place. Le plus souvent, le navigateur va l'afficher sous la forme d'une infobulle. Mais ne comptez pas seulement là-dessus, car les navigateurs ont carte blanche pour l'utiliser comme ils le veulent. Si l'on suit la recommandation du W3C, l'attribut title n'est pas requis pour vos liens ; mais pour des questions d'accessibilité, n'oubliez jamais de l'inclure : dictatorialement, je vous l'impose !

L'attribut alt, est au contraire obligatoire. Il sert à afficher un texte alternatif au cas où le visiteur a désactivé l'affichage des images ou s'il utilise un navigateur textuel. Choisissez donc un texte descriptif qui permette au visiteur de comprendre ce qu'est l'image s'il ne la voit pas. Ce n'est pas une légende et la plupart des navigateurs ne l'afficheront pas si l'image elle-même apparaît. Si vous voulez donner une explication sur votre image, utilisez l'attribut title en plus de l'attribut alt.

 

Je ne vous entends pas, j'ai cassé mes lunettes …

Pour les personnes malvoyantes, il est recommandé que votre site utilise de forts contrastes entre la police et le fond de la page. Cela la rend plus lisible. Ainsi, oubliez ces gentilles polices vertes sur fond rouge dont vous avez l'habitude. Ne faîtes pas non plus comme sur cette page mais plutôt … comme mes pages, héhé. Le mieux, pour tout ce qui est texte, c'est du noir et blanc. Préfèrez d'ailleurs une police noire sur fond blanc plutôt que l'inverse car c'est moins fatigant pour l'œil, des tests scientifiques le prouvent !

 

Tous les navigateurs sont égaux, mais certains plus que d'autres.

Allez, une petite devinette : quel navigateur est encore utilisé par les trois-quarts des internautes malgré son poids, sa lenteur, ses bugs, son manque de confidentialité, ses failles de sécurité et son fonctionnement parfois obscur ? Pas très difficile à trouver, n'est-ce pas ? Oui Internet Explorer a réussi cette prouesse d'être le seul navigateur que beaucoup d'internautes connaissent. Certains n'imaginent même pas que d'autres solutions existent, et croient "lancer Internet" en double-cliquant sur Internet Explorer.

Si vous créez des pages Web, Internet Explorer est un énorme problème pour vous : il interprète (dans sa sixième version !) encore mal le CSS. Oui vous avez bien entendu. Vous avez du mal à comprendre comment un navigateur si vieux ne sait toujours pas calculer la largeur d'un élément en CSS ? Moi aussi, je l'avoue. Mais hélas, comme 75% des internautes se contentent du navigateur installé sur leur PC, et il s'agit souvent d'IE, vous ne pouvez pas l'ignorer.

Je vous conseille donc de vérifier l'apparence de vos pages dans un navigateur absolument génial et qui gère parfaitement le CSS. Il s'agit de Firefox.

Icône de téléchargment pour Firefox

Une fois que vous serez habitué à Firefox et ses extensions génialissimes, vous ne pourrez plus vous en passer et vous vous étonnerez d'avoir utiliser aussi longtemps IE comme votre navigateur principal. Cela dit, comme vous serez un webmaster consciencieux, vous penserez à toujours vérifier vos pages dans IE, par égard aux 75% d'internautes qui n'ont pas eu la chance d'être réveillés. Vérifiez également votre site avec différentes résolutions ou en diminuant la fenêtre de votre navigateur, histoire d'être sûr que tout se positionne correctement.

 

Back to the future

Pensez à intégrer sur vos pages une date de mise à jour, que vous changerez dès que vous apporterez des modifications à votre page. Ceci permet au visiteur de savoir s'il se trouve sur un site « fantôme » ou un site régulièrement mis à jour. Pour certains types de contenus, le visiteur ne sera pas gêné de savoir que la page date d'il y a longtemps. Ne craignez donc pas de mettre une date. Le visiteur peut ainsi savoir si la page a changé depuis sa dernière visite.

 

Maintenant que vous avez reçu tous ces conseils, à vous de vous mettre au boulot ! Et n'hésitez pas à me contacter quand vous aurez créé votre page.

Dernière mise à jour le 01-01-1970.

Page conforme aux specifications XHTML 1.1 Contrat Creative Commons
L'intégralité du site, y compris les photos, fait l'objet d'un contrat Creative Commons.
A note to those who do not read French