WEBVTT

00:00:07.360 --> 00:00:14.280
Je m'appelle Jérémie Patonnier, je suis consultant Web pour Clever Age, depuis un mois,

00:00:14.280 --> 00:00:17.903
et c'est à cette époque que j'ai rasé ma barbe.

00:00:17.903 --> 00:00:25.840
Aujourd'hui, je vais vous parler de SVG... Peut-être... Voila...

00:00:25.840 --> 00:00:28.840
... pour les designers et les développeurs.

00:00:28.840 --> 00:00:31.742
Avant que je rentre bille en tête dans le vif du sujet

00:00:31.742 --> 00:00:33.440
je vais faire un petit sondage rapide

00:00:33.440 --> 00:00:38.920
Qui parmi vous a déjà entendu parler de SVG ?

00:00:38.920 --> 00:00:41.840
Plein de monde, c'est bien

00:00:41.840 --> 00:00:44.880
La question c'est : Qui l'a déjà utilisé ?

00:00:44.880 --> 00:00:47.680
Y'a déjà moins de monde

00:00:47.680 --> 00:00:52.920
Et qui, parmi ceux qui l'ont déjà utilisé, l'utilisent aujourd'hui en production sur un site ?

00:00:52.920 --> 00:00:56.400
Vous êtes vraiment pas nombreux

00:00:56.400 --> 00:00:58.080
D'accord c'est très bien

00:00:58.080 --> 00:01:05.760
Alors qu'on comprenne bien, SVG c'est un format d'image vectoriel

00:01:05.760 --> 00:01:08.440
donc plutôt un truc pour les designers

00:01:08.440 --> 00:01:13.000
qui est crée sur une base XML, sa syntaxe est XML

00:01:13.000 --> 00:01:15.880
donc là on parle plutôt pour les développeurs

00:01:15.880 --> 00:01:19.160
C'est un langage qui est aujourd'hui normalisé par le W3C

00:01:19.160 --> 00:01:21.680
c'est une technologie qui est relativement ancienne

00:01:21.680 --> 00:01:24.720
elle a à peu près une petit dizaine d'années

00:01:24.720 --> 00:01:33.680
et elle fait partie des outils que normalement devrait avoir tout webdeveloper dans sa boîte

00:01:33.680 --> 00:01:38.440
tout simplement, recemment il s'est passé quelques évènements

00:01:38.440 --> 00:01:43.280
et SVG commence à devenir vraiment intéressant dans le webdesign

00:01:43.280 --> 00:01:46.880
Alors historiquement quand j'arrive et que je dis

00:01:46.880 --> 00:01:49.960
C'est chouette on pourrait faire des trucs en SVG

00:01:49.960 --> 00:01:52.733
c'est sympathique, on va pouvoir faire ça, ça et ça ...

00:01:52.733 --> 00:01:57.800
en général on me dit vite : "oulà on sait pas trop, est-ce que ça marche ?"

00:01:57.800 --> 00:02:00.240
l'état d'implémentation tout ça, bizarre

00:02:00.240 --> 00:02:01.600
en général il y a une réticence

00:02:01.600 --> 00:02:03.920
c'est assez étrange

00:02:03.920 --> 00:02:05.400
donc je vais commencer par vous parler tout simplement

00:02:05.400 --> 00:02:09.360
du support navigateur de SVG

00:02:09.360 --> 00:02:10.914
Aujourd'hui c'est quelque chose de très simple

00:02:10.914 --> 00:02:14.840
SVG est supporté par tous les navigateurs modernes

00:02:14.840 --> 00:02:17.200
sans aucune exception

00:02:17.200 --> 00:02:22.880
Opera, Firefox, Chrome, Safari et IE9

00:02:22.880 --> 00:02:29.240
ça c'est le premier point important, Microsoft a enfin décidé d'implémenter SVG dans Internet Explorer

00:02:29.240 --> 00:02:33.360
donc désormais on sait que c'est une technologie qui au même titre que les autres

00:02:33.360 --> 00:02:36.560
va être disponible, de manière massive

00:02:36.560 --> 00:02:40.560
puisque évidemment aujourd'ui le seul qui n'implémente pas du tout SVG

00:02:40.560 --> 00:02:45.240
ce sont les anciennes versions de IE : IE 6, 7 et 8, il n'y a pas de SVG dedans

00:02:45.240 --> 00:02:47.160
Et donc evidemment quand on est dans une logique de

00:02:47.160 --> 00:02:50.480
mass média et je veux toucher du grand public

00:02:52.003 --> 00:02:57.360
60% de visiteurs sur mon site, la techno là ça va pas être possible

00:02:57.360 --> 00:02:58.960
bon ...

00:02:58.960 --> 00:03:04.134
et là c'est assez rigolo de voir quand on travaille dans une agence

00:03:04.134 --> 00:03:07.000
ou quand on est client, peu importe

00:03:07.000 --> 00:03:11.216
on voit arriver soit des développeurs, soit des responsables marketing

00:03:11.216 --> 00:03:14.560
des dirs com', un peu tout le monde qui ont entendu parler plus ou moins des technologies

00:03:14.560 --> 00:03:15.680
et qui viennent vous voir en disant :

00:03:15.680 --> 00:03:19.552
Wow c'est génial, j'ai vu des super démos en CSS3

00:03:19.552 --> 00:03:21.960
C'est cool, je veux qu'on mette ça sur mon site

00:03:21.960 --> 00:03:26.480
Pas de problèmes, on a des méthodes pour, on sait gérer la dégradation harmonieuse

00:03:26.480 --> 00:03:28.887
s'il faut sur des vieux navigateurs

00:03:28.887 --> 00:03:32.000
on sait utiliser des polyfills javascript

00:03:32.000 --> 00:03:36.400
qui vont rajouter une couche qui permet de soi d'émuler,

00:03:36.400 --> 00:03:38.040
soit de s'en sortir d'une manière ou d'une autre

00:03:38.040 --> 00:03:39.760
OK.

00:03:39.760 --> 00:03:42.120
La même chose avec SVG ça existe pas.

00:03:42.120 --> 00:03:49.200
Ça existe pas et c'est bizarre parce que pour SVG il y a aussi les mêmes fonctionnements

00:03:50.969 --> 00:03:54.880
On peut exactement faire la même chose et avoir le même argumentaire

00:03:54.880 --> 00:03:57.751
OK ? On peut aussi l'utiliser.

00:03:58.777 --> 00:04:01.120
Alors pour que vous comprenniez bien ce qui se passe là

00:04:01.120 --> 00:04:03.520
j'ai Stéphane Deschamps qui est plié de rire devant moi

00:04:03.520 --> 00:04:05.265
voilà (rires)

00:04:05.911 --> 00:04:07.295
merci Stéphane

00:04:07.838 --> 00:04:08.761
Voilà