<fournisseur>
Barton&Guestier
</fournisseur>
Rendu typique en navigateur : 
Copyright © 2021-2022 Yves MARCOUX; dernière modification de cette page : 2022-01-04.
INU3011 Documents structurés – Premier Tour d’horizon de XML
Index de ce texte — Index général du Tour d’horizon — Accueil du Tour d’horizon
Yves MARCOUX - EBSI - Université de Montréal
Notes :
Ce Tour d’horizon est truffé d’exemples de fichier texte. Lorsqu’on donne un
exemple de fichier texte, on en présente simplement le contenu, en
police à chasse fixe (i.e. de type machine à écrire), un peu en
retrait de la marge gauche :
Ceci est un exemple de fichier texte.
Certains caractères dans un fichier texte ne produisent aucune trace visible à l’écran, par exemple l’espace et le saut de ligne. On appelle ces caractères des caractères blancs ou simplement des blancs; la tabulation est un autre exemple. Dans nos exemples, les seuls blancs utilisés sont l’espace et le saut de ligne.
En général, l’emplacement des blancs dans nos exemples n’a pas d’importance, mais, à l’occasion, nous les mettons en évidence en représentant les espaces par ¤ et les sauts de ligne par ⤶ :
¤¤Voici¤un¤autre¤⤶
¤exemple¤avec¤¤espaces¤¤et¤sauts¤de⤶
ligne¤en¤évidence.
Les caractères qui ne sont pas blancs sont dits non blancs. Dans un fichier texte, les caractères non blancs sont ceux qui produisent quelque chose de visible à l’écran ou sur papier lorsqu’on visualise le fichier ou qu’on l’imprime.
Un document XML est aussi un fichier texte
Tout document XML est aussi un fichier texte. Les exemples de document XML sont donc présentés comme les exemples de fichier texte :
<exemple>
<titre>Exemple de document XML</titre>
<corps>Ceci est un exemple de
document XML.</corps>
</exemple>
Le premier caractère de ce document est un "<", le deuxième est un
"e", etc., jusqu’au dernier qui est un ">". Il faut nous
croire sur parole pour le moment, mais ce document est bel et bien un document
XML.
Encore ici, il peut arriver que l’on mette en évidence espaces et sauts de ligne :
<exemple>¤¤⤶ ¤¤<titre>Exemple¤de¤document¤XML</titre>⤶ ¤¤<corps>Ceci¤est¤un¤exemple¤de¤⤶ ¤¤¤¤document¤XML.</corps>⤶ </exemple>¤
Les exemples erronés sont habituellement présentés en rouge :
<mauvais>Document mal formé.</pas-bon>
ou parfois, le rouge est utilisé pour attirer l’attention sur les parties en erreur :
<mauvais>Document mal formé.</pas-bon>
Le gras et/ou d’autres couleurs que le rouge sont parfois utilisés pour mettre en évidence certaines parties (correctes) d’un document :
<fournisseur>
Barton&Guestier
</fournisseur>
Évidemment, ces présentations particulières ne se retrouvent pas dans le document XML comme tel, qui n’est qu’un fichier texte, ne contenant donc que des caractères sans aucun attribut de présentation.
En général, un exemple est suivi d’un lien cliquable menant au fichier source de l’exemple, de même que d’une image illustrant un rendu typique de l’exemple lorsque ouvert dans un navigateur Web :
<fournisseur> Barton&Guestier </fournisseur>Rendu typique en navigateur :
Dans un contexte d’apprentissage, il y a deux choses intéressantes à faire avec un exemple de document XML :
Dans le contexte du Tour d’horizon, ces deux façons d’interagir avec les exemples correspondent à deux niveaux d’engagement du lecteur, et donc à deux modes de lecture. Nous appelons ces modes lecture de base et lecture active.
La lecture de base peut constituer une bonne préparation à la lecture active ou être utile comme révision. Cependant, nous recommandons fortement de faire au moins une lecture active de chaque texte du Tour d’horizon.
Il est à noter que la lecture active requiert l’utilisation d’un ordinateur, alors que la lecture de base peut être effectuée sur une tablette ou un téléphone (voire même avec une copie imprimée des textes). La lecture active requiert également le logiciel oXygen, qui peut être installé sans frais sur votre machine personnelle, et qui est aussi déjà installé sur les postes des Laboratoires de l’EBSI.
Pour vous permettre de faire facilement la première opération, soit celle d’ouvrir les exemples en navigateur, on fera suivre chaque exemple d’un lien cliquable vers un fichier XML dont le contenu est exactement celui de l’exemple. Pour l’exemple ci-dessus, cela donnerait ceci :
<fournisseur>
Barton&Guestier
</fournisseur>
Si vous cliquez sur le lien (allez-y, essayez-le, puis revenez à ce texte en cliquant sur le bouton Reculer ou Back de votre navigateur), vous obtiendrez quelque chose comme ceci :
Si votre navigateur n’affiche que "Barton&Guestier" ou une page entièrement blanche, c’est probablement que vous utilisez un appareil mobile; nous reviendrons à ce cas sous peu.
L’affichage ci-dessus est celui qu’on obtient avec Firefox. Si vous utilisez un autre navigateur, l’affichage sera sûrement un peu différent. Il se peut qu’il n’y ait pas de message avant le document lui-même, ou que le message soit en anglais. Il se peut aussi que le document comme tel soit précédé de cette ligne :
<?xml version="1.0"?>
Ces éventuels ajouts n’indiquent pas d’erreur et peuvent être allègrement ignorés. Le reste de l’affichage correspond à l’interprétation que fait le navigateur du document et ce rendu ne varie pas beaucoup d’un navigateur à l’autre.
Interprétation par les navigateurs, coloration syntaxique
Le rendu en navigateur ressemble au contenu du document XML en tant que fichier texte, mais certains détails révèlent clairement qu’il s’agit d’une interprétation, et non d’une restitution caractère par caractère du document. Sans entrer dans les détails pour le moment, on note par exemple que :
&" est ramenée à une simple
esperluette (&).Si on demande l’affichage de la source du document (Clic-droit → Code source de la page), on retrouve le contenu exact, non interprété, du document XML en tant que fichier texte (sauf pour la coloration syntaxique, qui est aussi appliquée lors de l’affichage de la source).
Lecture sur tablette ou téléphone
Si après que vous ayez cliqué sur le lien vers l’exemple ci-dessus votre navigateur n’affichait que "Barton&Guestier" et rien d’autre, c’est probablement que vous lisez ce texte sur une tablette ou un téléphone. En effet, les navigateurs des dispositifs mobiles sont en général incapables d’afficher des documents XML sans feuille de style (ils réussissent cependant très bien avec une feuille de style). Or, la plupart des exemples du Tour d’horizon (y compris celui ci-dessus) sont sans feuille de style.
Si vous lisez sur une tablette ou un téléphone, les liens vers les exemples sont donc de peu d’utilité. Pour cette raison, nous avons décidé d’inclure avec chaque exemple non seulement un lien cliquable vers l’exemple, mais aussi une image montrant un rendu typique de l’exemple en navigateur. Toujours avec le même exemple, cela se présenterait donc comme suit :
<fournisseur> Barton&Guestier </fournisseur>Rendu typique en navigateur :
Vous remarquerez que nous éliminons de ces rendus les messages et autres ajouts faits par les navigateurs, pour ne montrer que le document comme tel.
Rappel : À ce point-ci, la capsule vidéo d’introduction à oXygen devrait avoir été visionnée.
La façon la plus simple de réaliser la lecture active que nous recommandons est d’ouvrir le logiciel oXygen en parallèle avec le navigateur Web que vous utilisez pour lire le texte. Quand vous rencontrez un exemple, plutôt que de cliquer sur le lien, vous faites Clic-droit sur celui-ci, puis choisissez Copier l’adresse du lien, ou l’item équivalent dans votre navigateur. Cela placera dans le presse-papier l’adresse du document XML dont le contenu est identique à l’exemple. Vous basculez ensuite vers oXygen (Alt+Tab) et, là, vous faites Fichier… → Ouvrir l’URL…, puis vous collez le contenu du presse-papier (Ctrl+V) dans la zone de saisie de l’URL. Vous terminez le tout en cliquant sur OK. oXygen récupérera le fichier exemple directement de son emplacement sur le Web et l’ouvrira dans une fenêtre d’édition.
Reprenons une à une les étapes à faire :
Si vous êtes en mesure d’expérimenter cette procédure, faites-le maintenant avec ce nouvel exemple :
<liste>Voici deux items:<item>1</item><item>2</item></liste>Rendu typique en navigateur :
Le document sera ouvert dans une fenêtre d’édition d’oXygen qui, minimisée, aurait l’air de ceci :
Comme vous pouvez voir, le titre de la fenêtre, dans le haut complètement, indique l’adresse (URL) d’où le document a été récupéré. Vous pouvez constater également qu’oXygen ne réarrange pas le texte à l’intérieur du fichier : les espaces et saut de ligne dans le document sont respectés. Si vous regardez attentivement, vous verrez aussi qu’oXygen applique une coloration syntaxique au document, comme les navigateurs Web.
Modifier un exemple
Dans oXygen, vous pouvez modifier le document autant que vous voulez. Il est normal qu’à ce stade-ci, vous n’ayez guère d’idée de modifications intéressantes ou significatives. Dans l’apprentissage des règles syntaxiques de XML, ce sera un excellent moyen de vérifier votre compréhension.
Voici un exemple de modification possible que vous pouvez essayer :
deux" en double-cliquant dessus.nombre.Vous obtiendrez ceci :
Si vous voulez voir de quoi a l’air le document modifié en navigateur, il faut d’abord le sauvegarder localement :
.xml.Une fois la sauvegarde effectuée, vous avez deux possibilités pour ouvrir l’exemple modifié en navigateur :
Dans les deux cas, en supposant que le navigateur soit Firefox, voici ce que vous obtiendriez :
S’il s’agit d’un autre navigateur, le rendu serait légèrement différent.
Vous pouvez bien sûr expérimenter avec vos propres exemples, créés à partir de zéro plutôt que dérivés de ceux du cours. Pour créer un tout nouveau fichier XML avec oXygen, faites simplement :
Fichier → Nouveau… → Nouveau document → Document XML → Créer
Vous vous retrouverez avec une fenêtre d’édition presque vide :
La ligne qu’oXygen a déjà insérée dans le document est ce qu’on appelle une « déclaration XML ». C’est une construction syntaxique qui n’est pas couverte dans le Premier tour d’horizon, parce qu’inutile dans ce contexte. Vous pouvez donc simplement la supprimer, par exemple en faisant Ctrl+A (pour tout sélectionner) puis en appuyant sur la touche Del.
Ensuite, tapez ou copiez-collez à partir d’une autre application le contenu voulu pour le document. Pour cette première expérience, copiez-collez le texte suivant directement à partir de votre navigateur Web :
<exemple> <titre>Exemple</titre> <auteur>Jean-Pierre</auteur> </exemple>
Vous obtiendrez ceci :
Pour visualiser en navigateur votre document, vous devez d’abord – comme vous l’avez fait ci-dessus en modifiant un exemple du cours – sauvegarder le document (Fichier → Enregistrer sous…), puis l’ouvrir en navigateur soit à partir de l’explorateur de fichiers, soit directement d’oXygen (Fichier → Afficher dans le navigateur/application système).
Si le navigateur est Firefox, voici ce que vous obtiendrez :
Au moins une fois dans sa vie, il faut avoir créé un document XML avec un simple éditeur de fichiers texte, comme Bloc-notes sous Windows ou TextEdit sous Mac. C’est tout à fait possible, puisqu’un document XML n’est à la base qu’un fichier texte. Pourquoi ne pas l’essayer dès maintenant ?
.xml.Repérez votre fichier dans l’explorateur de fichiers, puis ouvrez-le avec le navigateur de votre choix (Clic-droit → Ouvrir avec) ou avec le navigateur par défaut pour les fichiers XML (Double-clic). Admirez le résultat !
Il est aussi tout à fait possible d’ouvrir votre document à partir d’oXygen (Fichier → Ouvrir…) et de continuer à travailler dessus dans cet outil si vous le désirez.