Voici une bonne pratique que je regrette de voir souvent oubliée… y compris par moi-même parfois.
Si dans vos intégrations CSS, vous avez un bloc qui comporte une image de fond, comme par exemple sur ce site #bandeau
via :
background: url(top.jpg) 0 0 no-repeat;
Et si ce bloc contient du texte, ayez ceci à l'esprit : si l'image ne se charge pas pour n'importe quelle raison, le texte qui va être dans ce bloc sera sur la couleur de fond héritée. Si vous n'avez pas indiqué de couleur de fond, il est possible que la couleur héritée pose un problème d'accessibilité.
Voici l'exemple sur mon site, simulé avec Firebug :
Comme vous pouvez le voir, le contraste n'est vraiment pas fameux.C'est d'autant plus énervant que c'est très simple à régler, il suffit de spécifier la bonne couleur de fond dans la règle CSS qui appelle l'image de fond de votre bloc. Dans mon cas :
background:#EEEBDA url(top.jpg) 0 0 no-repeat;
(j'ai juste rajouté une couleur de fond)
Si je reprends l'exemple sur mon site, simulé avec Firebug :
Comme vous pouvez le voir, c'est bien meilleur ainsi.Pensez-y : c'est très simple à prévoir, et cela peut éviter de fâcheux désagréments.