Conception structure HTML

Actualisé le

Le HTML est le language de base pour fabriquer une page web, en particulier son contenu structuré.

De l'HTML sensé

Chaque balise web a une signification à respecter pour une construction facile & un code lisible.

Par exemple une liste d'éléments codée : plusieurs balises paragraphe <p> qui se suivent, inapproprié ; il faut utiliser la balise <li> représentant un élément de balise <ul> ou <ol> respectivement liste non ordonnée (unordered list) & liste ordonnée (ordered list).

C'est ce qu'on appelle du codage web sémantique. Pour chaque page se poser les questions suivantes :

  1. Comment classer sémantiquement tel élément ? Ex. : adresse, mise en exergue, titre de 2d niveau... ;
  2. Quelle est sa correspondance HTML ? Ex. précédent : <address>, graduellement <em> puis <strong>, <h2>...

Cet excellent article traite de la sémantique : alsacreations.com/article/lire/552-strong-b-em-i-quelle-balise-utiliser-et-pourquoi.html.

Un minimum sinon aucune <div>

De même lorsqu'on crée une page HTML on peut faire des zones <div>, mais pas besoin de mettre une balise <div> dite de structuration, si elle contient directement & uniquement une balise fille. Dans ce cas on va directement appliquer le style sur la balise fille.

Donc en fait une balise ne doit pas être enveloppée –seule– d'une balise <div> ou <span> ; autrement dit la balise conteneur d'une autre balise ne doit pas être conteneur exclusif & direct de cette balise.

Une structure logique

Les balises HTML ont un sens précis. La lecture d'une page ressemble à la lecture d'un exposé : on commence par le grand titre, puis les éventuels titres de second niveau, le premier paragraphe & ainsi de suite.

Un agencement pour au moins deux raisons :

Haut de page