Aller au contenu

SVG à la main, même toi tu peux le faire

Par Jérémie Patonnier

Atelier double (3 h) :
Langue :
Français
  • Diaporama
  • Le sujet

    Quand on veux utiliser SVG sur le web, on a vite fait de mal utiliser un logiciel de dessin vectoriel et puis c'est tout ! Mais en vrai, coder du SVG à la main ouvre des horizons insoupçonnés qui permettent de créer des effets graphiques surprenants.

    Cet atelier va se découper en trois étapes d'environ une heure chacune :

    1. SVG lui même, les spécificités du format, les balises et les petits trucs et outils qui vous facilitent la tache pour coder ça sans (trop de) peine.
    2. Ajouter du CSS. Comme beaucoup des innovation de CSS des dernières années viennent de SVG, on verra comment ça marche ensemble en allant jusqu'à certain points encore un peu exploratoires de la norme SVG2.
    3. Enfin on rajoutera une touche de JS pour se simplifier encore plus la tache que ce soit pour manipuler SVG ou s'équiper d'outils.

    On en profitera pour aborder des problématiques de mise en œuvre concrètes (sprites SVG, filtres d'effets, performances, accessibilité) au travers d'exemples de code qu'on fera tous ensemble.

    Présenté par