Content de voir que je ne suis pas le seul à trouver la syntaxe BEM affreuse
On a essayé de me mettre à ce BEM sur un projet et rien à faire, j'ai détesté. Je n'ai jamais raisonné avec cette séparation élément / modifieur : pour moi tout est propriété et se place au même niveau. Typiquement, le designer me fournit une charte graphique avec d'une part les couleurs, d'autre part les styles (bordure, ombres, texte etc..) et enfin les mockups. Je reprends ça très simplement en écrivant des classes réparties dans 3 fichiers colors.css, styles.css et layout.css. Puis j'ai juste à assembler les classes ensemble:
<a class="red-bg button-big centered">
Combiner les classes n'augmente pas la spécificité, c'est le développeur qui l'augmente en écrivant des sélecteurs inutilement complexes. Si l'on est ordonné et que l'on prend le temps de bien catégoriser les éléments pour leur faire correspondre les bonnes propriétés de base, la surcharge spécifique est plutôt rare. On peut aussi demander au designer de caractériser ses éléments avec ce vocabulaire et l'intégrer à la charte graphique, ça peut beaucoup aider si les deux parties suivent la même démarche.
Et puis, pourquoi faudrait-il s'interdire d'utiliser les noms de tags ? C'est un élément sémantique essentiel, bien plus que ne l'est un nom de classe. On en vient à réinventer la roue avec des .ordered-list > .list-item au lieu de ol > li
Partager