l information HTML - XML

Transcription

1 INGÉNIERIE DOCUMENTAIRE APPLIQUÉE AUX ARCHIVES Cours assuré par A. MKADMI 4 ème G.D.A Institut Supérieur de Documentation PLAN STRUCTURATION DE L INFORMATION HTML (Structure générale, Mise en forme, Listes, Liens hypertextes, Tableaux, Formulaires, Frames, Feuilles de style) XML (Structure et syntaxe, Structures types (DTD, Schémas XML), Feuilles de style (XSLT)) DESCRIPTION & MÉTADONNÉES EAD : Encoded Archival Description (Origine, documentation, structure générale, principes de conception, logiciels de création et de publication, liens avec les autres normes.) EAC : Encoded Archival Context (Origine, documentation, structure générale, principes de conception) PRESERVATION DE L INFORMATION OAIS (Open Archiving Information System): le système d archivage ouvert (modèle de référence, modèle d information, modèle fonctionnel) 2 HTML Structuration de l information HTML - XML Préambules Mise en forme : couleurs, police et taille, centré, gras, Paragraphes, titres, listes, séparateurs, chemins d accès, insérer des images, etc. Liens hypertextes Insertion d images Listes Tableaux Feuilles de style CSS Formulaires Frames 3 4 1

2 Préambules Avant de commencer, voici encore quelques petites recommandations. Qu'est ce que l'html? Le langage HTML n'est pas un langage de programmation proprement dit! Ce sont "simplement" des balises pour mettre en forme (avec des liens, en tableau,...) du texte et des images! Qu'est ce qu'une balise? Une balise est une "instruction" comprise entre crochets < > qui possède un nom et parfois des attributs. Presque toutes les balises doivent être ouvertes puis refermées. On retrouvera donc souvent une balise de début et une balise de fin. La balise de fin porte le même nom que la balise de début à l'exception du nom de la balise qui est précédé du signe /. Nous aurons donc par exemple : (ouverture) <XYZ> et (fermeture) </XYZ>. Le nom de la balise (contenu entre les crochets) n'est pas sensible à la casse, il peut être écrit indifféremment en majuscule, en minuscule ou un mélange des 2. Préambules De quoi avez-vous besoin? -unnavigateur (Internet Explorer, Netscape, Mozilla, Opera...) - un éditeur HTML (==> Notepad, le "simple" Blocnotes de Windows fera très bien l'affaire!) Pour commencer le Bloc-notes est très bien, vous devrez taper vous même le code et ainsi vous pourrez vous familiariser beaucoup plus vite avec les balises. A la fin du cours nous parlerons d'autres éditeurs, mais pour les utiliser il faut quand même connaître les bases du langage HTML. - du temps et de la patience 5 6 Votre première page HTML(1) Voici enfin le moment de créer votre première page HTML. Commencez par ouvrir le Bloc-notes (ou un autre éditeur HTML) pour pouvoir taper le code. Voici le code à taper : <HTML> <HEAD> <TITLE>Ma première page en HTML</TITLE> </HEAD> <BODY> Bonjour, voici ma première page Web! </BODY> </HTML> Votre première page HTML (2) Enregistrez le document au format HTML (*.html ou *.htm). Pour cela, dans la case "Nom", tapez : index.html Et dans la case "Type", choisissez Tous(*.*) dans la liste déroulante. Voilà votre page est enregistrée. Vous pouvez ouvrir votre navigateur et visualiser votre première page. Le seul texte qui apparaîtra sera : "Bonjour, voici ma première page web!"

3 Explication de balises utilisées - <html> et </html> : la première informe votre navigateur qu'il va afficher une page HTML. Cette balise doit être la première de votre code. La seconde est la balise de fin. Elle referme la première. (remarquez le / devant le mot contenu entre crochets). Elle doit être la dernière de votre code HTML et signifie la fin de votre code HTML. - <head> et </head> : la première ouvre l'entête de votre page. Cet entête comprend pour l'instant le titre de votre page. Cette balise est toujours placée juste après la balise <html>. La seconde, referme l'entête de votre page (remarquez encore une fois le / devant le mot entre crochets). - <title> et </title> : la première ouvre la partie titre de votre page. Ce titre sera placé dans la barre tout au-dessus de votre navigateur. La seconde referme la première encore une fois en plaçant un / devant le mot entre crochets. La balise "title" doit être ouverte puis refermée à l'intérieur de la balise "head". C'est à dire qu'il faut que la balise "title" doit être ouverte puis refermée avant que le balise "head" ne soit refermée. 9 Explication de balises utilisées (suite) - <body> et </body> : la première ouvre le début du corps de votre document. C'est là que vous allez placer textes, images et tout ce que contiendra votre page. Cette balise doit se situer après la balise de fermeture de l'entête (=> </head>). La seconde referme la première. Le code d'une page Web est composé de 2 parties, l'en-tête de la page (HEAD) et le corps (BODY). Seul le corps de la page est affiché à l'écran (dans votre première page, il n'y a que la phrase "Bonjour,..." qui s'est affichée). 10 Mise en forme : Les couleurs (1) <HTML> <HEAD> <TITLE>Texte en couleurs</title> </HEAD> <BODY> <FONT color="red">rouge</font> <BR> <FONT color="#ff0000">rouge</font> <BR> <FONT color="blue">bleu</font> <BR> <FONT color="#0000ff">bleu</font> <BR> </BODY> </HTML> 11 Mise en forme : Les couleurs (2) Vous pouvez également mettre le fond de l'écran en couleur (plutôt qu'en blanc par défaut). <HTML> <HEAD> <TITLE>Fond d'écran en couleur</title> </HEAD> <BODY bgcolor="#000000"> <FONT color="#ffffff">texte blanc sur fond noir</font> </BODY> </HTML> 12 3

