PXtoEM.com, convertissez les tailles de vos éléments et rendez votre site plus accessible

Comme je l’expliquais dans un précédent article, l’une des premières erreurs que l’ont fait lorsqu’on débute dans le webdesign est de vouloir maitriser toutes les dimensions de son site.

On apprend bien après et à ses dépends que c’est une énorme erreur dont on mettra du temps à sortir.

Pour éviter tout problème, il vaut mieux exprimer ses dimensions de manière relative grâce à l’unité em. En gros, em représente la taille par défaut de la police de caractère.

Pour presque tous les navigateurs modernes, cette taille est de 16px. Par défaut donc, 1.0 em = 16 px.
Mais vous pouvez changer cela. Si votre taille par défaut est 12px, alors il vous faut re-fixer la taille par défaut dans votre feuille de style CSS.

Il vous faut ensuite exprimer toutes vos tailles en fractions de em. Et s’il faut calculer tout à la main c’est pénible.

Heureusement il existe des webwares de conversion et même mieux. C’est le cas de PXtoEM.

 
PXtoEM fournit trois choses:

  • Un tableau complet qui exprime toutes les tailles courantes de 6px à 24 px en fractions de em pour une taille de base de 16px
  • Un tableau complet qui exprime toutes les tailles courantes de 6px à 24 px en fractions de em pour une taille de base de de votre choix
  • une calculatrice qui convertie de em à px et de px à em

 
De plus, PXtoEm fournit le squelette de base de la feuille de style CSS permettant de fixer toutes les tailles pour les éléments courants (header, table, p, …) et quelques classes utilitaires (small, large, ….). Une très bonne base.

 
Dernière chose, PXtoEM possède une page qui explique absolument tout ce qu’il faut savoir sur em, px et %.

 
Bref, un très bon webware doublé d’un site intéressant pleins de conseils et de littérature pour savoir de quoi on parle.

Utilisez PXtoEM