Débat développement Web : SVG (Scalable Vector Graphics) peut-il remplacer Flash ?

Les rubriques (actu, forums, tutos) de Développez

Réseaux sociaux

Le 09/05/2009, par Orvinfait, Membre à l'essai

Citation:

Scalable Vector Graphics qui, traduit de l'anglais, signifie « graphique vectoriel adaptable »[1] et est couramment abrégé par le sigle SVG, est un format de données conçu pour décrire des ensembles de graphiques vectoriels et basé sur XML. Ce format est spécifié par le World Wide Web Consortium.

Le SVG est très utilisé dans le monde de la cartographie et du téléphone portable.

Détails

Les coordonnées, dimensions et structures des objets vectoriels sont indiquées sous forme numérique dans le document XML. Un système spécifique de style (CSS ou XSL) permet d’indiquer les couleurs et les polices de caractères à utiliser.
Manipulation d’image SVG avec Inkscape.

Ce format gère quelques formes géométriques de base (rectangles, ellipses, etc.), mais aussi des chemins (paths), qui utilisent les courbes de Bézier et permettent ainsi d’obtenir presque n’importe quelle forme. Le remplissage peut se faire à l’aide de dégradés (gradients) de couleurs de motifs (pattern) qui sont des objets SVG quelconques, ou de filtres (appelés shaders en imagerie 3D). On peut également appliquer des motifs le long des chemins (markers) et utiliser les fonctions de remplissage. Le canal alpha, pour la transparence, est géré à tous les niveaux.

Comme dans tout document XML, les objets sont organisés sous forme d’arbre. Le format permet l’intégration d’animations, ou la manipulation des objets graphiques par programmation, notamment grâce à des scripts qui peuvent être intégrés dans le SVG.

Un des intérêts majeurs de SVG est qu’il peut être inclus dans d’autres documents XML, comme par exemple des documents XHTML ou des documents XML devant être traités par XSL-FO. Respectant la norme XML, une image SVG peut également être manipulée par l’intermédiaire du modèle Document Object Model (DOM).

SVG peut être visualisé nativement avec des navigateurs web modernes ou à l’aide d’un plug-in pour d’autres (voir : les navigateurs SVG).

Certains environnements graphiques l’utilisent pour la gestion et l’affichage d’icônes, et d’interface, comme X.org, GNOME, KDE ou certains téléphones portables.

Des logiciels graphiques permettent de modifier facilement chaque forme, par exemple en déplaçant des points, ou en changeant la couleur des traits, … Il en est de même pour le texte qui peut être modifié sans toucher aux formes, ce qui facilite grandement la modification de schémas.

Pour moi SVG est dès aujourd'hui utilisable puisque j'ai créé un jeu de cartes en réseau avec Ajax et SVG. Pour voir ce que cela donne : http://www.orvinfait.fr/svg/jeux/ten...ur_gagner.html

Le logiciel fonctionne avec Firefox 3, Opera et Internet Explorer avec le plugin d'Adobe. Je ne l'ai pas testé avec Safari mais il devrait fonctionner.

L'annonce qui devrait faire bouger les choses n'est peut-être pas mon jeu mais celle-ci :
Dreampark lance la nouvelle génération de logiciels médiateurs télévisuels SVG lors de l'IBC 2008
http://www.mobifrance.com/articles/p...?f=2021788.xml

L'article commence ainsi :
"Les graphiques vectoriels adaptables apportent des possibilités d'interface graphique sans précédent en qualité haute définition, sans compromis sur la vitesse ou la performance".

Cet article parait sur de nombreux sites exemple :
http://fr.biz.yahoo.com/29082008/175...suels-svg.html

Plus d'une personne va se dire: mais c'est donc possible en SVG ! Cela devrait changer l'image de ce langage.

Par SVG j'entends pas seulement la norme SVG mais SVG fonctionnant avec d'autres langages.

Avec SVG il est possible de créer ses propres polices de caractères. (mais cela n'est pas encore géré par Firefox mais par Opera et peut-être Safari)

SVG a été intégré dans le test acid3.

SVG est indexable

SVG est comme le HTML une technologie du W3C alors que Flash est aujourd'hui la propriété exclusive d'Adobe.

SVG 1.2 a des balises audio et video non encore disponibles dans les navigateurs actuels. Audio existe avec le plugin d'Adobe mais ce plugin est en cours d'abandon. Par contre il est possible d'ajouter la balise video de html5 dans un document SVG comme le montre l'exemple suivant : http://pecita.fr/ (en utilisant Firefox 3.1)

L'auteur de cet exemple en parle ici
http://www.svgfr.org/forum/?action=v...3&topic=910#17
Le site http://pecita.fr/ est en SVG.
Firefox 2 gérait SVG très lentement ce qui me faisait conseiller Opera. Ce n'est plus le cas avec Firefox 3