Aujourd'hui le Blog du Webdesign vous propose une liste d'inspiration et ressource pour commencer à utiliser le SVG
Connaissez-vous le SVG ? C'est un format d'image vectoriel que l'on peut utiliser dans le HTML. Il apporte au web tous les avantages du dessin vectoriel : Extrêmement léger, agrandissable à l'infini sans perdre de netteté, et enfin possibilité d'appliquer des filtres aux images. Cela produit parfois des résultats vraiment impressionnants quand cette technique est couple avec des animations CSS3.
Pour vous aider à commencer avec le Vectoriel dans vos documents HTML, voila une sélection de 10 créations vectorielles HTML.
Animation bluffante sur la gestion du focus
Effet shine au hover
Animation CSS3 mixée avec du SVG
Playground
En bonus, voila un petit lien expliquant la création des animations du site playground.
Un effet ambi-glow pour des images
Un loader illustrant les techniques de gradients
Icônes animés pour le climat en SVG et CSS3
Expérience sur les Keyframes
Un atlas en SVG
Une Pie CSS comme exemple d'animation
Quelques ressources pour démarrer :
Ut tuto par le W3School
RaphaelJS
RaphaelJS est sans doute la lib jQuery la plus avance à l'heure actuelle pour travailler avec du Vectoriel. Pour vous aider à démarrer, je vous ai aussi mis un petit tutoriel gratuit.
Recevez nos articles par e-mail
Comme + de 11.000 personnes recevez nos articles et ressources .directement par e-mail.
