Objectifs pédagogiques
- Créer des fichiers SVG, les optimiser et les modifier
- Animer des images SVG grâce à la SMIL, aux CSS et à JavaScript
- Rendre ces animations interactives
- Intégrer ces animations dans des pages HTML.
Niveau requis
Avoir une bonne connaissance de la création de page Web (HTML et CSS). Avoir des notions de base JavaScript. Maîtriser un logiciel de dessin vectoriel (Illustrator, Inkscape...) est un plus.
Public concerné
Webmasters, maquettistes, infographistes, responsables de communication, chefs de projets et directeurs artistiques.
Programme
Formats d'image
- Matriciel
- Vectoriel
- Insertion classique et data URI
Dessiner dans une page HTML
- SVG VS Canvas
- Déclaration VS programmation
- Intérêt du DOM SVG
- Les modes d'insertion dans la page HTML
Dessiner avec SVG
- Les outils : Illustrator, Inkscape...
- Optimiser les exports
- Déclaration XML
- ViewBox
- Les formes simples : lignes, rectangles, ellipses
- Les formes complexes : polygones et lignes polygonales
- Filtres SVG
Texte
- Texte en ligne
- L'élément
- Propriétés CSS
- Alignement
- Décalage et rotation
Animation SMIL
- Compatibilité des navigateurs
- Eléments animables
- Balises d'animation
- Attributs des balises
- Interactions
Utiliser JavaScript
- Scripts internes : balise
×
Grâce à ses technologies distancielles, M2i vous permet de suivre toutes ses formations depuis votre domicile comme si vous étiez en présentiel, avec la même qualité pédagogique.
Toutes nos formations sont maintenues.
Nos équipes sont à votre disposition par mail et par téléphone pour vous guider dans vos projets de montée en compétences. Faites votre choix parmi nos 1700 formations disponibles en Classe à distance.