Articles sur UX & Webdesign

Le problème n’est pas « Figma vs devs ». C’est l’absence d’un contrat versionné et vérifiable entre design tokens, composants et code.

Localiser le nom et les shortcuts d’une PWA, c’est super… tant que tu ne crées pas une app incohérente selon l’écran. Voilà comment le faire proprement, et quoi tester.

Le bug le plus frustrant : « chez moi ça marche ». Et chez le client, le layout ou les couleurs partent en vrille. Parfois, le coupable, c’est une extension qui injecte du CSS.

Tailwind v4 est une bonne version… mais pas une mise à jour “npm install et go”. Voilà ce qui casse vraiment en migration, et une méthode simple pour reprendre le contrôle.

Les container queries ne servent pas qu’au responsive. Avec le mode « name-only », tu peux t’en servir comme un namespace CSS natif pour calmer les collisions et les guerres de noms.

dvh/svh ont amélioré le viewport mobile, mais pas le moment où le clavier virtuel arrive. Résultat : CTA masqué, scroll piégé, modals inutilisables. Voilà comment le fixer proprement.

Quand taper un préfixe te remonte un token « au hasard » parce que son hex matche mieux que son nom, tu perds du temps et tu casses ton design system. On remet le workflow au propre.

popover=hint a un côté « tooltip natif » séduisant. Sauf qu’avec des overlays et des composants imbriqués, ses règles de fermeture deviennent vite imprévisibles.

Tu veux une UI propre sans passer ta semaine à tweaker des nuances. OK, mais si tu génères une palette sans comprendre OKLCH, ton dark mode va te punir.