Entre les accolades

Lu chez Jeremy Keith, un très chouette résumé de CSS :

Dans un article intitulé « Side Effects in CSS » écrit il y a quelques temps, Philip Walton parle des différents challenges de l’écriture de CSS :

Il y a deux types de problèmes en CSS : les problèmes cosmétiques, et les problèmes architecturaux.

Les problèmes cosmétiques sont résolus en faisant ressembler quelque chose à ce que vous voulez. Les problèmes architecturaux sont plus plus délicats car ils ont plus des effets sur la maintenabilité sur le long terme, la modularité, l’encapsulation. […]

La plupart du temps, quand j’analyse des CSS et que j’essaye de déterminer si elle sont bien ou pas (et je sais que c’est très subjectif), je suis préoccupé par ce qu’il y a en dehors des accolades.

selector {
    property: value;
}

Le contenu à l’intérieur des accolades (les propriétés et leurs valeurs), c’est là où les problèmes cosmétiques sont résolus. C’est aussi le contenu que vous pouvez facilement rechercher. Je ne retiens certainement pas toutes les propriétés et valeurs possibles en CSS dans ma tête. C’est aussi facile à évaluer : est-ce que ça fait ressembler le truc à ce à quoi vous voulez que ça ressemble ? Oui ? Bien. Ça fonctionne.

Le contenu à l’extérieur des accolades (les sélecteurs), c’est plus difficile à juger. Il faut l’évaluer avec beaucoup de « et si ». Et si cela cible quelque chose que vous n’aviez pas l’intention de cibler ? Et si le balisage change ? Et si quelqu’un d’autre écrit des CSS qui annulent ça ?

  1. Nico, le

    Clairement, c’est là le gros travail sur CSS : l’architecture. Là en général où énormément de gens peuvent se planter (et moi avec).

    Il n’y a pas de gros mystère, la vieille maxime « be strict to be cool » est encore la plus efficace : être hyper-rigoureux sur le rangement, les conventions, etc. permet de faire qu’une simple modification se fasse sans dégâts ni ne prenne un temps délirant.