Tailwind CSS vs CSS classique : ce qu'on utilise et pourquoi
Tailwind divise la communauté des développeurs. On vous explique honnêtement pourquoi on l'a adopté, et dans quels cas le CSS classique reste pertinent.
Le débat qui n'en finit pas
Peu de sujets divisent autant les développeurs web que Tailwind CSS. D'un côté, ceux qui trouvent les classes utilitaires illisibles et anti-sémantiques. De l'autre, ceux qui ne peuvent plus s'en passer. Chez AsaLab, on est clairement dans le second camp — mais pas sans raisons.
Le CSS classique : forces et limites
Ce qu'il fait bien
- Lisibilité du HTML : classes sémantiques, balisage propre et compréhensible
- Séparation des préoccupations : style dans le CSS, contenu dans le HTML
- Facilité de thématisation : modifier le style global d'un composant en un endroit
Ses limites dans la pratique
- La cascade devient un enfer : guerre de sélecteurs, !important qui s'accumulent
- CSS mort accumulé : impossible à supprimer sans risque, fichiers qui grossissent
- Nommage constant : trouver un nom pertinent pour chaque classe prend du temps
Tailwind CSS : forces et limites
Ce qu'il apporte
- Vitesse de développement : style directement dans le JSX, itération immédiate
- Zéro CSS mort : seules les classes utilisées sont générées, CSS final minimal
- Cohérence par défaut : échelle de valeurs prédéfinie, moins de décisions arbitraires
- Parfait avec les composants : s'intègre naturellement dans React et Next.js
Ses limites
- Lisibilité du HTML : une div avec quinze classes utilitaires est difficile à lire
- Courbe d'apprentissage : syntaxe à mémoriser (ou IDE avec autocomplétion)
- Peu adapté sans framework : l'avantage est moindre sur un projet HTML statique
Pourquoi on utilise Tailwind
Tous nos projets sont en Next.js + React. Dans ce contexte, Tailwind est imbattable : on stylise directement dans le JSX, les composants sont autonomes, et le CSS final pèse quelques kilooctets. La cohérence de l'échelle de valeurs nous évite des dizaines de microdécisions par jour.
Combiné à des variables CSS pour les tokens (couleurs, brand, etc.) et à des conventions de nommage pour les classes GSAP, Tailwind nous permet de livrer des interfaces soignées rapidement, sans dette CSS.
Le CSS classique reste pertinent pour…
- Les projets sans framework ou avec des équipes non familières avec Tailwind
- Les styles globaux complexes : animations, keyframes, pseudo-éléments avancés
- Les équipes de designers qui exportent du CSS depuis Figma
Notre recommandation
Les deux ne sont pas incompatibles. On utilise Tailwind pour 90 % du style, et du CSS natif pour ce qui demande plus de finesse : animations, dégradés complexes, styles conditionnels avancés. L'objectif n'est pas d'être dogmatique, mais d'être efficace.