Outils CSS3 – HTML5

Je m’intéresse en ce moment à ce qui touche à HTML5 et CSS3 qui représente l’avenir du web. Voici une liste d’outils trouvés au gré de mes recherches / lecture …

Font

CSS3 apporte le support des polices personnalisées via @font-face qui permet de télécharger et d’utiliser une police disponible sur internet.

  • http://www.typetester.org/ : Permet de comparer le rendu de différentes polices et de ses configurations.
  • http://www.google.com/webfonts –> « Dépôts » (repository) de font utilisable simplement. Plus besoin d’uploader sur votre serveur votre police. Actuellement plus de 200 fonts sont disponible.
  • http://somadesign.ca/projects/fontfriend/ : il s’agit d’un marque page sous la forme d’un code JavaScript qui une fois lancé sur la page que vous souhaitez affiche une fenêtre permettant la modification de tout ce qui touche au texte (taille de la police, police, …). Les Google web fonts sont supportés ainsi que vos polices via un drag n’ drop. Un Must !!

Générateur

Boite à outils

Générateur de dégradé CSS3/ Background

Voici quelques éditeurs qui vous permettront de tirer parti de la fonctionnalité de gradient des backgrounds en CSS3

Transformation

CSS3 permet d’effectuer des transformations (rotations, agrandissement / réduction, translation et déformation) ainsi que des animations. Voici une liste d’outils permettant de générer le code CSS de ceux avec des outils graphiques :

Compatibilité

  • modernizr : librairie JavaScript permettant d’ajouter à la balise html la liste des fonctionnalités supportées par le navigateur.
  • http://code.google.com/p/html5shim/ : script permettant de rendre compatible les nouvelles balise de HTML5 sous IE (version antérieure à IE9)
  • http://html5test.com/ : indique la compatibilité des nouveautés HTML5 avec votre navigateur

Divers

Cheat Sheet

Des petites antisèches pour :

Je mettrais à jour cette liste d’outils avec mes nouvelles trouvailles. N’hésitez à l’en faire découvrir 😉

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *