Mes impressions sur le web, les standards et autres…


Feuilles de style utilisateur

Les feuilles de style, c’est vraiment un outil formidable, non seulement par la facilité qu’elles apportent à gérer la présentation de ses pages, mais aussi en terme d’accessibilité. Une utilisation très peu connue et utilisée, quoiqu’un peu plus par les adeptes de Mozilla/Firebird mais de façon superficielle (via les bidouilles anti-pub), est la possibilité pour le visiteur de définir des règles CSS à appliquer aux sites qu’il visite.

Pour les utilisateurs de Mozilla ou Firebird, c’est très simple, il suffit de modifier le fichier userContent.css présent dans le dossier chrome/ de votre profil (renommer d’abord le fichier userContent-example.css en userContent.css si besoin est). Pour les utilisateurs de IE6, vous pouvez spécifier une feuille de style utilisateur via outils -> options internet... -> accessibilité. Je ne sais ce qu’il en est pour les autres navigateurs. Les règles de style que vous indiquerez dans cette feuille utilisateur s’appliqueront si l’auteur du document (la page que vous visitez) n’a pas déja précisé cette règle dans la feuille de style du site (s’il y en a une). Pour outrepasser cette ordre de priorité, faites suivre chaque règle de style que vous voulez appliquer par !important (avant le point virgule, et il y a un espace avant le point d’exclamation). Bien entendu, cela suppose que vous ayez un minimum de connaissances en CSS, mais on peut espérer une généralisation de l’utilisation des feuilles de style utilisateur, et l’apparition à l’avenir de sites listant plusieurs règles de style basiques et généralistes à appliquer dans ces feuilles utilisateur.

Si vous avez bien suivi jusque là, vous vous êtes sùrement posé la même question que moi. Que se passera t-il si je définis cette règle dans ma feuille de style utilisateur :

body {
    background-color: black !important;
}

La règle s’appliquera en effet, et d’autant plus qu’elle aura un ordre prioritaire (avec !important) sur la même règle éventuellement définie dans la feuille de style de l’auteur, mais elle s’appliquera à tous les sites que vous visiterez. En effet, il n’existe pas de mécanisme natif pour lier des règles de style à un site en particulier. Une pratique commence à se répandre parmi les adeptes des standards et de l’accessibilité qui consiste à utiliser l’attribut id du HTML pour fournir à leur site un identifiant unique, ce qui a pour effet immédiat de donner un caractère d’unicité du site vis à vis de la feuille de style utilisateur. Ainsi, j’ai placé un attribut id dans la balise html (on peut aussi bien le placer sur la balise body) avec pour valeur site_webnaute — Attention cependant, l’attribut id sur l’élément html n’existe pas dans la recommandation sur le HTML 4.01 ni dans aucune des DTD du XHTML 1.0 mais bizzarement, ma page est tout de même valide aux yeux du validateur du W3C aussi bien que de celui du WDG (Anne Vankesteren propose d’ailleurs l’ajout pur et simple de cet attribut id si besoin est comme elle il l’explique ici) Mise à jour : En fait, l’attribut id n’est pas défini dans la première version de la recommandation sur le XHTML 1.0 mais il l’est dans la deuxième édition de cette recommandation — Notre essai précédent sur la couleur d’arrière plan deviendrait donc :

html#site_webnaute body {
    background-color: black !important;
}

Admettons tout de même que cette solution est loin d’être pratique, en plus du fait que l’ajout d’un attribut id unique sur les éléments html ou body reste très marginal voire inexistant parmi les concepteurs de site. Anne Vankesteren, toujours elle il, propose l’ajout d’un nouveau mécanisme dans une future version des feuilles de style CSS. Ainsi :

@address "annevankesteren.nl"{
    /* user specific styling */
}

J’avoue que l’idée m’a paru séduisante au départ, mais après mùre réflexion, je ne pense pas que ce soit une bonne idée. Un tel mécanisme ne devrait rien avoir à faire dans une feuille de style CSS. Leur rôle se limite à la présentation de document, sans avoir à dicerner tel ou tel document. Et cela vaut encore plus pour faire la distinction selon le nom de domaine car la feuille ne s’appliquerait alors pas si le document est visualisé en local. Non, à mon avis, point de salut si ce n’est dans les concepteurs de navigateurs web :/.