Le document présente l'évolution d'HTML vers XML en raison des limitations d'HTML pour le partage et la présentation des données. XML, ou langage extensible de balisage, permet de créer des balises personnalisées pour décrire le contenu des documents sans se préoccuper de leur présentation. Il introduit également des structures rigides via des DTD pour garantir la conformité des documents XML aux normes définies.

1. Introduction à XML Saïd Radhouani Université de Genève décembre 2004

2. HTML face aux nouveaux besoins HTML est devenu le langage universel de formatage et de présentation des informations sur le web HTML a été créé pour un objectif précis : échange de données indépendamment des plate-formes et de l'affichage devait décrire les différentes parties d'un document simple à l'aide des balises (H n , P, ...), les navigateurs devaient se charger de l'affichage final du document. Des éléments d'affichage ont été rajoutés pour personnaliser les pages web (B, I, FONT, CENTER, TABLE dans la version 3.2, FRAME dans la version 4.0) 18 décembre 2004 Saïd Radhouani - CUI

3. Limites du langage HTML Nouveaux besoins : partager des documents entre les membres d’une communauté publier les mêmes données sous multiples présentations (en tableau, en texte, graphique …) ? publier les mêmes données sur de multiples supports (écran, papier, terminal Braille, cellulaire, etc.) effectuer des traitements sur les données avant de les présenter : tris, enrichissement, sélections, réorganisations, génération automatique de libellés, tables des matières, index, etc. effectuer des recherche d'information (exemple, chercher sur Internet un hôtel libre à paris sans avoir une connexion chez sois) HTML n'avait pas été conçu pour ce genre de tâches 18 décembre 2004 Saïd Radhouani - CUI

4. Limites du langage HTML L'ajout de nouveaux éléments est impossible, on ne peut pas créer des balises pour définir pour le document une structure de type résumé, chapitre, index, bibliographie R estrictif : il o ffre seulement un nombre limité de balises pour la structuration de documents (en-têtes, corps, ce dernier contenant des paragraphes, listes, tableaux, illustrations, ...) Impossibilité de séparer le contenu et la présentation N 'est pas extensible : il ne peut pas répondre aux besoins spécifiques de tous les domaines (mathématiques, chimie, musique, astronomie...) et ne définit plus le contenu du document 18 décembre 2004 Saïd Radhouani - CUI

5. Limitations de HTML E st prévu pour être visualisé sur un écran d’ordinateur (difficile pour les ordinateurs de poche , les téléphones portables , etc. ) M anque de structure  difficile à traiter automatiquement pour extraire des informations etc. La solution : proposer un nouveau langage qui peut dépasser les limites du langage HTML 18 décembre 2004 Saïd Radhouani - CUI

6. XML - Généralité XML eXtensible Markup Language (langage extensible de balisage) méta-langage = un langage qui permet de définir d'autres langages permet de concevoir votre langage de balisage personnalisé pour un ensemble de classes de documents (vous pouvez inventer des balises pour répondre à un besoin spécifique : un langage pour votre bibliothèque par exemple) un langage défini par XML est appelé vocabulaire XML ou application XML 18 décembre 2004 Saïd Radhouani - CUI

