Je ne sais pas pour vous, mais j’ai souvent eu un concepteur, regardant sur un site que je développe, dire quelque chose comme “Pouvez-vous déplacer ces cinq pixels vers la gauche?”. Le problème est que la plupart du temps, je n’utilise pas de pixels. Il est frustrant de constater que bien que les unités rem ou em soient généralement un meilleur choix pour le Web, les outils de conception ont tendance à favoriser les pixels. Cela signifie que les concepteurs et les développeurs parlent souvent des langues différentes en ce qui concerne les tailles.
Les outils de développement de navigateurs pourraient intervenir pour combler le vide ici, et à certains égards, ils le sont déjà. Actuellement, l’inspection d’une valeur de couleur dans Firefox ou Chrome vous permet de basculer entre les valeurs RVB, HSL et hexadécimales en maintenant la touche Maj enfoncée au clic. Ce serait formidable de voir une chose similaire pour les valeurs de taille aussi. Pouvoir basculer entre les pixels, les ems et les rems (ou même les pourcentages) dans le navigateur serait tellement utile !
Basculer la taille de la police
Nous pouvons en fait le faire dès maintenant avec les polices dans les outils de développement de Firefox, comme me l’a fait remarquer Razvan sur Twitter. Le panneau Polices a un tas de contrôles pour inspecter les polices (et est particulièrement utile pour les polices variables), et l’un de ceux-ci est de pouvoir changer d’unité pour la taille de la police. La sélection dans la liste déroulante recalcule automatiquement la valeur dans les unités correspondantes, qui incluent rems, ems, pixels, pourcentages et unités de port.
Personnellement, la taille de la police est probablement l’endroit où j’en ai le plus souvent besoin, donc c’est génial que nous l’ayons déjà. Chrome semble avoir son propre outil d’édition de polices en préparation, mais il ne semble pas encore disponible – à part cet aperçu alléchant d’Addy Osmani, je n’ai rien vu de plus à ce sujet.
Pourtant, cela semble assez intéressant, et c’est formidable de voir les outils de développement de navigateur s’améliorer de plus en plus pour répondre aux besoins des développeurs.
Mise à jour!
Le site Web Dev Tools Tips contient un petit article sur la façon d’activer l’inspecteur de polices dans Chrome. C’est une fonctionnalité expérimentale, vous devez donc l’activer dans les paramètres des outils de développement.