Tiens, comme Twitter discute des unités en CSS, je participe au troll… heu, à la discussion avec mes habitudes personnelles en la matière (ce n’est pas du tout une vérité absolue, ça dépend comme on dit).

Les pixels (px)

Ils sont toujours utiles, en tout cas pour discuter avec un graphiste, s’accorder sur une idée générale, pour se comprendre dans une guideline, etc.

Mais en CSS, je reconnais que je les utilise maintenant très peu. Hormis une taille fixée arbitrairement (ça peut arriver), pour les bordures, les ombres portées, faire un hr, des fois pour fixer quelques éléments de formulaires, éviter les arrondis foireux de Chrome sur des icônes dimensionnées en em, pour les coins arrondis… et encore !

Ils sont toujours totalement bannis de la typographie et de tout ce qui peut l’impacter chez moi, notamment sur le reset sur html ou body.

Les pourcentages (%)

Je les utilise toujours beaucoup pour des grilles et tout ce qui doit/peut être fluide. C’est toujours utile pour qu’un site pas prévu pour être redimensionné le soit in fine. Une valeur sûre quoi qu’on en dise !

Les em

Clairement, depuis 5 à 6 ans, c’est l’unité que j’utilise le plus. En fait, elle sert à tout ce qui doit/peut être proportionnel à la typographie. Et comme énormément de choses peuvent être fonction de la typo en matière de web (margin, padding, width ou max-width pour éviter des lignes trop longues, etc.), je les utilise énormément.

Utiliser cette unité me permet beaucoup de choses, le tout en permettant de respecter les préférences de l’utilisateur, et en permettant un zoom.

Sur les sites en responsive, les media-queries en em ont des avantages indéniables, par exemple, zoomer fortement sur le site de Prezenz vous fera afficher la « version » mobile en très gros caractères sur votre ordinateur (même en zoom texte), cela permet d’avoir à tout instant une version dont les contenus restent agréables à consulter quel que soit le niveau de zoom.

Certaines classes atomiques de Röcssti me permettent même d’avoir un niveau d’abstraction, je ne fonctionne par exemple plus en pixels pour ajouter une marge, mais en em, c’est tellement plus pratique, et cela permet de respecter par exemple le rythme vertical du texte sans même y penser.

Certes ils peuvent être compliqués à gérer dans certains cas précis (genre beaucoup d’intervenants ne se rencontrant dans aucun dimension sur des projets très compliqués, et encore), mais la quasi-totalité de mes cas ne tombe pas dedans, donc toujours pas d’excuse.

Les nombres bruts

Dans pas mal de cas, autant éviter les unités inutiles. Pour line-height, pas besoin d’unité, pour une valeur nulle (ex : border: 0;) non plus, autant utiliser une valeur auto dans d’autres cas, etc.

vh et vw

Je les utilise de temps en temps, je disais il y a deux ans que cela viendrait, et effectivement : un de mes derniers projets (dont je n’ai pas le droit de parler) les utilise énormément. Unités intéressantes, à utiliser de manière éclairée.

Autres

Hormis un cas d’utilisation bien précis dans Röcssti (pour fixer un interlignage disgracieux en cas d’utilisation des balises sub et sup), je ne me sers jamais des ex. Idem pour les en, dont j’ignore toujours le support réel. Pareil pour les ch, je ne m’en sers jamais.

Hormis quelques cas bien particuliers de besoin de mise en forme précise pour le media print, je ne me sers jamais des mm et autres cm, idem pour les pt (points), les in inches) et les pc (pica).

Les rem sont très intéressants, mais pour le moment, je ne m’en sers que très peu, cela me fatigue clairement de devoir gérer une solution de secours en em pour les très vieux navigateurs alors que je peux clairement tout faire en em les 99% de mes cas.

Et en fait, tout le monde a pris le pli d’utiliser les em au travail, donc le besoin des rem n’est pas critique.

Il existe d’autres unités, mais elles sont tellement anecdotiques pour mon utilisation pratique…