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 :/.