Salut,
Je partage cet article intéressant des dév front-end de Trello sur la mise en place de bonnes pratiques CSS chez Trello.
J’ai également cet article sur la convention BEM (Block Element Modifier) pour du CSS plus maintenable.
Dans votre startup ou pour vos projets, avez-vous des bonnes pratiques ? Êtes-vous adepte du BEM ?
j’ai dans ma todo le refactoring complet de mon css avec probablement BEM (sur mon projet en cours) et l’adoption pour toute la vie ^^
Deux ressources :
http://nicoespeon.com/fr/2013/05/plongee-au-coeur-de-oocss/
http://www.alsacreations.com/article/lire/1641-bonnes-pratiques-en-css-bem-et-oocss.html
Le problème du BEM c’est que je trouve ça illisible.
Du coups je ne suis pas la convention, même si sur le principe j’adhère.
En suite en terme de bonne pratique, il n’y a pas que la manière de l’écrire, il y a aussi la manière de l’optimiser.
Comme je suis plus développeur qu’intégrateur, j’utilise souvent Bootstrap et parfois le Google Web Starter Kit (pour être exacte, j’avais même publié juste avant google mon propre starter kit qui fait la même chose que celui de Google, mais qui utilise Boostrap au lieu de leur feuille de style à eux).
Il y a notamment la prise en charge du SCSS et le fabuleux uncss qui permet de ne conserver que le CSS réellement utile sur le site, très pratique quand on utilise un framework type Bootstrap ou Foundation pour virer tout le code qui finalement ne sert pas.
Une autre astuce pour le CSS, c’est d’utiliser autoprefixer au lieu de mettre les vendor prefix soit même.
Pourquoi ?
Parce que le support pour certaines propriété CSS évolue souvent, et qu’on finit souvent par en mettre plus que nécessaire. Autoprefixer utilise l’API de Can I Use ? pour ajouter, là où c’est nécessaire, les vendor prefix, pour les versions que vous lui spécifié. Magique 
Du coups, le Web starter toolkit ou mon propre toolkit, qui regroupe tous ses utilitaires là plus d’autre bien pratique permette d’ecrire du CSS qui a la fin est minifié, limité à ce que le site requiert, ni plus, ni moins.
Si tu utilises du SCSS, Compass peut résoudre différemment le soucis des vendor prefix, Compass propose, entre autre, un ensemble de fonctions (mixins) SCSS.
Je n’utilise plus Compass, pour plusieurs raisons:
Pour être plus complet, aujourd’hui avec le pipeline que j’utilise (orchestré par gulp), Compass ne m’apporte rien d’utile, donc ça ne me manque pas. Mais ça reste une très bonne bibliothèque quand on utilise un pipeline à base de ruby.
Je ne connaissait pas uncss - merci de la découverte.
Dommage que ça ne fonctionne que sur du HTML, je m’en serais bien servi sur mon thème WP…
En fait, uncss utilise PhantomJs pour faire le rendu des pages et calculer le style utiliser.
On doit donc pouvoir le faire marcher sur un thème WP sans trop de problème. Je regarderai ça plus tard, la, sur mon smartphone, c’est compliqué 
Cet article (en) explique comment faire en faisant référence a plusieurs autres articles, l’auteur à publier un gruntfile qui peut servir de base, avant ça il faudra installer grunt, un article lié dans celui que j’ai lié explique comment faire.
L’idée de base est d’utiliser une sitemap pour constituer un repertoire de lien que PhantomJS devra visiter et que uncss utilisera pour calculer les styles effectivement utilisé par rapport à ceux présent dans la feuille de style. L’intérêt d’utiliser PhantomJS par rapport à simplement parcourir le HTML est d’une part, d’être agnostique quand à la fabrication des pages HTML : via PHP ou à base de template javascript… Mais aussi, de permettre l’execution de javascript, et donc de garder certaines classe qui seraient ajouter par javascript au chargement de la page (feature detection etc…)
Réponse très complète et vraiment cool !
Mais ça demande plus de temps que ce que j’ai à consacrer à ce projet de nettoyage de CSS.
Mais ça ferait un plugin WP intéressant !