Index des revues

  • Index des revues
    ⇓  Autres articles dans la même rubrique  ⇓

    De SGML à HTML

    Une histoire de balises

    Par Dominique Lahary, Bibliothèque départementale du Val-d'Oise

    SGML

    Principe

    (1) SGML (2) permet de codifier la structure logique d'un document, son découpage en éléments constituant qui, le cas échéant, s'imbriquent les uns dans les autres. Cela permet à partir d'un même stockage électronique, de décliner une gamme de produits sur divers supports : papier, cédérom, accès en ligne.

    Grâce à des normes associées, SGML est un outil d'échange. Il est également en train de devenir un outil de gestion de base de données car il permet de construire des accès sur des points donnés d'un document structuré et d'en gérer l'affichage d'éléments donnés.

    SGML permet enfin de créer des liens internes (comme les appels de notes) et des liens entre documents, ce qui le rend apte à gérer le multimédia ainsi que l'hypertexte et l'hypermédia. Ainsi, Hy-Time, extension hypermédia de SGML, permet de gérer la synchronisation temporelle entre documents (y compris le son et l'image animée et sonorisée).

    Comment fonctionne SGML ?

    SGML repose sur un système de balisage des données selon une structure arborescente. Chaque élément logique du document est désigné par une balise qui est un code dont on décide qu'elle sera présente (-) ou omise (0) en début et/ou fin d'élément. Chaque élément peut se subdiviser en d'autres éléments eux-mêmes subdivi-sables, etc. La composition d'un élément en différents éléments de niveau immédiatement inférieur dans l'arborescence s'exprime à l'aide :

    • de connecteurs :
      • , (les éléments doivent figurer dans l'ordre indiqué)
      • & (l'ordre des éléments est quelconque)
      • I (un seul élément doit figurer parmi ceux cités entre deux barres verticales)
    • d'indicateurs d'occurrence :
      • ? (l'élément est facultatif)
      • «(l'élément est facultatif et répétable)
      • + (l'élément est obligatoire et répétable) (par défaut, un élément est obligatoire et non répétable)

    Voici un exemple fictif de structure HTML:

    Vignette de l'image.Illustration
    Exemple fictif de structure HTML

    où un chapitre comprend un titre obligatoire et unique, un préambule unique et facultatif, des recettes obligatoires et multiples, comprenant un titre et une partie ingrédients obligatoires et non répétables et des paragraphes obligatoires éventuellement multiples, etc.

    L'exemple cité, qui ne comprend pas de données mais ne fait qu'indiquer une structure, est une DTD (définition de type de document ou document type definition). Chaque DTD définit une structure propre à un type de document. Il existe des DTD qui sont des normes, ou des standards reconnus, d'autres propres à un utilisateur.

    Cette DTD permet de représenter un document suivant le principe suivant :

    Vignette de l'image.Illustration
    DTD

    On voit que la reconnaissance de la struc-ture repose sur des balises ou marqueurs.La plupart des balises fonctionnent parcouple : une balise de début, une balisede fin.

    La balise <chapitre> proclame : «atten-tion, un chapitre commence». Et ondemeure dans celui-ci tant que la balise</chapitre> n'a pas proclamé : attention,ce chapitre est terminé ».

    On voit également que la structure estarborescente : un livre comprend deschapitres qui comprennent des sectionsqui comprennent des paragraphes, etc. Lesystème des balises de début et de finpermet d'emboîter aisément ces compo-sants.

    SGML et les normes

    L'ISO, qui avait reconnu SGML comme norme (ISO 8879), a adopté en 1994 les trois DTD de l'AAP (3) concernant respectivement les livres, les publications et séries et les articles de périodiques (ISO 12083). Cette norme est traduite en français (4) , mais les codes de balise y demeurent en anglais.

    HTML

    HTML (5) est le format d'écriture des pages Web. Originellement, une telle page ne comprend que des indications de structure, susceptibles d'être interprétées différemment selon les navigateurs : c'est le client qui gère l'apparence physique du document. Mais on assiste à une évolution tendant à rapprocher les fonctionnalités de HTML de celles des traitements de texte, et les indications de mise en forme sont de plus en plus prégnantes : les créateurs d'information veulent maîtriser son apparence.

    Une page HTML est un fichier. Il est d'usage de le nommer en lui donnant comme extension htm ou html. Dans l'exemple que nous développerons ci-dessous, nous écrirons le fichier crevette.htm.

    Structure générale

    HTML utilise le principe de balisage de SGML et ses différentes versions constituent autant de DTD.

    Une page HTML commence normalement par la balise <HTML> et se termine par </HTML>

    Elle est composée d'un en-tête (HEAD) et un corps (BODY). L'en-tête comprend au moins un titre (TlTLE), qui sera affiché sur l'écran de l'interrogateur en haut de la fenêtre de son navigateur. Quant au corps, il comprend la page proprement dite et d'éventuelles données de traitement.

    La structure générale est donc la suivante :

    Vignette de l'image.Illustration
    Structure générale

    Les balises de mise en forme

    Un certain nombre de balises permettent de donner une certaine forme au texte.

    On peut par exemple déterminer des titres de tailles différentes. C'est l'objet des balises <Hl> (la taille la plus grande) à H6 (la plus petite).

    Exemple:

    Vignette de l'image.Illustration
    Exemple

    Comment aller à la ligne ? En utilisant au choix les balises <P> et </P> (paragraphe suivi d'une ligne inoccupée), <BR> (saut de ligne), <HR> (saut de ligne et trait horizontal).

    Vous voulez faire apparaître du texte en italique ? Utilisez les balises <1> et </I>. En gras ? <B> et </B> :

    Vignette de l'image.Illustration
    Balise pour mettre en gras

    Pour centrer un texte, il suffit d'utiliser <CENTER> et </CENTER> :

    Vignette de l'image.Illustration
    Balise pour centrer

    On peut également dresser des listes : les balises <UL> et </UL> encadrent celle-ci, et chaque élément est introduit par <LI> :

    Vignette de l'image.Illustration
    Balise pour dresser des listes

    Suivant le même principe, on peut établir des tableaux à plusieurs lignes et colonnes.

    Les liens

    Tout élément de texte peut être utilisé pour créer un lien vers un autre fichier ou un autre endroit du même fichier.

    On utilise pour cela les balises <A HREF="xxx">yyy</A>, où xxx est l'adresse du fichier vers lequel on établit le lien et yyy l'élément, dit ancre, à partir duquel le lien est établi. S'agissant de texte, l'ancre apparaît généralement soulignée et l'utilisateur n'a qu'à cliquer pour accéder au fichier lié.

    Pour établir un lien vers un autre site, il faut en faire figurer l'adresse entière :

    Vignette de l'image.Illustration
    Balise pour établir un lien

    Mais si le fichier cible est sur le même site, on se contentera d'une adresse dite relative :

    Vignette de l'image.Illustration
    Adresse dite relative

    Dans le premier exemple, http est le protocole propre au World Wide Web. Mais on peut établir un lien avec un autre protocole, par exemple Telnet, pour interroger directement un catalogue de bibliothèque qui ne dispose pas d'interface appropriée.

    Pour insérer une image dans une page, on établit un lien avec le fichier la contenant, par la balise <IMG> contenant le nom de ce fichier :

    Vignette de l'image.Illustration
    Balise pour insérer une image

    On peut faire de cette image l'ancre de départ d'un lien. Il suffit d'encadrer l'expression par les balises de lien :

    Vignette de l'image.Illustration
    Balise de lien

    L'image peut être fixe, mais aussi animée (une séquence vidéo) et on peut également insérer du son.

    Les entités

    HTML ne gère en principe qu'un jeu limité de caractères, et les lettres accentuées doivent être remplacées par des entités codées. C'est ainsi que : é est représenté par &eacute; ê par &ecirc; à par &agrave;

    Mais certains navigateurs interprètent correctement les caractères accentués sans qu'il soit besoin de les remplacer par ces codes.

    Exemple

    Nous en savons maintenant assez pour écrire la page suivante :

    Vignette de l'image.Illustration
    Page d'exemple

    Cette page pourra être ainsi interprétée par le navigateur :

    Vignette de l'image.Illustration
    Crevettes frites au gingembre : affichage par le navigateur

    HTML et les bases de données

    On rencontre de plus en plus de bases de données directement interrogeables sur le World Wide Web. Pour qu'une base soit ainsi accessible, il faut qu'une interface, dite CGI (common gateway interface), ait été programmée.

    Le site adresse aux utilisateurs une page HTML de type formulaire, qui comprend des cases dans lesquelles une requête peut être saisie, et éventuellement des cases à cocher ou des sélections à effectuer en cliquant sur un menu déroulant.

    Le serveur reçoit une question, la transmet à la base de données et traduit sa réponse en page HTML. Celle-ci n'est pas un fichier statique, stockée tel quel sur le serveur : elle a été générée à l'occasion de la requête. Elle peut, le cas échéant, contenir des images, du son et des ancres créant des liens vers des documents, mais aussi relançant une requête.

    Java

    Dernier développement, les pages HTML peuvent contenir de petits programmes appelés applets que le navigateur, s'il sait les interpréter, va exécuter sur le poste client. Ceci grâce au langage Java, lancé par Sun en 1995, ou une variante simplifiée Javascript.

    Ces applets permettent d'animer les pages, en faisant défiler du texte, en déplaçant ou modifiant une image, mais aussi d'opérer des traitements comme la conversion de devises ou la génération de calendriers. Au-delà de ces exemples dont certains peuvent paraître futiles, Java apparaît comme un langage indépendant des matériels et systèmes d'exploitation souvent présenté comme extrêmement prometteur.

    HTML est-il un standard?

    Inventé par Tim Berners Lee au CERN de Genève, HTML est géré par le World Wide Web Consortium (W3C), organisme international comprenant un certain nombre d'acteurs du World Wide Web, dont des entreprises privées. Le W3C est responsable de l'évolution du langage et en publie les versions successives. HTML 2.0 est encore, au début de 1997, la version la plus répandue, et la dernière en date est la version HTML 3.2.

    Parallèlement à cette évolution officielle, quoi que ne relevant d'aucun organisme de normalisation proprement dit, HTML fait l'objet d'aménagements privés, appelés extensions, notamment des deux principaux fournisseurs de navigateur : Netscape pour Netscape Navigator et Microsoft pour Internet Explorer. Certaines extensions sont correctement interprétées par plusieurs navigateurs, d'autres par un seul. On ne peut que souhaiter le respect d'un standard commun, par les éditeurs de navigateurs comme par ceux de sites Web.

    1. Cette première partie relative à SGML doit beaucoup à Catherine Lupovici qui vint présenter SGML à l'Observatoire de l'information bibliographique de l'ABF le 28 mars 1995. retour au texte

    2. SGML : Standard Generalized Mark-up Language (langage normalisé et généralisé de balisage). retour au texte

    3. AAP : American Association of Publishers. retour au texte

    4. Disponible à l'AFNOR : NF Z 71-010 (décembre 1990), 690 F. retour au texte

    5. HTML : Hyper Text Mark-up Language (langage de balisage hypertexte). retour au texte