4 Explications des nouvelles balises utilisées - <Br> : cette balise permet de faire un saut de ligne. Lorsque vous écrivez du texte dans une page Web, il y a un retour automatique à la ligne lorsque le texte atteint le bord droit de l'écran. Avec la balise <br>, vous pourrez faire des sauts de ligne à votre guise. Un "br" correspond à un saut de ligne, pour laisser une ligne blanche entre 2 paragraphes par exemple il faut placer 2 "br" (==> <br><br>). Il n'y a pas de balise de fin! - <font> et </font> : elles permettent de modifier l'apparence du texte. Elle doit recevoir des informations provenant d'attribut(s) pour connaître la mise en forme à appliquer. Pour l'instant, nous avons juste vu l'attribut "color" qui permet de mettre le texte en couleur. Les couleurs les plus fréquentes peuvent être nommée explicitement en anglais (red, green, blue,...) Sinon il faut placer le code hexadécimal de la couleur voulue. La couleur du texte est par défaut noir (# ou black). - Nous avons également vu l'attribut "bgcolor" g dans <body> : "bgcolor" (==>background color : couleur de fond) permet de mettre le fond de l'écran en couleur tout comme le fait "color" pour le texte. C'est le même principe pour le code des couleurs. La couleur du fond est par défaut blanc (#ffffff). Petites définitions - Un attribut est un paramètre qui fournit des indications à une balise. Il possède un nom et très souvent une valeur à préciser (nom = "valeur"). Il se rajoute dans la balise de début, c'est à dire toujours entre les < > après le nom de la balise (par exemple : <font color="#ff0000">. - Le code hexadécimal qui permet de définir une couleur est composé de 6 caractères précédés de #. ces 6 caractères définissent la "teneur" en rouge, vert et bleu (les couleurs de bases) de la couleur a former. Il n'y a que 16 caractères possibles : 0,1,2,3,4,5,6,7,8,9,a,b,c,d,e,f Mise en forme : police et taille Nous allons maintenant faire varier la taille et la police de caractère du texte. <HTML> <HEAD> <TITLE>Taille et police du textes</title> </HEAD> <BODY> <FONT size=3>taille 3 (par défaut)</font> <BR> <FONT size=2>taille 2</FONT> <BR> <FONT size=1>taille 1</FONT> <BR><BR> <FONT size="+3">taille +3</FONT> <BR> <FONT size="+2">taille +2</FONT> <BR> <FONT size="+1">taille +1</FONT> <BR> Taille par défaut ( => 3 ) <BR> <FONT size="-1">taille -1</FONT> <BR> <FONT size="-2">taille -2</FONT> <BR> <FONT size=2 face="comic sans MS">Taille 3 en Comic sans MS</FONT> <BR> <FONT face="arial, Times New Roman" color="#336699">taille normal en Arial si la police existe sinon en Times New Roman en couleur #336699</FONT> <BR> </BODY> </HTML> 15 Liens Hypertextes Définir un lien Les liens hypertextes sont définis à l'aide de l'élément <A>. Le texte de cet élément constitue la zone sur laquelle cliquer pour exécuter un lien : <A HREF="adresse de destination">nom du lien<a> L'adresse de destination peut être une URL ou bien un nom de fichier situé sur le même serveur. Dans ces deux cas on parle de lien externe. Mais un lien peut aussi diriger vers un marqueur, ou une étiquette, situé dans la même page. Il s'agit alors d'un lien interne. Les liens pointent souvent vers d'autres documents HTML mais ce n'est pas obligatoire. On peut diriger un lien vers n'importe quel type de document. Le navigateur lance alors le "visualiseur" adapté ou bien propose d'enregistrer le fichier sur le disque local. 16 4

5 Liens Hypertextes (2) Les liens externes <A HREF=" W3C - World Wide Web Consortium</A> LE W3C - WORLD WIDE WEB CONSORTIUM <A HREF="index.html html">cours HTML</A> Les liens internes Ils pointent vers une étiquette située dans le même document HTML. Cette étiquette doit être définie avec un élément <A> complété cette fois-ci par l'attribut name. On utilise le caractère # pour déterminer si un lien se réfère à un autre document (lien externe) ou à une étiquette dans le même document. Définition d'une étiquette <A NAME="sommaire"></A> "></A> Ce code n'affiche rien, mais cette étiquette a été placé au début du document. Lien vers une étiquette <A HREF="#sommaire">Sommaire</A> Liens Hypertextes (3) On peut aussi aller vers une étiquette dans un autre document : <A HREF="bases.html#sommaire">Sommaire du chapitre "Les bases"</a> Les attributs HREF et NAME peuvent être présents sur la même ancre. Par exemple, pour définir une note : <A HREF="#note1" NAME="retour1">(1)</A>... et la note décrite plus loin :... <A HREF="#retour1" NAME="note1">1. </A> Texte de la note Intégrer des images(1) L'élément <IMG> On utilise l'élément <IMG> pour placer les images. Deux attributs sont obligatoires : L'attribut src pour spécifier le nom du fichier image à charger. Les fichiers image doivent impérativement être aux formats GIF ou JPG. L'attribut alt pour indiquer un contenu alternatif, c'est à dire un texte à afficher à la place de l'image lorsque, pour différentes raisons, elle n'apparaît pas. Exemple : <IMG src=laboratoire_paragraphe.gif alt="laboratoire Paragraphe"> 19 Intégrer des images(2) Les attributs optionnels de l'élément <IMG> L'attribut align Il indique le mode d'alignement de l'image. Il y a 5 valeurs possibles : top, middle, bottom, left, right. Les trois premiers concernent l'alignement vertical par rapport à la ligne. Les valeurs left et right permettent d'habiller une image avec le texte, en plaçant l'image respectivement à gauche et à droite. L'attribut border Permet de régler l'épaisseur du trait entourant l'image, en pixels. La valeur 0 signifie qu'il n'y a pas de bordure (c'est la valeur par défaut sauf dans le cas où l'image est dans un lien). Les attributs width et height Ils permettent de déterminer la hauteur et la largeur de l'image image, en pixels. Les attributs hspace et vspace Permettent de déterminer les espaces, en pixels, entre l'image et le texte autour (hspace horizontalement et vspace verticalement). 20 5

6 Intégrer des images(3) Les images cliquables Utiliser une image dans un lien L'utilisation d'une image comme étiquette dans un lien ne pose bien entendu aucun problème. Il suffit de placer un élément IMG dans un élément A. Attention toutefois : par défaut les images cliquables ont une bordure de la couleur des liens. Pour la supprimer, il faut utiliser l'attribut border (en lui attribuant la valeur 0). 21 Cartes cliquables (1) Les cartes cliquables On appelle "carte cliquable" une image dans laquelle sont définis des zones associées à des liens. Selon l'endroit où l'on clique sur la carte, un lien différent est activé. On place l'image comme d'habitude avec l'élément IMG. On ajoute un attribut map qui permet d'indiquer le nom de la carte qui doit être utilisée. On peut définir les différentes zones avec des éléments AREA. <IMG src=imagemap.gif alt="carte cliquable" usemap=#map> 22 Cartes cliquables (2) Chaque élément AREA définit une zone. Il doit comporter différents attributs : l'attribut href pour indiquer l'adresse du lien correspondant à cette zone l'attribut shape pour indiquer la forme de la zone. 3 formes sont possibles : rect pour un rectangle circle pour un disque poly pour un polygone De plus, la valeur default permet de définir un lien qui sera activé si l'on clique en dehors des zones définies. L'élément AREA contenant cette valeur doit être le dernier de la liste. 23 Cartes cliquables (3) l'attribut coords pour indiquer les coordonées des différentes formes : rect : un rectangle est défini par son coin supérieur gauche (x1,y1) 1) et son coin inférieur i droit it( (x2,y2) 2) soit coords="x1,y1,x2,y2" circle un disque est défini par son centre (x,y) et son rayon (r) coords="x,y,r" poly un polygone est défini par la liste de ses sommets (x1,y1), (x2,y2), (x3,y3)... (maximum 100) soit coords="x1,y1,x2,y2,x3,y3..." l'attribut t alt pour indiquer un texte alternatif que les navigateurs textuels pourront utiliser. 24 6

7 Cartes cliquables : exemple LES LISTES <IMG src=imagemap.gif alt="carte cliquable" usemap=#map> <MAP name=map> <AREA href="index.html" shape="rect" coords="10,10,280,40",, alt="cours HTML"> <AREA href="intro.html" shape="rect" coords="10,50,70,110" alt="introduction"> <AREA href="bases.html" shape="circle" coords="110,80,30" alt="bases"> <AREA href="textes/liens.html" shape="poly" coords="150,70,180,70,180,50, 210,80,180,110,180,90,150,90" alt="liens"> <AREA nohref shape="rect" coords="220,50,280,110" alt="rien"> <AREA href="textes/refs.html" shape="default" alt="références"> </MAP> Les listes sont des éléments très utilisées sur les pages Web. Il en existe de différentes sortes. Listes à puces texte t 1 texte 2 <UL><LI> texte 1<LI> texte 2</UL> Listes numérotées texte 1 texte 2 <OL> <LI> texte 1 <LI> texte 2 </OL> Liste de définition Terme 1 à définir Définition du terme 1 Terme 2 à définir Définition du terme 2 suite du terme 2 <DL> </DL> <DT> Terme 1 à définir <DD> Définition du terme 1 <DT> Terme 2 à définir <DD> Définition du terme 2 <DD> suite du terme 2 l'imbrication de listes est bien sûr possible Les tableaux Tableaux : exemple Syntaxe : <TABLE> : Indique le début du tableau (finissant par </TABLE>) Option : <TABLE BORDER> pour indiquer que le tableau aura une bordure <TR> : indique une nouvelle ligne (Table Row) <TH> : indique une nouvelle colonne de titre (Table Header), options COLSPAN=«n» -> Permet de mettre une colonne identique sur «n» colonnes ROWSPAN=«n» -> Permet de mettre une ligne identique sur «n» lignes <TD> : Indique une nouvelle colonne (Table Data) Option : ALIGN={RIGHT,CENTER,LEFT} -> Alignement du contenu <table border= " 1 " > <tr><th rowspan=2>service<th colspan=2>identification <tr><th>nom<th>tel <tr><th rowspan="3"> DIM<td>Burgun Anita<td>86703 <tr><td>pouliquen Bruno<td>86161 <tr><td>delamarre Denis<td>86162 <tr><th rowspan ="2"> MEDIATHEQUE<td>Canal Sabine<td> <tr><td>le Beux Pierre<td> </table> Résultat

8 Feuilles de styles CSS Introduction CSS signifie Cascading Style Sheet Préconisées pour le stylage des documents HTML depuis la version 4.0 Utilise un langage propre, différent du langage HTML Recommandation du W3C depuis 1996 Deuxième version parue en 1998 Supportées par les dernières versions des navigateurs Internet Explorer, Netscape 29 Feuilles de styles Avantages Langage simple et lisible Simplifie l édition de pages Web et la maintenance d un site en séparant le style de la présentation du contenu Permet de faire une présentation plus soignée et originale sans nuire à l accessibilité Flexibilité : on peut changer l apparence sans changer le document HTML Permet une plus grande uniformité de présentation pour l ensemble des pages d un site Allège les fichiers HTML dont le contenu se perdait dans un balisage complexe 30 Feuilles de style Différents types Feuilles de style Feuille de style externe Feuille de style externe (.css) Allège le document HTML Permet de partager une même feuille de style entre plusieurs documents HTML Feuille de style interne (Dans le document HTML) Dans l'entête dun d'un document HTML au moyen de l'élément <STYLE> </STYLE> Le lien vers la feuille de style se fait au moyen de l'élément <LINK> dans l'entête du document HTML <LINK rel="stylesheet" href="nom.css" type="text/css"> L'élément <LINK> comprend au moins 3 attributs : Le type de lien, soit vers une feuille de style (rel="stylesheet") L'emplacement de la feuille (href="defaut.css") Le type de feuille de style (type="text/css")

9 Feuilles de style Syntaxe de base Une feuille de style est une séquence de règles Une règle peut s'appliquer à plusieurs éléments, à un seul élément ou à une partie d'élément seulement Une règle est composée d'un sélecteur et d'une déclaration Une déclaration est mise entre accolades et se compose d'une propriété p et d'une valeur,, séparées par ": " sélecteur {propriété: valeur} déclaration règle 33 Feuilles de style Syntaxe de base : les règles Règle = 1 sélecteur, 1 propriété (s'applique à un élément HTML) H1 {color: blue} P {text-align: left} Body {background-color: yellow} Règle = 1 sélecteur, plusieurs propriétés P{ {color: blue ; text-align: t justify} Règle = plusieurs sélecteurs, 1 ou plusieurs propriétés H1, H2, H3 {color: red} 34 Feuilles de style Syntaxe de base : commentaire et casse Les commentaires doivent être entre "/*" et "*/" /* Ceci est un commentaire */ MAJUSCULES = miniscules P {color: blue} = p {COLor: BLUE} Feuilles de style Propriétés : police Font-family : nom de la police (arial, "arial black", ) Font-size : taille de la police (xx, small, 10pt, smaller, 200%, ) Font-style : style des caractères (normal, italic, oblique, ) Font-weight : épaisseur des caractères (normal, bold, bolder, 100, 200, )

10 Feuilles de style Propriétés : texte et couleur Texte Text-align : alignement du text (left, center, justify, ) Text-decoration : décoration du texte (none, underline, overline, ) Text-indent : indentation du texte (2cm, 20%, ) Couleur Color : change la couleur 37 Feuilles de style Propriétés : Tableaux table { border-style:solid; border-width:1px; border-color:black; width:50%; background-color:#ffffff } td { border-style:solid; border-width:1px; border-color:red; width:50%; } 38 Tp sur les feuilles CSS Soit le fichier HTML suivant : <html> </head> <body bgcolor="gray" text="blue" link="red"> <h1 align="left"><font left color="black" face="verdana" size="5"> Les feuilles de style CSS</h1> <h2 align="center"><font color="white">syntaxe</h2> <table width="75%" bgcolor="yellow"> <tr><td>propriétés de style<td>exemple <tr><td>color, font-family, font-style, font-size...<td>body {backgroundcolor:yellow} </table> </html> A) créez une feuille de style css permettant de mettre en page ce document HTML, telque c'est décrit dans le contenu du document Corrigé Style.css body {background-color:gray;color:blue} A:link {color:red} h1 {text-align:left;color:black;font-family:verdana;font-size:15px} h2 {text-align:center;color:white} table {width:75%;background-color:yellow} color:yellow} Style.html (sans mise en page) <html> <head><link href="style.css" type="text/css" rel="stylesheet"></head> <body> <h1> Les feuilles de style CSS</h1> <h2>syntaxe</h2> <table> <tr><td>propriétés de style<td>exemple <tr><td>color, font-family, font-style, font-size...<td>body {background-color:yellow} </table> </html> B) réécrire le document HTML sans mise en page 10

11 TP feuille de style CSS Créez une feuille de style à votre page cv.html qui permet de le mettre en page de la manière suivante : Titre de niveau 1, 2,3 sont de couleur bleue. Les paragraphes sont justifiés et de couleur noire. La taille de l écriture est de 5 points Le nom de police est arial Le corps du document est de couleur jaune. Les formulaires formulaires et interactivité récupérer des données à partir d'une page HTML dans une boite (questionnaires, payement électronique, ) entrer en communication avec un système ou une base de données sur le serveur (bases de données, systèmes de recherche documentaires, moteurs de recherche, ). Deux objectifs collecter des informations sur les utilisateurs transmettre des données à traiter sur le serveur Les formulaires <form>formulaire</form> 3 attributs : ACTION : type d'action à déclencher (adresse é-mail par exemple dans laquelle on reçoit les données du formulaire) METHOD : définit la méthode de transfert des données (2 valeurs :GETet POST). Dans le cas de la réception dans une boite de courrier électronique, la valeur POST est la seule valeur possible. ENCTYPE : définit le format de codage des données si le protocole du serveur n'a pas imposé le sien (text/plain dans le cas des formulaires classiques). <FORM ACTION=" mailto:amkadmi@gmail.com" METHOD="POST" ENCTYPE="text/plain"> 43 Les formulaires Zone texte 1 <INPUT TYPE="text" NAME="nom" SIZE="n"> Nom de famille : <input type="text"size="20" name="nfamille"> <P>Nom de famille : <input type="text" text size="80" name="nfamille"> 44 11

12 Les formulaires Zone texte 2 <TEXTAREA NAME="nom" ROWS= "i"cols= "j"></textarea> Adresse : <textarea name="adresse" rows="3" cols="30"> </textarea> <SELECT NAME="nom"> <OPTION>élément1 <OPTION>élément n </SELECT> <b>pays</b> : <SELECT NAME="pays"> <OPTION>France <OPTION> Suisse <OPTION>Italie </SELECT> Les formulaires Liste déroulante Les formulaires : Boutons (choix unique) Sexe : masculin <INPUT TYPE="radio" NAME="sexe" VALUE="masculin"> <INPUT TYPE="radio" NAME="nom" <br>féminin VALUE="valeur"> <INPUT TYPE="radio" NAME="sexe" VALUE="feminin"> Cases à cocher (choix multiple) <INPUT TYPE="checkbox" NAME="nom" VALUE="valeur"> Favoris : cinéma<input TYPE="checkbox" NAME="favoris" VALUE="cinema"> musique<input TYPE=" checkbox " NAME="favoris" VALUE="musique"> voyage<input TYPE=" checkbox " NAME="favoris" VALUE="voyage"> Les formulaires Boutons (submit & reset) <INPUT TYPE="submit" VALUE="valeur"> <INPUT TYPE="reset" VALUE="valeur"> <INPUT TYPE="submit" VALUE="Envoyer"> <INPUT TYPE="reset" VALUE="Annuler">

13 Les formulaires : tp Créez un formulaire qui permet aux visiteurs it de votre site de donner leurs avis sous forme de commentaires, tout en laissant chacun son nom, son prénom, sa fonction, son pays et son courriel. Le résultat de votre travail sera un formulaire sous cette forme : Les FRAMES Frames = cadres = fenêtres C est la division de votre écran en plusieurs zones pouvant être chacune une source d information. Quoi de plus simple que les frames? Mais aussi quoi de plus délicat et dangereux (risque de plantage) que les frames? Introduit en 1996 par Netscape présenter d une manière simple des données complexes et reliées entre elles Les Frames <FRAMESET ></FRAMESET> <Frameset> remplace la balise < Body> <FRAMESET ROWS=... ></FRAMESET> définir des fenêtres horizontales <FRAMESET COLS=... ></FRAMESET> définir des fenêtres verticales <FRAMESET ROWS="10%,*,10%"></FRAMESET> <FRAMESET COLS="10%,60%,*"></FRAMESET>

14 Les Frames <FRAMESET ROWS="30%,70%" FRAMEBORDER="0" > <FRAME> <FRAMESET COLS="30%,70%"> <FRAME> <FRAME> </FRAMESET> </FRAMESET> 53 Les Frames Les navigateurs ne supportant pas les Frames balise : <NOFRAMES></NOFRAMES> <NOFRAMES> à ajouter avant le marqueur </FRAMESET> <BODY> Votre navigateur ne supporte pas les Frames </BODY> </NOFRAMES> </FRAMESET> </HTML> 54 Les Frames Déclaration des frames Pour l instant nos frames sont vides, on doit les paramétrer et leur donner à manger <FRAME NAME= nom > : nom de la case <FRAME SCROLLING= yes/no > : présence ou pas de barre de défilement <FRAME SRC= source > : nom et/ou adresse du fichier source à afficher. <FRAME NORESIZE> : par défaut un frame est redimensionnable, avec cette balise on fige le frame. <FRAME MARGINWIDTH=n> : détermine la marge entre le bord du frame et le contenu <FRAME MARGINHEIGHT=n> : détermine l espace entre les marges sup et inf du frame et celles des documents. 55 Les Frames Déclaration des frames A.html B.html C.html <HTML></HEAD><BODY> <H4>A</H4> </BODY></HTML> <HTML></HEAD><BODY> <H1>B</H1> </BODY></HTML> <FRAMESET ROWS="30%,70%"> <FRAME NAME="A" SRC="A.htm"> <FRAMESET COLS="30%,70%"> <FRAME NAME="B" SRC="B.htm"> <FRAME NAME="C" SRC="C.htm"> </FRAMESET> </FRAMESET> <HTML></HEAD><BODY> <H1>C</H1> </BODY></HTML> 56 14

15 Les Frames Fonctionnement des frames Établir des liens dans le fichier source pour afficher la cible dans l une des fenêtres. Syntaxe: <A HREF= nom.html TARGET= nom_frame_cible >lien</a> Supposons qu à partir d une ancre dans la fenêtre B on veut établir un lien pour afficher le contenu du fichier A dans la fenêtre C B.html <HTML></HEAD><BODY> <H1><A HREF="A.html" TARGET="C">B</A></H1> </BODY></HTML> Les Frames Fonctionnement des frames Paramètres de l attribut TARGET _self : le document est à afficher dans le même frame, _top : efface les frames présents et affiche la cible en plein écran. _blank : force le navigateur à ouvrir une nouvelle fenêtre plein écran qui n a pas de nom. _parent : affiche la cible dans le document parent du document actuel TP sur les frames XML (extensible Markup Language) Galaxie XML Bref Historique Objectifs de XML Limites de HTML et SGML Apports de XML DTD XML Schema Feuilles de style : XSLT

16 La galaxie XML XML : la syntaxe de base de balise Espaces de noms : éviter les conflits entre noms de balises pour différentes applications XSL (extensible Stylsheet Language) : XSLT : Transformation d un document XML XSLFO : formatage en vue de l affichage XPATH : Mécanisme pour se référer à une partie d un document XML XLink, XPointer : connexions entre documents XML Query : langage de requêtes DTD et XML Schema : définir i la syntaxe des balises pour une application DTD : Document Type Definition (ex : SGML) XML Schema : plus riche, écrit lui-même en XML XForms : les formulaires XML Bref historique (1) Ancêtre : SGML Début des années : Standard ISO 8879 Mêmes principes (Structuration sémantique des fichiers), mais plus complexe que XML Application de SGML : HTML Le langage du web Seulement intéressé par les aspects graphique des documents hypertextes Bref historique (2) 1996 : groupe de travail au sein du W3C 1998 : publication de recommandations pour la version 1.0 de XML L objectif qui a guidé le groupe de travail XML est de créer un langage : Utilisable sur l'infrastructure Internet Supporter une grande variété d'applications Être compatible avec SGML Facile à traiter un document XML par programme Fournir un balisage compréhensible par l'homme La concision dans le balisage n'est pas importante Rendre l'écriture d'un document facile Livrer une spécification formelle et concise (42 pages) Rédiger la spécification rapidement (18 mois) XML est une recommandation du W3C en date du 10 février 1998, référencée à : XML : Objectif et définition XML=eXtensible Markup Language Objectif : étendre les fonctionnalités du HTML pour faciliter les échanges de documents sur le web - Définition libre de nouvelles balises et de nouveaux attributs - Support de structure complexe de documents - Vérification de la structure d un document par rapport à une DTD (Document Type Definition) ou un schéma XML - Séparation entre contenu et mise en page (feuille de style) Offrir un standard équivalent à SGML, mais plus simple. XML peut donc être défini comme étant un langage de description et d échange de données structurées

17 Apports XML La lisibilité : aucune connaissance ne doit théoriquement être nécessaire pour comprendre un contenu d'un document XML Autodescriptif et extensible ; Une structure arborescente : permettant de modéliser la majorité des problèmes informatiques ; Universalité et portabilité : les différents jeux de caractères sont pris en compte ; Déployable : il peut être facilement distribué par n'importe quel protocole à même de transporter du texte, comme HTTP ; Intégrabilité : un document XML est utilisable par toute application pourvue d'un parser (c'est-à-dire un logiciel permettant d'analyser un code XML) ; Extensibilité : un document XML doit pouvoir être utilisable dans tous les domaines d'applications 65 Exemple de document XML Description XML des informations carte de visite <?xml version= " 1.0 " encoding= " ISO " standalone = " yes "?> <cartes> <personne> <nom>mkadmi</nom> <prenom>abderrazak</prenom> <bureau> <laboratoire>paragraphe</laboratoire> <adresse> <rue> 2, rue de la Liberté</rue> <code_postal>93526</code_postal> <ville>saint-denis</ville> </adresse> <telephone>(33) </telephone> </bureau> </personne> </cartes> 66 Structure d un document XML (1) Deux types de documents XML : - Document bien formé : respecte la syntaxe XML - Document valide : bien formé qui respecte une structure type définie dans une DTD Un document XML se compose de : - un prologue (facultatif mais conseillé) - des commentaires et des instructions de traitement. - un arbre d éléments qui constitue le contenu du document, 67 P R O L O G U E Structure d un document XML (2) C O R P S D U D O C U M E N T Déclaration XML <?xml version= " 1.0 " encoding= " ISO " standalone = " yes "?> <?xml-stylesheet type = " text/xsl " href= " test.xsl "?> Instruction de traitement <!DOCTYPE formation [ <!ENTITY organisme " EDIFRANCE "> <!ELEMENT formation (date, titre, societe, programme) > <!ELEMENT date ( #PCDATA) > Partie atedécaatve déclarative <!ELEMENT titre ( #PCDATA) > (DTD) <!ELEMENT societe ( #PCDATA) > <!ELEMENT programme ( chapitre+) > <!ELEMENT chapitre ( #PCDATA) > <!ATTLIST chapitre numero NMTOKEN #REQUIRED > ] > <formation> <date/> <titre> <![CDATA[<XML> - Développement ]]> </titre> <societe>organisée par &organisme ;</societe> <! Programme du séminaire <programme> <chapitre numero= " 1 ">Introduction au langage XML</chapitre> <chapitre numero= " 2 ">Les documents XML</chapitre> <chapitre numero= " 3 "> XML Schema</chapitre> <chapitre numero= " 4 ">XPath et la navigation</chapitre> <chapitre numero= " 5 ">Les liens XML (XLL)</chapitre> <chapitre numero= " 6 ">Les feuilles de style </chapitre> <chapitre numero= " 7 ">Les applications XML</chapitre> </programme> </formation> 68 17

18 Structure d un document XML : prologue Le Prologue contient : Une déclaration XML : <?xml version= 1.0 encoding= ISO standalone= yes?> Des instructions de traitement : <!xml-stylesheet type= text/xsl href= test.xsl?> Une déclaration de DTD : <!DOCTYPE exemple SYSTEM exemple.dtd > ou <!DOCTYPE exemple [déclarations]> 69 Structure d un document XML : arbre d éléments <nom>contenu de l élément</nom> Le nom indiqué par les balises d'ouverture et de clôture - doit commencer par une lettre, - peut comporter des chiffres, des lettres, les caractères moins (-), tiret souligné ( _ ), point (.') - la casse est discriminante - le nom ne peut commencer par XML que ce soit en minuscule, majuscule ou en combinaison des deux. L'arbre d'éléments décrit la structure hiérarchique d'un dun élément. Les éléments les plus fins sont dits éléments terminaux. La racine de l arbre est appelée élément père. Dans un document, il n existe qu un et un seul élément père. 70 Exemple : Syntaxe incorrecte <?xml version = 1.0?> <TOPIC> <TITLE>Répertoire de schémas XML</TITLE> <AUTHOR>Abderrazak MKADMI</AUTHOR> <PUBLISHER>EDIFRANCE</PUBLISHER> </TOPIC> <TOPIC> <TITLE>Les SGBDRs</TITLE> <AUTHOR>Imad Saleh</AUTHOR> <PUBLISHER>Eyrolles</PUBLISHER> </TOPIC> Plusieurs éléments père Syntaxe Incorrecte Attributs, entités, sections littérales L arbre d éléments XML peut contenir différents objets : Attributs : éléments pouvant contenir des informations complémentaires stockées sous forme d association nom=valeur Entités : objet disposant d un nom et d un contenu qui peut être interne, externe en format XML ou autre, Sections littérales : chaîne de caractères non interprétée par le parseur XML Ceci permet d inclure des caractères spéciaux (exemple syntaxe XML dans un document XML)

19 Attributs : exemple <?xml version ="1.0"?> <article> <editeur nom ="EYROLLES"> <ed-adresse> <rue>1, rue Thénard</rue> <cp>75005</cp> <ville>paris</ville> </ed-adresse> </editeur> <topic> <title>xml : le guide de l utilisateur</title> <author>elliotte Rusty Harold</author> <editeur nom="eyrolles"></editeur> </topic> </article> Cet exemple permet de simplifier l écriture, surtout si plusieurs ouvrages font référence à ce même éditeur. On a à écrire que le nom de l éditeur et pas à réécrire à chaque fois toutes les Informations liées à l éditeur 73 Attributs prédéfinis xml:lang="fr" définir la langue du document. xml:space="preserve" les caractères d espacement (espace, tabulation, ligne blanche sont préservés) xml:space="default" le traitement des caractères d espacement est appliqué par défaut 74 élément versus attribut Pas de règle pour choisir entre élément et attribut Les critères disponibles sont liés à : La structuration de l information : Structurée ou non : éléments Non structurée : attributs L ordre de l information est-il important? Ordre important : éléments Ordre non important : attributs Entités internes et entités externes (1) Exemple d une entité interne <?xml version ="1.0"?> <?xml:stylesheet href=" 3b-EntiteInterne.xsl" type="text/xsl"?> <!DOCTYPE catalogue [ <!ENTITY INTER "Internet et les BD enseignés à l ISD " > ] > <catalogue> <stage> <intitule>xml et les bases de données</intitule> <grp-produit>&inter; </grp-produit> </stage> </catalogue>

20 Entités internes et entités externes (2) Exemple d une entité externe <?xml version ="1.0"?> <?xml:stylesheet href=" EntiteExterne.xsl" type="text/xsl"?> <!DOCTYPE catalogue [ <!ENTITY INTER " Internet "> <!ENTITY Obj SYSTEM "OBJ_XML.xml"> ] > <catalogue> <stage> <intitule>xml et les bases de données</intitule> <grp-produit> &INTER; </grp-produit> &Obj; </stage> </catalogue> C est le mot clé SYSTEM qui indique qu il s agit d une référence de type URL Entités prédéfinies Entités* Il existe 5 entités prédéfinies en XML -< < -> > - & & - ' - " " Seuls les caractères < et & sont strictement illégaux en XML - <instruction>if note < 10</instruction>: illégal - <instruction>if note < 10</instruction>: légal Document Type Definition : DTD Un document bien formé est un document qui respecte la syntaxe XML Un document valide est un document bien formé qui respecte la grammaire d une DTD. Une DTD permet donc de spécifier la structure logique d un document L écriture d une DTD est la transposition d un modèle de données (type (yp MCD Merise ou modèle d objets UML) au format XML. La DTD n est pas écrite en XML, elle utilise sa propre syntaxe. Référence à une DTD dans un document XML (1) <!DOCTYPE nom SYSTEM nomfichier.dtd > Exemple : fichier XML: <?xml version= "1.0"?> <?xml:stylesheet href= "DTDExterne.xsl" type="text/xsl text/xsl "?> <!DOCTYPE stage SYSTEM DTDExterne.dtd > <stage> <intitule>apports de XML dans la recherche d information</intitule> <prerequis>connaissance du méta-langage XML</prerequis> </stage> Exemple : DTDExterne.dtd <!ELEMENT stage (intitule, prerequis)> <!ELEMENT intitule (#PCDATA)> <!ELEMENT prerequis (#PCDATA)> Cependant, la définition de la DTD peut se faire dans le document XML

21 Référence à une DTD dans un document XML (2) <?xml version= 1.0?> <?xml:stylesheet href= DTDExterne.xsl type= text/xsl?> <!DOCTYPE stage [ <!ELEMENT stage (intitule, prerequis)> <!ELEMENT intitule (#PCDATA)> <!ELEMENT prerequis (#PCDATA)> ]> <stage> <intitule>apports de XML dans la recherche d information</intitule> <prerequis>connaissance du méta-langage XML</prerequis> </stage> Un document xml peut contenir à la fois une référence à une DTD et une déclaration interne d élément. la déclaration interne est prioritaire pour le parseur Déclaration d une DTD Une déclaration d une DTD peut être interne ou externe Il existe 4 types de déclaration : - des éléments - des listes d attributs - des entités - des notations DTD : Éléments (1) <! ELEMENT livre (titre, editeur?, auteur, chapitre+, prix, critique*) > Cet exemple définit l élément livre suivi de son modèle de contenu : - titre : information obligatoire présente une seule fois - editeur? : cette information est facultative (0,1) - chapitre+ : l élément peut être répété (1,N) - critique* : élément facultatif qui peut être répété (0,N) Déclaration d un élément de données <!ELEMENT nom (#PCDATA) > - l élément nom peut contenir toute donnée XML (y compris des sections littérales) DTD : Éléments (2) Déclaration d un élément à modèle mixte (mixité entre données et éléments) <!ELEMENT chapitre (#PCDATA p exemple )* > - un chapitre peut contenir des données (#PCDATA) et/ou un élément nommé p et/ou un élément nommé exemple. Ces éléments étant facultatifs et pourront apparaître plusieurs fois. Déclaration d un élément libre : ANY <! ELEMENT chapitre ANY> Cette déclaration est pratique en phase de conception car elle permet de définir des structures et de les affiner au fur et au mesure de l avancement du projet. Déclaration d un élément vide : EMPTY <! ELEMENT chapitre EMPTY>

22 DTD : Liste d attributs DTD : déclaration des attributs La déclaration des attributs se fait par : <! ATTLIST nom_élément déclaration_attribut> Six types d attributs t sont reconnus : CDATA ID IDREF ou IDREFS ENTITY ou ENTITIES NMTOKEN ou NMTOKENS NOTATION TOKEN (liste de choix) Quatre types de valeurs par défaut : #REQUIRED : obligatoire #IMPLIED : facultatif # FIXED "Valeur" : valeur fixe "Valeur " : valeur par défaut 85 Fichier XML <?xml version="1.0" encoding="utf-8"?> <?xml-stylesheet type="text/xsl" href="cartes.xslt"?> <!DOCTYPE cartes SYSTEM "carte1.dtd"> <cartes> <personne nom="mkadmi" prenom="abderrazak"> <bureau telephone="(33) " fax="(33) " laboratoire="paragraphe"> <adresse pays="france" rue="2, ruedelaliberté" code_postal="93526" ville="saint-denis"/> </bureau> </personne> </cartes> DTD <?xml version="1.0" encoding="utf-8"?> <!ELEMENT adresse EMPTY> <!ATTLIST adresse pays CDATA #REQUIRED rue CDATA #REQUIRED code_postal CDATA #REQUIRED ville CDATA #REQUIRED > <!ELEMENT bureau (adresse)> <!ATTLIST bureau telephone CDATA #REQUIRED fax CDATA #REQUIRED laboratoire CDATA #REQUIRED > <!ELEMENT cartes (personne)> <!ELEMENT personne (bureau)> <!ATTLIST personne nom CDATA #REQUIRED prenom CDATA #REQUIRED > 86 Futur des DTDs : Schémas XML DTD - N est pas écrite en langage g XML - Typage de données très limité Schéma XML - écrit en langage XML - Typage très riche de données (Booléens, entiers, intervalles de temps ) - Possibilité de créer de nouveaux types de données - Supporte des espaces de - Ne supporte pas les noms espaces de noms - Notion d héritage : les - Ne permet de définir un éléments peuvent hériter du nombre précis contenu et des attributs d un autre élément. d occurrences (sauf *,?, +) XML Schema a un statut de recommandation du 2 mai Noms de domaines (Namespaces) Ils permettent : - de distinguer les éléments et les attributs provenant de différents vocabulaires (jaguar: faune ou automobile?), - de regrouper les éléments et les attributs corrélés de manière à ce que la réutilisation soit plus facile, - de composer des éléments et des attributs (fragments) provenant de différentes sources. Déclaration <élément xmlns:préfixe=uri> 88 22

23 Les quatre commandes de base de XML Schema (1) Quatre commandes de base permettent d écrire un schéma XML : Déclaration de début de schéma; Déclaration d élément ; Déclaration d attribut ; Définition des types. Les quatre commandes de base de XML Schema (2) Déclaration de début de schéma <xsd:schema xmlns:xsd= /2001/XMLS h elementformdefault= qualified > Définition d élément <xsd:element name= element_1 > Définition de Type <xsd:complextype name = element_1 > Déclaration d attribut <xsd:attribute name = unite_taille > Exemple d un schéma XML (1) <?xml version="1.0" encoding="utf-8"?> <xsd:schema xmlns:xsd=" ma" elementformdefault="qualified"> <xsd:element name="etudiant"> <xsd:complextype> <xsd:sequence> <xsd:element name="nom"/> <xsd:element name="prenom"/> <xsd:element name="universite"/> <xsd:element name="niveau"/> </xsd:sequence> </xsd:complextype> </xsd:element> </xsd:schema> Déclaration d un schéma XML (1) Un schéma XML débute par un prologue et est suivi par le corps du document Les déclarations d éléments et d attributs se font à l intérieur i de la balise <xsd : schema> qui est la racine du document Exemple : <xsd : schema xmlns:xsd = " Schema ">.. </xsd : schema> NB : Tout élément appartenant au langage XML Schema doit être préfixé par " XSD: " l espace de nom réservé par le W3C

24 Déclaration d un schéma XML (2) Un schéma XML commence par l ouverture d un élément schema destiné à accueillir la définition des composants d un document XML L élément schema possède +ieurs attributs t destinés à définir i le cadre du schéma XML: attributeformdefault attributs qualifiés ou non par un namespace elementformdefault éléments qualifiés ou non par un namespace finaldefault empêche par défaut la dérivation de type (par restriction ou extension, ou les deux) Id indique un identificateur unique pour le schéma targetnamespace indique un espace de nom cible pour tout élément étranger au vocabulaire de schéma XML Version, xml:lang. L élément schema ne peut être inclus dans aucun élément Déclaration des éléments Exemple <?xml version="1.0" encoding=" ISO "?> <xsd:schema xmlns:xsd=" <xsd:element name="nom" nom type=" xsd:string "/> <xsd:element name="date_naissance " type="xsd:date"/>.. </xsd:schema> Chaque élément déclaré est associé à un type de données via l attribut type, Éléments complexes : éléments pouvant contenir des sous éléments Éléments simples : éléments ne contenant pas des sous éléments Déclaration des attributs Un attribut est un qualificatif qui s applique à un élément Il peut être uniquement de type simple ( éléments) La déclaration d un attribut se fait à la fin des définitions de type complexe Exemple <?xml version="1.0" encoding ="ISO "?> <xsd:schema xmlns:xsd=" <xsd:complexetype name="fichier" > <xsd:attribute name="maj" type=" xsd:date "/> </xsd : complexetype> </xsd:schema> Contraintes sur l attribut Les attributs peuvent avoir des contraintes d occurrences. L élément attribute de XML Schema peut avoir deux attributs t optionnels (USE et VALUE) - USE : définit une contrainte sur l attribut (required, optional, fixed, default ) - VALUE : définit une valeur qui doit être conforme au type déclaré dans l attribut Exemple : <xsd:attribute name =" date-création " type =" xsd:date " USE=" default " VALUE=" "/>

25 XML Schema : les types complexes (1) Le connecteur de séquence : permet de définir un type complexe comportant des suites d'éléments. Il définit une liste ordonnée de sous éléments ( <xsd :sequence> ) Le connecteur de choix : permet de définir un type complexe comportant des éléments variables. Il n'autorise qu'un seul de ses fils soit présent dans le document instance ( <xsd :choice> ) L'élément All : permet à ses éléments fils d'apparaître une fois (ou pas du tout) et dans n'importe quel ordre. ( <xsd :all> ) Gg jj XML Schema : les types complexes (2) Exemple d un connecteur de séquence <?xml version="1.0" encoding="utf-8"?> <xsd:schema xmlns:xs=" elementformdefault="qualified" attributeformdefault="unqualified"> <xsd:element name="etudiant"> <xsd:complextype> <xsd:sequence> <xsd:element name="nom"/> <xsd:element name="prenom"/> <xsd:element name="universite"/> <xsd:element name="niveau"/> </xsd:sequence> </xsd:complextype> </xsd:element> </xsd:schema> XML Schema : les types complexes (3) XML Schema : les types complexes (4) Exemple d un connecteur de choix Schéma XML sous format graphique <?xml version="1.0" encoding="utf-8"?> <xs:schema xmlns:xs=" <xs:element name="contact"> <xs:complextype> <xs:choice> <xs:element name="tel_mobile"/> <xs:element name="tel_fixe"/> <xs:element name="courriel"/> </xs:choice> </xs:complextype> </xs:element> </xs:schema> Exemple d un connecteur All Schéma XML sous format graphique <?xml version="1.0" encoding="utf-8"?> <xs:schema xmlns:xs=" <xs:element name="contact"> <xs:complextype> <xs:all> <xs:element name="nom"/> <xs:element name="prenom"/> <xs:element name="courriel"/> </xs:all> </xs:complextype> </xs:element> </xs:schema> Code XML du schéma

26 XML Schema : Espaces de noms Le support des espaces de noms est une des motivations qui a conduit au développement de XML Schema. Chaque schéma est lié à un espace de nom particulier (ou à l'absence d'espace de nom). Il faut définir au moins un schéma par espace de nom à spécifier L'attribut targetnamespace permet de spécifier l'espace de nom par défaut <xsd :schema xmlns :xsd = " targetnamespace = " > Il est fortement conseillé d'utiliser l'attribut facultatif targetnamespace Types simples et types complexes : différentes déclarations (1) Pour un élément simple qui contient que du texte : <xsd:element name="element1" element1 type="xsd:string" minoccurs="" maxoccurs="" > Pour un élément complexe qui contient que des attributs : <xsd:element name="element1" > <xsd:complextype> <xsd:attribute name="attribut1" type="" /> <xsd:attribute name="attribut2" attribut2 type="" /> <xsd:complextype> </xsd:element> Types simples et types complexes : différentes déclarations (2) Pour un élément complexe qui contient des sous éléments : <xsd:element name="element1" > <xsd:complextype> <xsd:sequence> ou <xsd:choice>ou <xsd:all> <xsd:element name= " s_element1" type="" /> <xsd:element name= " s_element2" type=""/> </xsd:sequence> ou </xsd:choice>ou </xsd:all> <xsd:complextype> </xsd:element> Types simples et types complexes : différentes déclarations (3) Pour un élément complexe qui contient des sous éléments et des attributs: <xsd:element name="element1" > <xsd:complextype> <xsd:sequence> ou <xsd:choice>ou <xsd:all> <xsd:element name= " s_element1" type="" /> <xsd:element name= " s_element2" type="" /> </xsd:sequence> ou </xsd:choice>ou </xsd:all> <xsd:attribute name="attribut1" attribut1 type="" /> <xsd:attribute name="attribut2" type="" /> <xsd:complextype> </xsd:element>

27 Éléments de types complexes mixtes Rappel : un élément mixte est un élément de type Complexe qui contient à la fois du texte (chaîne de caractères) + des attributs et/ou des sous éléments <xsd:element name="element1" > <xsd:complextype mixed= " true" >. <xsd:complextype> </xsd:element> 105 TP1 Créer un langage XML pour décrire des séminaires de formation. Décrire le schéma XML associé à ce langage et une instance de document associé. Énoncé L élément principal définit une formation, qui contient une date, un titre, une société (societe) organisatrice et un programme. Le programme est constitué de chapitres. L élément date est un élément vide contenant les attributs éventuels jour, mois, annee. Les éléments titre,, société (societe) et chapitre contiennent du texte libre. Chaque chapitre est identifié par un attribut précisant le numéro du chapitre (numero). Le schéma XML s appellera formation.xsd et l instance de document formation.xml. 106 TP1 : Correction (1) Schéma XML : formation.xsd <?xml version="1.0" encoding="utf-8"?> <xs:schema xmlns:xs=" elementformdefault="qualified"> <xs:element name="formation"> <xs:complextype> <xs:sequence> <xs:element name="date"> <xs:complextype> <xs:attribute name="jj type= xs:gday /> <xs:attribute name="mm type= xs:gmonth /> <xs:attribute name="aaaa type= xs:gyear /> </xs:complextype> </xs:element> <xs:element name="titre"/> 107 TP1 : Correction (1) suite <xs:element name="societe /> <xs:element name="programme"> <xs:complextype> <xs:sequence> <xs:element name="chapitre"> <xs:complextype mixed= true > <xs:attribute name="numero"/> </xs:complextype> </xs:element> </xs:sequence> </xs:complextype> </xs:element> </xs:sequence> </xs:complextype> </xs:element> </xs:schema>

28 TP1 : Correction (2) Document XML : formation.xml <?xml version="1.0 0" encoding="utf-8"?> <formation xmlns:xsi=" xsi:nonamespaceschemalocation=«formation.xsd"> <titre>xml formation</titre> <societe>enssib</societe> <programme> <chapitre numero="01">présentation générale de XML</chapitre> <chapitre numero="02">dtd et Schémas XML</chapitre> <chapitre numero="01">xslt</chapitre> </programme> <date jour="01" mois="12" annee="2002"/> </formation> 109 TP2 Créer un langage XML pour décrire une arborescence de fichiers. Décrire le schéma XML associé à ce langage et une instance de documents associé. Énoncé L élément principal définit une racine, qui peut contenir des répertoires (repertoire) et/ou des fichiers. Un répertoire peut contenir des répertoires (repertoire) et/ou des fichiers. Répertoires et fichiers peuvent contenir du texte libre. L élément répertoire doit contenir les attributs nom (ex : nom= «XML»), date_modif (ex : date_modif= « »), heure_modif (ex : heure_modif= «14 :14»). L élément fichier doit contenir les attributs taille (ex : taille= «246»), unite_taille taille (ex : unite_taille= taille= «KO») nom (ex : nom = «formation.xml»), date_modif (ex : date_modif = « »), heure_modif (ex : heure_modif= «14 :14»). Les valeurs possibles pour unite_taille sont KO, MO. Le schéma XML s appellera Arborescence.xsd et l instance de document Arborescence.xml. 110 TP2 Document XML : arborescence.xml <?xml version="1.0" encoding="iso "?> <?xml-stylesheet type="text/xsl" href="arborescence.xslt"?> <racine xmlns:xsi=" xsi:nonamespaceschemalocation="arborescence.xsd"> <repertoire nom="xml" date_modif= modif=" " heure_modif="14:12:12.444"> XML (exemples, outils, spécifications,...) <repertoire nom="exemples" date_modif=" " heure_modif="14:14:12.111">exemples de fichiers XML </repertoire> </repertoire> <fichier nom="séminaire.xml" taille="2" unite_taille="go" date_modif=" " heure_modif="14:12:32.213">description XML du cours CXML</fichier> <fichier nom="xmlspy.xml" taille="2" unite_taille="go" date_modif=" " heure_modif="15:12:23.654"/> <repertoire nom="outils" date_modif=" " heure_modif="16:09:12.342"> <fichier nom="xmlspy.exe" taille="8" unite_taille="mo" date_modif=" " heure_modif="12:12:10.643">version d'évaluation</fichier> </repertoire> </racine> 111 TP2 : Correction (2) : schéma XML <?xml version="1.0" encoding="utf-8"?> <xs:schema xmlns:xs=" elementformdefault="qualified"> <xs:element name="racine"> <xs:complextype> <xs:choice maxoccurs="unbounded"> unbounded <xs:element ref="repertoire"/> <xs:element ref="fichier"/> </xs:choice> </xs:complextype> </xs:element> <xs:element name="repertoire"> <xs:complextype mixed="true"> <xs:choice minoccurs="0" maxoccurs="unbounded"> <xs:element ref="repertoire"/> <xs:element ref="fichier"/> </xs:choice> <xs:attribute name="nom" use="required"/> <xs:attribute name="date_modif" type="xs:date"/> <xs:attribute name="heure_modif" type="xs:time" use="required"/> </xs:complextype> </xs:element>

Montrer encore