Document HTML valide avec un DOCTYPE HTML 4.01 transitional

Ce document est un modèle de document HTML 4.01 avec un DOCTYPE transitional, valide, qui me sert de plateforme de test pour ma feuille de style universelle.

Il contient de nombreux éléments HTML mais ne couvre pas l’ensemble des possibilités de HTML 4.01. Ce n’est pas une référence, bien que je m’efforce d’y appliquer certaines bonnes pratiques.

La principale qualité de ce doument est peut-être la séparation totale entre la structure et la présentation. Il ne comprend aucune classe, la feuille de style s’appuie uniquement sur le mécanisme d’héritage et sur les pseudo-classes (ce dernier point pose problème à IE6).

DOCTYPE de ce document :

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">


Titres

Titre de niveau 1

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Titre de niveau 2

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Titre de niveau 3

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Titre de niveau 4

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Titre de niveau 5

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

Titre de niveau 6

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.


Éléments de phrase

Source : HTML 4.01, 9.2.1 Phrase elements.

Repris de la traduction française :

Les éléments de phrase ajoutent une information structurelle à des portions du texte. L’interprétation habituelle de ces éléments de phrase est la suivante :

em
Indique une mise en exergue.
strong
Indique une mise en exergue plus forte.
cite
Contient un extrait ou une référence vers une autre source.
dfn
Indique qu’il s’agit de l’instance définissante du terme englobé.
code
Désigne un fragment de code informatique.
samp
Désigne un exemple des sorties d’un programme, d’un script, etc.
kbd
Indique un texte que doit saisir l’utilisateur.
var
Indique l’instance d’une variable ou le paramètre d’un programme.
abbr
Indique une forme abrégée (par exemple : WWW, HTTP, i.e., etc.).
acronym
Indique un acronyme (par exemple : radar, LAN, etc.).

Paragraphe élément i, élément b, élément em, élément strong abbréviation (en latin) : i.e., acronyme (en anglais) : radar.


Listes

Liste non ordonnée

Liste ordonnée

  1. Élément de liste ordonnée
  2. Élément de liste ordonnée, contenant une liste non ordonnée
  3. Élément de liste ordonnée, contenant une liste ordonnée
    1. Élément de liste ordonnée
    2. Élément de liste ordonnée
    3. Élément de liste ordonnée

Liste de définition

Terme A
Définition du terme A
Terme B
Définition du terme B
Autre définition du terme B

Éléments de formulaires

Texte

Boutons radio

Boutons checkbox


Blockquote

Extrait de L’Étranger, d’Albert Camus

Vous comprenez, monsieur Meursault, m’a-t-il dit, c’est pas que je suis méchant, mais je suis vif. L’autre, il m’a dit : Descends du tram si tu es un homme. Je lui ai dit : Allez, reste tranquille. Il m’a dit que je n’étais pas un homme. Alors je suis descendu et je lui ai dit : Assez, ça vaut mieux, ou je vais te mûrir. Il m’a répondu : De quoi ? Alors je lui en ai donné un. Il est tombé. Moi, j’allais le relever. Mais il m’a donné des coups de pied de par terre. Alors je lui ai donné un coup de genou et deux taquets. Il avait la figure en sang. Je lui ai demandé s’il avait son compte. Il m’a dit : Oui.

Extrait de Sending XHTML as text/html Considered Harmful, de Ian Hickson

If you use XHTML, you should deliver it with the application/xhtml+xml MIME type. If you do not do so, you should use HTML4 instead of XHTML. The alternative, using XHTML but delivering it as text/html, causes numerous problems that are outlined below.

Traduction française de cet extrait

Si vous utilisez du XHTML, vous devriez le servir avec le type MIME application/xhtml+xml. Dans le cas contraire vous devriez utiliser du HTML4 plutôt que du XHTML. Faire le contraire, utiliser du XHTML en le servant en tant que text/html, entraîne de nombreux problèmes, décrits ci-dessous.


iframe


Tableaux

Caption
header header header header header
         
         
Caption
header header header header
header        
       
       
Caption
header header header header
header        
header        

Langues cibles

ressource de, ressource en, ressource fr, ressource es, ressource pt-br.


copyright © 2005‑2006 Sébastien Guillon – HTMLCSS