HyperText Markup Language
Extensible HyperText Markup Language
HTML - XHTML
1
HTML : HyperText Markup Langage
• HTML (HyperText Markup Language) est un langage de
balisage essentiel pour structurer les documents sur le web.
• Il permet d’organiser le contenu en sections, de définir des titres,
des paragraphes, des listes, des liens, etc.
• En structurant les informations de manière cohérente, HTML
facilite l'interprétation des documents par les navigateurs et les
moteurs de recherche, rendant le contenu accessible et navigable.
• Tout comme XML (eXtensible Markup Language), qui est
utilisé pour représenter des données de manière hiérarchisée et
indépendante des plateformes, HTML offre un cadre qui
organise les documents de manière à les rendre lisibles et
exploitables par les machines, bien qu'il soit spécifiquement
adapté pour le web et l'affichage visuel des pages.
2
HTML : HyperText Markup Langage
⚫ Inventé par Tim Berners-Lee au CERN pour faciliter l’échange de
documents de recherche entre chercheurs de différentes universités.
▪ Recommandations du W3C (World Wide Web Consortium)
• HTML 1.0 : 1991-1993 (texte, hyperliens)
• HTML 2.0 : novembre 1995 (images, formulaires)
• HTML 3.2 : janvier 1997 (tableaux et éléments de présentation)
• HTML 4.0 : décembre 1997 (feuilles de style et cadres)
• HTML 4.01 : décembre 1999 (amélioration de HTML 4.0)
• XHTML 1.0 : janvier 2000 - W3C Recommendation
(reformulation de HTML à l’aide du balisage XML)
• XHTML 2.0 - W3C Working Draft 26 July 2006
3
HTML : HyperText Markup Langage
• HTML5 : Janvier 2008 - Web applications du WHATWG
(Working Draft)
• HTML5 : October 2014 - W3C Recommendation
https://www.w3.org/TR/2018/SPSD-html5-20180327/
• HTML 5.1 : W3C Recommendation, 1 November 2016
https://www.w3.org/TR/2016/REC-html51-20161101/
• HTML 5.2 - W3C Recommendation, 14 December 2017
https://www.w3.org/TR/2017/REC-html52-20171214/
• HTML5 - A vocabulary and associated APIs for HTML and
XHTML W3C Recommendation 28 October 2014 superseded 27
March 2018
• HTML - Living Standard — Last Updated 24 November 2021
https://html.spec.whatwg.org/multipage/
4
HTML : HyperText Markup Langage
▪ Fondé en particulier sur la notion de lien hypertexte,
→ Hyper # linéaire
→ naviguer librement et confortablement d'une page à une
autre.
▪ Utilise un balisage descriptif et procédural
→ Mélange la structure logique (ex. <h1> et <p>) et les
aspects d’affichage (ex. <i> et <b>) des documents.
▪ Portabilité
→ Basé sur format texte
5
HTML et SGML
▪ HTML suit une norme spécifiée par une DTD
(Document Type Definition) SGML qui détermine la
structure et la syntaxe du document HTML.
▪ SGML (Standard Generalised Markup Langage) :
• Métalangage : permet de définir des langages de
balisage (comme HTML et XML).
• Décrit la structure des documents (et non pas leur
forme)
6
HTML/XHTML - DOCTYPE
➢ Au début du document HTML, on déclare
le type de document "DOCTYPE "
➢ HTML 4.01 :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
➢ XHTML :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
strict.dtd">
Permet de déterminer la version du langage utilisé
➢ HTML 5 :
<!DOCTYPE html>
Ne change pas : Living standard
7
HTML/XHTML - DOCTYPE
⚫ En HTML5, la déclaration <!DOCTYPE html> est simplement un
déclencheur de mode standard pour les navigateurs.
Elle n'implique pas l'inclusion d'une DTD.
C'est une déclaration minimale qui n'a pas besoin de faire référence à
un fichier externe, contrairement aux déclarations SGML utilisées dans
XHTML et les anciennes versions de HTML (comme HTML 4.01).
⚫ HTML5 a été développé pour être plus simple, flexible et indépendant
de SGML, avec un modèle de parsage propre qui facilite l'affichage et
l'interopérabilité entre navigateurs.
8
DOCTYPE
<! Indique le début d'une instruction
SGML
DOCTYPE Nom de l'instruction
HTML Nom du premier élément du document
désigné
PUBLIC Méthode de résolution du FPI qui suit
<!DOCTYPE html PUBLIC FPI
"-//W3C//DTD XHTML 1.0
Strict//EN">
> Fin de l'instruction
9
DOCTYPE - FPI
• La référence à une DTD particulière s'appelle "formal public identifier" ou FPI
• C'est l'identificateur public qui fait la résolution vers la DTD désignée.
• Voici la syntaxe du FPI deHTML tel que décrit dans la norme ISO 8879 –
SGML
• Le FPI doit être inséré au tout début du fichier HTML dans l'instruction
SGML <!DOCTYPE> pour être valide.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">
<html> …</html>
10
Structure d’un document HTML/XHTML
La partie d'un fichier HTML où on insère cette référence à une DTD se nomme
"le prologue"
Le reste du document se nomme "l’instance"
Prologue <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN">
<html>
<head>
<title>…</title> Entête
Instance </head>
<body>
… Corps
</body>
</html>
11
Structure d’un document HTML/XHTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
<HTML>
<HEAD>
<TITLE>Ceci est le titre de ma page Web</TITLE>
<META name="author" content="…" >
<META name="description" content="…" >
<META name="keywords" content="…" >
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK REL=stylesheet TYPE="text/css" HREF="styles.css">
</HEAD>
<BODY>
<H1>Titre du document</H1>
<H2>Sous-titre de niveau 2</H2>
<P>Paragraphe
<P>Paragraphe
<H2>Sous-titre de niveau 2</H2>
<P>Paragraphe
</BODY>
</HTML>
12
Structure d’un document HTML/XHTML
<HTML>
<HEAD> <BODY>
<TITLE> <META> <LINK> <H1> <H2> <P> <P> <H2> <P>
13
Structure d’un document HTML/XHTML
14
Structure d’un document HTML/XHTML
• L’élément HTML chapeaute tout le document, qui doit
commencer par l’étiquette <HTML> et se terminer par
l’étiquette </HTML>
• Le document comprend deux parties :
▪ l’entête : <HEAD> </HEAD>
▪ (information sur le fichier html)
▪ le corps : <BODY> </BODY>
▪ (contenu du fichier html)
15
En-tête du document : HEAD
• Les informations incluses dans l’en-tête sont ignorées par les navigateurs lors de
l’affichage de la page Web
• L’en-tête peut inclure les éléments suivants :
- Le Titre : <TITLE> </TITLE>
- obligatoire.
- Apparaît sur la barre de titre du navigateur comme titre de la page
Web
- Les metadonnées : <META> (pas d’étiquette finale).
- Optionnelles
- Servent à l’indexation (référencement) de la page Web
16
En-tête du document : HEAD
• Exemple d’en-tête :
<HEAD>
<TITLE> Page d’accueil du cours…</TITLE>
<META name="author" content="…" >
<META name="description" content="…" >
<META name="keywords" content="…" >
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<LINK REL=stylesheet TYPE="text/css" HREF="styles.css">
</HEAD>
17
Balises META
▪ Servent au référencement. Fournissent des meta- informations qui permettent
aux moteurs de recherches de mieux indexer la page Web :
<meta name='title' content='Titre de votre document'>
<meta name='description' content='description'>
<meta name='keywords' content='mots, clés, séparés, par, des, virgules'>
<meta name='author' content='Votre_Nom'>
<meta name='copyright' content='Copyright_depot'>
<meta name='identifier-url' content='http://www.votre_site.net'>
<meta name=robots' content='all'>
▪ Permettent aussi de spécifier :
▪ Le jeux de caractères (l’encodage) adopté :
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
▪ La langue du document :
<meta http-equiv='content-language' content='fr'>
⚫ La Référence à une feuille de style au moyen de l’étiquette <LINK>:
<LINK REL=stylesheet TYPE="text/css" HREF="
18
Corps du document : BODY
➢ L’élément <BODY></BODY>:
• Englobe le contenu de la page Web (ce qui est affiché par le
navigateur)
• Introduit le corps d'un document HTML par son étiquette d’ouverture
et le termine par son étiquette de fermeture
• Permet de définir l'aspect général du document : couleur du texte,
couleur des liens, fond du document…
➢ Attributs de l’étiquette <BODY>
• bgcolor ="couleur" : permet de définir une couleur d'arrière plan.
• background ="…" : permet de spécifier l’URL de l’image de fond
• text="couleur" : couleur du texte.
• link="couleur" : couleur des liens avant activation.
• alink="couleur" : couleur des liens lorsqu'ils sont actifs.
• vlink="couleur" : couleur des liens visités.
19
Eléments
• Un élément est une suite d’entités HTML délimitée par
des étiquettes (balises ou "tags" en anglais) et représente une
unité structurelle du document : titre, liste, paragraphe, ...
1. une étiquette initiale : <NOM-ELEMENT>
2. un contenu (éventuellement vide)
3. une étiquette finale </NOM-ELEMENT>
• Exemple :
<H1> contenu </H1>
• Le nom d’un élément est insensible à la casse
• Certaines étiquettes finales sont optionnelles, d’autres
indispensables, d’autres proscrites (selon la DTD adoptée).
20
Attributs
• Les attributs sont des propriétés ou options possibles pour un
élément.
• Prennent des valeurs par défaut ou définies explicitement
• La valeur est définie par : NOM-ATTRIBUT=valeur
• Les paires attributs/valeurs apparaissent avant le signe ”>” de
l’étiquette de début d’un élément
• Plusieurs paires attributs/valeurs (autorisées dans l’élément)
peuvent apparaître (séparées par des espaces)
– Exemples :
<IMG src="rabat.gif" alt="une photo de Rabat">
<HTML lang="fr"> Information </HTML>
• Il existe des attributs "booléens"
<OPTION selected>
21
Attributs
Les attributs suivants sont applicables à presque tous
les éléments HTML :
• CLASS / ID : indique le nom ou le style à appliquer
(exemple: class="monSyle").
• LANG : indique le code de langage ISO à utiliser
(exemple: lang="fr").
• STYLE : définit le style (exemple: style="font-
family: arial; font-size: 10px"
• TITLE : crée une info-bulle lorsque la souris survol
le texte (exemple: title="aide").
22
Commentaires
• On peut insérer des commentaires dans le code source
d’un document HTML.
• Les commentaires n’apparaissent pas à la visualisation
• Aident à bien organiser et contrôler le code
Exemple :
<!-- Ceci est un commentaire -->
<!– Ceci est le même commentaire
sur deux lignes -->
23
Caractères et références des caractères
• Le jeu de caractères ASCII n’est pas suffisant pour représenter les
milliers de caractères utilisés sur le Web.
• HTML utilise le UCS (Jeu de caractères universel). Norme [ISO10646].
• Les caractères qui ne figurent pas sur l’encodage utilisé peuvent être
représentés par des références de caractères (exemple: les lettres
accentuées du Latin dans le cas d’un jeu de caractère autre que ISO-
8859-1 (ISO-Latin-1)).
• Le plus souvent, on utilise la forme suivante: &lettreaccent;
– Exemple : Français (Français)
élève (élève)
– Caractères particuliers :
Signe < Signe > signe " Signe &
< > " &
24
25
HML/XHTML - caractéristiques
⚫ HTML 4.01 :
⚫ DTD de SGML
(tous les éléments et attributs autorisés sont
définis dans cette DTD).
⚫ HTML est restrictif :
➢ Définit un ensemble d’éléments et attributs fixes.
L'ajout de nouveaux éléments est impossible.
➢ Permet de décrire un document simple
26
HML - caractéristiques
⚫ Les documents HTML 4.01: rarement conformes aux
règles établies par la DTD
⚫ les attributs sont rarement entre guillemets
⚫ les éléments ne sont pas toujours correctement imbriqués...
⚫ Même en cas d‘absence de la balise <html> ou <body>, le code
enregistré dans un fichier texte avec l’extension .htm ou .html
s’affiche sur le navigateur (Internet Explorer) !
⚫ HTML 4.01 n'est pas assez flexible pour prendre en compte
les divers supports d’affichage des pages Web : ordinateurs
de poche, téléphones mobiles, consoles de jeux vidéo, etc.
27
HML - caractéristiques
⚫ À l'origine, HTML = outil d'échange de données indépendant des plate-
formes et de l'affichage :
⚫ HTML devait décrire les différentes parties d'un document simple à
l'aide des éléments : Hn, P, STRONG, CITE, ...
⚫ Les navigateurs devaient se charger de l'affichage final du document.
⚫ Mais, HTML s'est orienté vers la présentation du contenu :
⚫ Rajout d’éléments d'affichage pour personnaliser les pages Web (B, I,
FONT, CENTER, TABLE dans la version 3.2)
⚫ Détournement de l’utilisation d’autres éléments
(BLOCKQUOTE…)
28
XHTML
⚫ Réaction du W3C :
⚫ Version 4.0 de HTML: suppression par le W3C des éléments
relatifs à la présentation au profit des feuilles de style CSS.
⚫ Mais le problème persiste !
⚫ XHTML (janvier 2000) : reformulation des balises de
HTML 4.01 selon les nouvelles règles de présentation et
de syntaxe de XML.
⚫ XML: issu, comme HTML, de SGML mais qui est :
⚫ plus flexible que SGML (langage de référence en milieu
professionnel pour la gestion électronique des documents)
⚫ Plus puissant et plus adaptable que HTML aux développements
futurs des multiples projets de publication électronique.
⚫ Réaction du WHATWP : Passage à HTML 5
29
HTML 5
⚫ Le WHATWG (2004) a initié HTML5 pour répondre aux
besoins modernes du web et des développeurs, aboutissant à
sa standardisation en 2014.
⚫ HTML5 assouplit les règles de syntaxe de XHTML pour
faciliter le développement web.
⚫ Balises et API modernes pour les médias, les animations, et
le stockage local, enrichissant l’expérience utilisateur.
⚫ Applications Web Progressives (PWA), Web Components,
API Canvas.
30
HTML 5 : Eléments sémantiques
⚫ HTML 4.01 utilise principalement des éléments génériques
comme <div> et <span> pour la mise en forme et la
structure.
⚫ HTML5 introduit de nouveaux éléments pour une
meilleure sémantique et structure de page :
Ces éléments aident à donner un sens logique et structurel
au contenu d'une page, et améliorent l'accessibilité et le
référencement naturel (SEO).
31
HTML 5 : Eléments sémantiques
✓ <article> : Contenu autonome, comme un article de blog.
✓ <aside> : Contenu lié mais distinct du contenu principal (ex. une barre latérale).
✓ <details> et <summary> : Contenu masqué ou plié avec une option pour l'afficher.
✓ <figcaption> : Légende pour une image ou un autre élément <figure>.
✓ <figure> : Contient une image ou un autre contenu multimédia.
✓ <footer> : Pied de page d'un document ou d'une section.
✓ <header> : En-tête d'un document ou d'une section.
✓ <main> : Contenu principal de la page.
✓ <mark> : Met en surbrillance un texte.
✓ <nav> : Section de liens de navigation.
✓ <section> : Division logique du contenu en sections thématiques.
✓ <time> : Représente une date, une heure, ou une période.
32
HTML 5 : Eléments sémantiques
Ces éléments n’ont pas d’affichage
spécifique.
Il faut utiliser le CSS pour contrôler
leur rendu dur le navigateur
https://www.w3schools.com/html/html5_semantic_elements.asp
33
HTML 5 : Eléments audio et video
⚫ En HTML5, les éléments <audio> et <video> permettent d'intégrer respectivement des
fichiers audio et vidéo dans une page web.
Ces éléments facilitent l'intégration de contenu multimédia sans avoir besoin de plugins
externes comme Flash. Voici un aperçu de leur utilisation.
⚫ Avant HTML5, l'intégration de fichiers audio et vidéo dans une page web était beaucoup
plus compliquée et nécessitait souvent l'utilisation de plugins tiers comme Flash ou
QuickTime.
Ces plugins étaient nécessaires car HTML ne disposait pas de balises natives pour gérer
l'audio et la vidéo.
=> Problèmes d’accessibilité et de compatibilité (notamment sur appreils mobiles ne
supportant pas Flash).
34
HTML 5 : Eléments audio
⚫ L'élément <audio> permet d'intégrer un fichier audio dans une page HTML.
Il est couramment utilisé pour la lecture de musique, de podcasts, ou de tout
autre contenu audio.
• controls : ajoute des contrôles audio, tels que lecture, pause et volume.
• width / height : Spécifie la largeur et la hauteur du lecteur vidéo.
• <source> : permet de spécifier des fichiers audios alternatifs parmi lesquels le
navigateur peut choisir. Le navigateur utilisera le premier format reconnu.
• Texte alternatif : le texte entre les balises <audio> est affiché si le navigateur
ne prend pas en charge l'élément audio.
35
HTML 5 : Eléments video
⚫ L'élément <video> permet d'intégrer un fichier vidéo dans une page HTML.
Comme l'élément audio, il prend en charge les contrôles de lecture et peut être
configuré avec plusieurs sources pour assurer la compatibilité avec les
navigateurs.
• controls : affiche les contrôles de lecture (play, pause, volume, barre de
progression, etc.).
• width / height : spécifie la largeur et la hauteur du lecteur vidéo.
• <source> : spécifie les fichiers vidéo à utiliser. Vous pouvez inclure plusieurs
formats pour assurer la compatibilité.
• Texte alternatif : Le texte entre les balises <video> est affiché si le navigateur
ne prend pas en charge l'élément vidéo.
36
37
XHTML
⚫ The Extensible HyperText Markup Language (XHTML) est
un langage de balisage :
⚫ Il définit la structure logique d'un document diffusé sur le Web.
⚫ La présentation est gérée par des feuilles de style
⚫ XHTML 1.0 est une Recommandation officielle du W3C
depuis le 26 janvier 2000.
⚫ Dernière recommandation date de fin 2002
⚫ Spécification stable et norme standard en terme de
publication sur le Web.
⚫ Langage « portable », car il peut fonctionner aussi bien sur
des outils conçus pour HTML que sur d'autres tournés plus
spécifiquement vers XML.
38
Règles de structure XHTML
⚫ Structure de base d'un document XHTML:
<!DOCTYPE…>
<html>
<head> <title></title>... </head>
<body> ... </body>
</html>
⚫ Le document doit comporter au minimum le Doctype et les
balises html, head et body.
L’élément head doit inclure l’élément title.
39
Règles de structure XHTML
⚫ <?xml version="1.0" encoding="UTF-8"?>
La déclaration XML est optionnelle, mais fortement
conseillée.
⚫ Cette ligne rappelle que le XHTML est issu du XML et
en reprendra la syntaxe.
⚫ On en profite généralement pour notifier le "character
set" qui indique au navigateur le jeu de caractères utilisé.
Par défaut, le XHTML utilise Unicode's UTF-8 ou UTF-
16, mais il arrive qu'on souhaite utiliser un autre jeu de
caractères.
40
Règles de structure XHTML
⚫ <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
⚫ Le DOCTYPE au début du fichier est obligatoire
⚫ Permet de spécifier la DTD adoptée :
XHTML 1.0 (Strict, Transitional ou Frameset).
⚫ Les majuscules et les minuscules doivent être respectées
41
Règles de structure XHTML
⚫ <html xmlns="http://www.w3.org/1999/xhtml"
xml:lang="fr" lang="fr">
⚫ Le document XHTML commence par la balise <html> qui comporte
différents attributs.
⚫ L'attribut xmlns="..." renvoie aux "namespaces" [d'où le ns] ou
"espaces de nom" utilisés par le XML pour un référentiel des noms
qui sera utilisé par le compilateur XML.
⚫ Le W3C recommande aussi d'identifier la langue utilisée pour le
document avec la mention xml:lang="xx". L'attribut lang="xx" n'est
là que pour assurer la compatibilité avec les anciens navigateurs.
42
Règles de structure XHTML
⚫ <head>
<title>Ma page Web</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
</head>
⚫ head doit nécessairement contenir un titre <title>.
⚫ La balise <meta http-equiv="Content-type" content="text/html;
charset=iso-8859-1" /> est facultative lorsque le jeu de caractères a été
défini par au niveau de la déclaration XML <?xml version="1.0"
encoding="UTF-8"?>. Elle est cependant conseillée pour des raisons de
compatibilité car la balise XML risque de ne pas être interprétée par le
navigateur (contrairement à la balise meta).
⚫ Les autres balises meta de HTML 4.0 sont admises pour autant qu'elles se
terminent par une barre oblique de fin.
43
Règles de structure XHTML
⚫ <body>
... corps du document ...
</body>
⚫ À l’intérieur de l’élément body, les balises sont
encodées comme dans le cas de HTML 4.0 en
respectant les règles de syntaxe de XHTML.
⚫ </html>
⚫ Fin du document XHTML.
⚫ Cette balise de fin est indispensable.
44
Règles de structure XHTML
⚫ Et voici le document type complet
<?xml version="1.0" encoding="UTF-8"?>
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<title>Ma page Web</title>
<meta http-equiv="Content-Type" content="text/html;
charset=iso-8859-1" />
</head>
<body>
... corps du document ...
</body>
</html>
45
Règles de syntaxe XHTML
⚫ Différemment de HTML, les règles de XHTML doivent être respectées.
C’est un langage très rigoureux (comme XML).
⚫ Voici les principales règles de XHTML :
➢ Toutes les balises doivent être fermées
➢ <p> </p> au lieu de <p>
➢ <li> </li> au lieu de <li>
➢ Les éléments vides aussi doivent être fermés
➢ <hr /> au lieu de <hr>
➢ <br /> au lieu de <br>
➢ Les balises doivent être correctement imbriquées.
➢ <b><i>gras et italique</i></b>
➢ au lieu de <b><i>gras et italique</b></i>
➢ Toutes les balises doivent être en minuscule
⚫ <p> au lieu de <P>
46
Règles de syntaxe XHTML
➢ Les valeurs d'attributs sont entourées de guillemets
➢ <hr width="20%" /> au lieu de <hr width=20% />
➢ Chaque attribut doit avoir une valeur.
➢ Les notations compactes sont à éviter.
➢ <hr noshade="noshade"> au lieu de <hr noshade>
➢ Les balises images (img) doivent comporter l'attribut alt pour le texte
alternatif.
➢ <img src="rabat.jpeg" alt="ville de Rabat" />
➢ Il est préférable d'ajouter l'attribut summary à la balise de tableau.
➢ <table width="100%" border="0" summary="Liste 1">.
➢ Toujours utiliser & pour & dans des attributs, y compris les URL
➢ < a href="http://www.ibm&co">
47
Règles de syntaxe XHTML
⚫ Insérer l'attribut lang et l'attribut xml:lang pour spécifier la
langue d'un élément (xml:lang="fr" lang="fr“).
Le cas échéant, la valeur définie dans l'attribut xml:lang
aura la priorité.
⚫ Utiliser id="..." au lieu de name="…".
Pour assurer la compatibilité avec les anciens navigateurs, il
est recommandé d'identifier également l'élément avec
name="...".
Soit par exemple :
<a id="ancre" name="ancre">...</a>
48
Références
⚫ Dreyfus, Michel. HTML, DHTMML et XHTML. Paris : Campus Press, 2000.
⚫ Figueiredo, Oscar. Introduction à la création de documents pour le World
Wide Web: HTML 4.0. Troisième édition, avril 1998.
https://lspwww.epfl.ch/coursweb/
⚫ W3C. HTML 4.01 Specification. W3C Recommendation 24 December 1999.
http://www.w3.org/TR/html4/
⚫ W3C. XHTML 1.0 The Extensible HyperText Markup Language (Second
Edition) A Reformulation of HTML 4 in XML 1.0. W3C Recommendation 26
January 2000, revised 1 August 2002.
http://www.w3.org/TR/xhtml1/
⚫ W3C. XHTMLMD 1.0 : Le langage de balisage hypertexte extensible Une
reformulation de HTML 4 en XML 1.0. Recommandation W3C 26 Janvier
2000. http://www.la-grange.net/w3c/xhtml1/
49
Références
⚫ W3C. XHTML 2.0. W3C Working Draft 26 July 2006.
http://www.w3.org/TR/xhtml2/
⚫ WHATWG. HTML5. Draft Standard — 7 October 2009
http://www.whatwg.org/specs/web-apps/current-work/multipage
⚫ W3C. HTML 5. A vocabulary and associated APIs for HTML and XHTML.
W3C Working Draft 24 June 2010. http://www.w3.org/TR/html5/
⚫ HTML5 differences from HTML4. W3C Working Draft 24 June 2010.
http://www.w3.org/TR/html5-diff/
⚫ HTML5. A vocabulary and associated APIs for HTML and XHTML. W3C
Recommendation 28 October 2014. http://www.w3.org/TR/html5/
⚫ Html5gallery. A showcase of sites using HTML5 markup.
http://html5gallery.com/
⚫ WHATWG HTML Living Standard — Last Updated 24 November 2021
https://html.spec.whatwg.org/multipage/
50