7. XML - Généralité il est destiné à décrire le contenu du document, pas son affichage (les feuilles de style CSS et XSL gèrent l'affichage) il est flexible : on peut définir ses balises, et les utiliser dans un ou plusieurs documents (DTD externe) le document ne sera affiché que s'il est bien formé et valide (s'il suit une DTD) il est lisible pour l'humain (l'information contenue sera toujours accessible, contrairement aux fichiers de certains logiciels, par exemple, il est impossible de visualiser du RTF sans un logiciel qui connaisse ce format) le document XML est un texte qui n'est pas destiné à être lu par l'humain (mais le fait que ce soit un texte permet aux experts d'utiliser un éditeur de texte pour corriger le fichier). 18 décembre 2004 Saïd Radhouani - CUI

8. HTML - XML Un nouveau langage avec de nouvelles balises Les balises XML décrivent le contenu plutôt que la présentation 18 décembre 2004 Saïd Radhouani - CUI HTML <p>Saïd</p> <p>Radhouani</p> <p>Assistant/doctorant</p> <p>Radhouani@cui.unige.ch</p> XML <prenom>Saïd</prenom> <nom>Radhouani</nom> <Fonction> Assistant/doctorant </Fonction> <email>Radhouani@cui.unige.ch </email>

9. Structure d'un document XML un document XML contient : un prologue (une déclaration XML) : qui contient toutes les informations autres que les données ou les éléments u ne déclaration de DTD (à l'aide d'un fichier annexe appelé DTD = Document Type Definition) informations facultatives sur des instructions de traitement à destination d'applications particulières. Leur syntaxe est la suivante: <?instruction de traitement?> arbre d'éléments éventuellement des commentaires 18 décembre 2004 Saïd Radhouani - CUI

10. Structure d'un document XML Un document XML est composé d'éléments ( blocs qui représentent la structure logique du document ) Le document contient à la fois des données et des méta- données ( données sur l es données ) les éléments peuvent être : non vides : ils commencent par une balise ouvrante, peuvent contenir du texte et d'autres éléments et se terminent par une balise fermante. < nom > Toto </ nom > vides : ils ne contiennent rien, aucun texte, aucun élément. L'élément IMG de HTML est un élément vide. En XML ils s'écrivent avec un / à la fin de la balise ouvrante ou sous la forme d'une paire de balises vide : < exemple /> ou encore < exemple ></ exemple > 18 décembre 2004 Saïd Radhouani - CUI

11. Le prologue – la déclaration XML Le prologue contient toutes les informations autres que les données ou les éléments Syntaxe : <?xml version=&quot;1.0&quot; [encoding = &quot;encodage&quot;] [standalone = &quot;yes|no&quot;] ?> Exemple : <?xml version=&quot;1.0&quot; encoding=&quot;ISO-8859-1&quot;?> 18 décembre 2004 Saïd Radhouani - CUI

12. I nstructions de traitement Les instruction de traitement ou PI ( processing instruction ) permettent aux développeurs de placer des informations spécifiques pour une application à l'intérieur du document. Ces informations seront transmises à l'application. Elles ont la forme suivante : <?Application instruction+?> On peut les utiliser dans n'importe quelle partie du document ( elles sont en général utilisées dans le prologue ) . Pour que ie 5 puisse visualiser un document XML avec une feuille de style CSS on utilisera l'instruction de traitement : <?xml-stylesheet type=&quot;text/css&quot;?> 18 décembre 2004 Saïd Radhouani - CUI

13. Les commentaires Syntaxe : <!–- Commentaire --> Ils sont autorisés dans le document (après le prologue) Ils peuvent inclure n'importe quel type de données Ils ne peuvent pas apparaître à l'intérieur des balises 18 décembre 2004 Saïd Radhouani - CUI

14. Arbre d'éléments Un document XML a une structure d'arbre : Il y a une racine, des branches et des feuilles. l'arbre des éléments contient : un élément racine des éléments internes Un élément est composé de trois parties : Une balise ouvrante, avec éventuellement des attributs Un contenu (des données ou d'autres éléments) Une balise fermante Un élément peut être vide : ne contient ni texte, ni autres éléments Peut contenir des attributs 18 décembre 2004 Saïd Radhouani - CUI

15. Les attributs Chaque élément présente des caractéristiques appelées attributs Ils donnent des informations supplémentaires sur les éléments Ils peuvent être facultatifs ou obligatoires Ils apparaissent seulement dans la balise ouvrante d'un élément Syntaxe : propriete = &quot;valeur&quot; ou propriete = 'valeur' Exemple : < personne typ e= &quot; étudiant &quot;> ... </ personne > 18 décembre 2004 Saïd Radhouani - CUI

16. Exemple de document XML <?xml version=&quot;1.0&quot; encoding=&quot;ISO-8859-1&quot;?> <annuaire> <personne type=&quot;étudiant&quot;> <nom>HEUTE</nom> <prenom>Thomas</prenom> <email>webmaster@xmlfacile.com</email> </personne> <personne type=&quot;chanteur&quot;> <nom>CANTAT</nom> <prenom>Bertrand</prenom> </personne> </annuaire> 18 décembre 2004 Saïd Radhouani - CUI

17. Vue hierarchique d'un document XML 18 décembre 2004 Saïd Radhouani - CUI annuaire Personne chanteur nom Personne étudiant prenom email nom prenom

18. Document bien formé Un document XML est bien formé (l'analyseur XML peut construire son arborescence) si : il contient une déclaration XML il contient un ou plusieurs éléments il contient un élément racine encapsulant tous les autres éléments et leurs attributs (ex <annuaire> ... < / annuaire>) les éléments non vides ont une balise de début et de fin les éléments non vides sont correctement imbriqués ( < personne > < nom > ... </ nom > </ personne > ) 18 décembre 2004 Saïd Radhouani - CUI

19. Document bien formé les éléments vides ont un &quot; / &quot; à la fin de la balise avant le &quot; > &quot; ; les noms des balises ouvrantes et fermantes correspondent un nom d'attribut apparaît uniquement dans la balise ouvrante et une seule fois dans cette balise les valeurs des attributs sont entre guillemets ou apostrophes la valeur des attributs n'appelle pas d'entités externes les caractères réservés sont remplacés par des références d'entités (par ex. &lt; pour < ) 18 décembre 2004 Saïd Radhouani - CUI

20. Définition de types de documents (DTD) Comment imposer une structure rigide pour l’édition d’un document XML ? Comment standardiser les documents d’un domaine Comment vérifier qu’un document XML respecte la charte d’une communauté au niveau de sa structure et son contenu ? Validité de document Besoin d’un langage qui permet de définir des jeux de balises  DTD : langage de Définition de Type de Document (Document Type Definition) 18 décembre 2004 Saïd Radhouani - CUI

21. Définition de types de documents (DTD) DTD (Document Type Definition) Un moyen pour vérifier la syntaxe d'un document  vérifier la validité du document produit C'est un fichier qui contient un ensemble de règles définissant la structure d’une classe de documents XML D éfinition d’un langage selon le standard XML (quelles sont les balises, comment peuvent-elles êtres imbriquées, etc.) Définitions des éléments et d es règles d'utilisation (noms des éléments, attributs possibles pour un élément, imbrications) 18 décembre 2004 Saïd Radhouani - CUI

22. Définition de types de documents (DTD) La DTD type le document en : En circonscrivant les éléments possibles En fixant l’ordre, l’optionalité, la répétition des éléments En typant les éléments Chaque document XML peut être associé à une DTD La DTD peut être : interne : insérée dans le document XML qu’elle régit externe : associée au document XML par une adresse de référence (url externe)  permet de partager une DTD entre plusieurs documents 18 décembre 2004 Saïd Radhouani - CUI

23. Définition de types de documents (DTD) DTD interne La DTD interne se déclare entre crochets dans le DOCTYPE. <?xml version=1.0 standalone=yes?> <!DOCTYPE MESSAGE [ <!ELEMENT MESSAGE (#PCDATA)> ]> <MESSAGE> Salut tout le monde </MESSAGE> 18 décembre 2004 Saïd Radhouani - CUI

24. Définition de types de documents (DTD) DTD externe (partagée) Syntaxe : <!DOCTYPE racine SYSTEM &quot;adresse&quot;> DOCTYPE permet de déclarer le type du document : le nom de l'élément racine est précisé SYSTEM indique que la DTD est stockée à l'adresse précisée. 18 décembre 2004 Saïd Radhouani - CUI

25. Définition de types de documents (DTD) Exemples : <?xml version=1.0 standalone=&quot;yes&quot;?> <!DOCTYPE MESSAGE SYSTEM &quot;message.dtd&quot;> <MESSAGE> Salut tout le monde </MESSAGE> <?xml version=1.0 standalone=&quot;yes&quot;?> <!DOCTYPE MESSAGE SYSTEM &quot;http://unl.unige.ch/message.dtd&quot;> <MESSAGE> Salut tout le monde </MESSAGE> 18 décembre 2004 Saïd Radhouani - CUI

26. Définition de types de documents (DTD) <?xml version=&quot;1.0&quot; encoding=&quot;ISO-8859-1&quot;?> <!DOCTYPE annuaire SYSTEM &quot;annuaire.dtd&quot;> <annuaire> <personne type=&quot;étudiant&quot;> <nom>HEUTE</nom> <prenom>Thomas</prenom> <email>webmaster@xmlfacile.com</email> </personne> <personne type=&quot;chanteur&quot;> <nom>CANTAT</nom> <prenom>Bertrand</prenom> <email>noir@desir.fr</email> </personne> </annuaire> 18 décembre 2004 Saïd Radhouani - CUI

27. DTD – exemple : annuaire <?xml version=&quot;1.0&quot; encoding=&quot;ISO-8859-1&quot;?> <!ELEMENT annnuaire (personne*)> <!ELEMENT personne (nom+,prenom+,email?)> <!ATTLIST personne type (étudiant |professeur | chanteur | musicien) &quot;étudiant&quot;> <!ELEMENT nom (#PCDATA)> <!ELEMENT prenom (#PCDATA)> <!ELEMENT email (#PCDATA)> 18 décembre 2004 Saïd Radhouani - CUI

28. Document XML valide Un document XML est dit valide s’il : est bien formé ; fait référence à une DTD ; se conforme à ce qui est défini dans la DTD associée. Exemple de document XML non valide: <?xml version=1.0 standalone=yes?> <!DOCTYPE MESSAGE [ <!ELEMENT MESSAGE (#PCDATA)>]> <MESSAGE langue=&quot;fr&quot; > Salut tout le monde </MESSAGE> Exemples de validateurs de documents XML : http://www.cogsci.ed.ac.uk/%7Erichard/xml-check.html http://www.stg.brown.edu/service/xmlvalid/ 18 décembre 2004 Saïd Radhouani - CUI

29. Mise en page de XML XML permet la description des données et non de leur présentation Le document ne contient aucune information concernant l'affichage L'utilisation des feuilles de style est obligatoire pour controler la mise en page du document c'est sa feuille de style qui définira la présentation sur un média 18 décembre 2004 Saïd Radhouani - CUI

30. Feuilles de style Il est possible d'utiliser les feuilles de styles CSS ou les feuilles de style XSL CSS( Cascading StyleSheet ), la solution la plus utilisée actuellement, étant donné qu'il s'agit d'un standard qui a déjà fait ses preuves avec HTML XSL ( eXtensible StyleSheet Language ), un langage de feuilles de style extensible développé spécialement pour XML 18 décembre 2004 Saïd Radhouani - CUI

31. Principe des feuilles de style 18 décembre 2004 Saïd Radhouani - CUI Données brutes Pages XML Feuille de style Appliquer Données formattées Pages HTML Présenter

32. XML et CSS Association d’une ou plusieurs feuilles de style à un document XML Association au moyen de l’instruction de traitement <?xml-stylesheet …?> Par référence dans une autre feuille de style à l’aide de @import Feuille de style spécifié par l’utilisateur (options du navigateur) Moyens d’introduire des règles de style pour le contenu XML: Séléction par des pseudo-classes Séléction par identificateur Attribut d’exception STYLE=&quot;font-style:italic« Attention pas pris en charge par tous les navigateurs Héritage des règles de style dans la hiérarchie des éléments Démo 18 décembre 2004 Saïd Radhouani - CUI

33. XSL - XSLT XSL et un langage normalisé de feuilles de style Il permet de définir simplement les règles de construction de nouveaux documents(XML, html, pdf, txt,…) à partir de documents XML L’utilisation des feuilles de style XSL pour transformer ou rendre utilisable un document XML se fait par l'utilisation de XSLT XSLT e s t le mécanisme qui permet de transformer un arbre source représentant le document xml en un arbre résultat. La construction de l'arbre de résultat permet de réordonner ou de filtrer le contenu du fichier XML 18 décembre 2004 Saïd Radhouani - CUI

34. Appel d'une feuille de style La feuille de style XSL est enregistrée dans un fichier externe d'extension &quot;.xsl&quot; L'instruction de traitement suivant indique le type de la feuille de style et son emplacement : <?xml-stylesheet type=&quot;text/xml&quot; href=&quot;url&quot;?> Exemple : <?xml version=&quot;1.0&quot; encoding=&quot;iso-8859-1&quot;?> <?xml-stylesheet type=&quot;text/xsl&quot; href=&quot;article.xsl&quot;?>  appel d'une feuille de style XSL qui est dans le fichier article.xsl dans le répertoire courant 18 décembre 2004 Saïd Radhouani - CUI

35. Structure d'une feuille de style XML est une application  une feuille de style est un document XML Une feuille de style contient donc une déclaration XML et tous ses éléments sont placés dans l'élément racine. Une feuille de style contient un ou plusieurs modèles Chaque modèle contient des informations sur l'affichage d'une branche des éléments du document <?xml version=&quot;1.0&quot; encoding=&quot;ISO-8859-1&quot;?> <xsl:stylesheet xmlns:xsl=&quot;http://www.w3.org/TR/WD-xsl&quot;> modèles </xsl:stylesheet> 18 décembre 2004 Saïd Radhouani - CUI

36. XSL / XSLT exemples Utiliser un navigateur (IE) pour afficher le contenu XML associé à une feuille de style xsl (voir demos) Génération automatique des fiches des membres et des chercheurs du CUI (voir demos) 18 décembre 2004 Saïd Radhouani - CUI

37. Utilité du XML La lisibilité : aucune connaissance ne doit être nécessaire pour comprendre un contenu d'un document XML Autodescriptif Universalité et portabilité : les différents jeux de caractères sont pris en compte Extensibilité : capacité à pouvoir décrire n'importe quel domaine de données Intégrabilité : un document XML est utilisable par toute application pourvue d'un parser (un logiciel permettant d'analyser un code XML) 18 décembre 2004 Saïd Radhouani - CUI

38. Utilité du XML A fficher un même document sur des périphériques différents sans créer de s versions du document à priori (grâce à la séparation du contenu du contenant) P ermet de structurer, poser le vocabulaire et la syntaxe des données qu'il va contenir. Echange de documents au format XML sans pour autant influer sur la forme de ceux-ci E change de données entre programmes (même sur Internet) 18 décembre 2004 Saïd Radhouani - CUI

39. SVG ( Scalable Vector Graphics ) Langage de description d’images basé sur XML Permet de créer des animations I mages vectorielles (exprimées par des formules mathématiques) S calable : la taille de l’image peut être modifiée pour s’adapter à la taille et à la résolution de l’écran Le texte qui se trouve dans une image est reconnu en tant que tel  peut être repéré par un moteur de recherche Nécessite un plugin http://www.w3.org/Graphics/SVG/ , http://www.adobe.com/svg/ Exemple : http://www.svg.free.fr/SVG/Voiture.html 18 décembre 2004 Saïd Radhouani - CUI

40. SMIL (Synchronized Multimedia Integration Language) S'appuie sur le langage XML P ermet de créer des présentations multimédia (intégrer différents médias) S ynchronisation d’images, de vidéos , de sons , de texte, ... La structure XML d'un document SMIL décrit le déroulement temporel et spatial des différents composants integrés. N écessite un plugin (ex: RealOne, QuickTime, ...) http://www.w3.org/AudioVideo/ http://www.esi.umontreal.ca/~moalv/blt6336/tutorielsmil.html 18 décembre 2004 Saïd Radhouani - CUI

41. SMIL - Exemple <smil> <head> <!-- Presentation attributes. --> <meta name=&quot;title&quot; content=&quot;video example&quot;/> <meta name=&quot;author&quot; content=&quot;EL atifi&quot;/> <layout> <!-- Width, height, and background color of entire presentation. --> <root-layout width=&quot;300&quot; height=&quot;300&quot; background-color=&quot;black&quot; /> <!-- Text region. --> <region id=&quot;text_region&quot; left=&quot;0&quot; top=&quot;175&quot; width=&quot;300&quot; height=&quot;120&quot; /> <!-- video region. --> <region id=&quot;video_region&quot; left=&quot;0&quot; top=&quot;0&quot; width=&quot;300&quot; height=&quot;170&quot; /> </layout> </head> <body> <par> <!-- Play these streams concurrently (in parallel). --> <text src=&quot;g2video.rt&quot; region=&quot;text_region&quot; /> <video src=&quot;g2video.rm&quot; region= &quot;video_region&quot;clip-end=&quot;0:43.0&quot;/> </par> </body> </smil> 18 décembre 2004 Saïd Radhouani - CUI

42. SMIL - Exemple Démo Autres exemples: http://www.realnetworks.com/resources/samples/switching.html 18 décembre 2004 Saïd Radhouani - CUI

43. VXML – Voice XML le VoiceXML permet de déployer des applications professionnelles (centres d'appels, messagerie d'entreprise, intranet vocal) ou grand public (services d'informations boursières, météo, jeux, astrologie, etc...). P ermet l'accès à Internet via le téléphone, mobile ou fixe navigation téléphonique sur Internet à travers des sites vocaux Conception de plate formes Internet pour les handicapés mal voyants… standard automatique, journal téléphoné, serveur vocal d'actualités, service thématique etc. 18 décembre 2004 Saïd Radhouani - CUI

44. VXML – exemple <?xml version=&quot;1.0&quot;?> <vxml version=&quot;2.0&quot;> <menu> <prompt> Choisissez une section: <enumerate/> </prompt> <choice next=&quot;http://www.le-site.com/sports.vxml&quot;> Sports </choice> <choice next=&quot;http://www.le-site.com/meteo.vxml&quot;> Météo </choice> <choice next=&quot;http://www.le-site.com/actus.vxml&quot;> Actualités </choice> <noinput>Faites un choix parmi les sections proposées: <enumerate/> </noinput> </menu> </vxml> 18 décembre 2004 Saïd Radhouani - CUI

45. VXML – exemple Le dialogue serait rendu comme suit, à l'aide d'un téléphone: Ordinateur: &quot;Choisissez une section: Sports; Météo; Actualités &quot; . Utilisateur: &quot;Astrologie &quot; . Ordinateur: message spécifique à la plateforme, de la forme &quot;Je n'ai pas compris ce que vous avez dit&quot;, puis &quot;Faites un choix parmi les sections proposées: Sports; Météo; Actualités &quot; . Utilisateur: &quot;Actualités &quot; . Ordinateur: charge la page http://www.le-site.com/actus.vxml Démo 18 décembre 2004 Saïd Radhouani - CUI

46. VRML (Virtual Reality Modeling Language) Langage de programmation pour la description d e scènes 3D L ’utilisateur peut bouger dans l a scène comme s’il était dans un espace réel. Les programmes VRML décrivent des formes (sphères, cubes, cônes, cylindres ...), des éclairages, des sons, http://www.web3d.org/ http://apia.u-strasbg.fr/vrml/tutoriel/ 18 décembre 2004 Saïd Radhouani - CUI

47. Editeurs XML Editeurs d’XML Jaxe : éditeur XML Xeena XML SPY Exchanger XML Editor XML Editor Jaxe Morphon XMLwriter … 18 décembre 2004 Saïd Radhouani - CUI

48. Références http://www.chez.com/xml/ http://www.toutestfacile.com http://www.w3c.org/XML/ http://www.w3schools.com/svg/svg_examples.asp http://www.w3.org/Math/implementations.html http://www.yoyodesign.org/doc/w3c/w3c.html http://apia.u-strasbg.fr/vrml/index.html http://www.web3d-fr.com/ XML le guide de l’utilisateur. Edition OSMAN EYROLLES MULTIMEDIA (Livre sur XML) voir site laltruiste.com 18 décembre 2004 Saïd Radhouani - CUI