3.2 Texte HTML

Le contenu HTML = 90% de texte

Les paragraphes <p> sont les éléments HTML les plus utilisés, car ils agissent en tant qu’éléments de niveau bloc par défaut et sont rapides à écrire.

<p>
  La pelouse de Phutra, la magnifique herbe florissante du monde intérieur, est surmontée d’une petite fleur à cinq branches, de petites étoiles brillantes de couleurs variées qui scintillent dans le feuillage vert. ajouter encore un charme au paysage étrange, mais charmant.
</p>

Listes

Les listes existent en 3 variantes :

  • <ul> sont des listes non ordonnées
  • <ol> sont des listes ordonnées (dont les articles sont automatiquement numérotés)
  • <dl> sont des listes de définitions

Les listes HTML nécessitent une structure spécifique :

  • <ul> et <ol> doivent inclure et être les parents directs de <li>, qui représente les éléments de la liste – list items.
  • Par conséquent, les éléments <li> ne peuvent pas être utilisés seuls et doivent être des enfants directs d’un <ul> ou d’un <ol>.

Listes non ordonnées – Unordered lists

Ce sont les types de listes les plus couramment utilisés. Ils sont destinés à regrouper une liste d’éléments individuels, sans ordre particulier.

<p>Ma liste d'achats :</p>
<ul>
  <li>Lait</li>
  <li>Pain</li>
  <li>Chocolat</li>
  <li>Plus de chocolat</li>
</ul>

Les éléments de la liste sont affichés avec des points.

Listes ordonnées

Les listes ordonnées sont utilisées lorsque l’ordre de ses éléments est pertinent.

<ol>
  <li>Première étape</li>
  <li>Deuxième étape</li>
  <li>????</li>
  <li>PROFIT !!!</li>
</ol>

Les listes commandées sont automatiquement numérotées par le navigateur. Vous n’avez pas besoin d’inclure les nombres dans votre code HTML.

Listes de définition – Definition lists

Les listes de définitions sont pour les éléments qui viennent par paires. Ils doivent inclure des paires de termes de définition<dt> et de descriptions de définition <dd> en tant qu’enfants directs.

<dl>
  <dt>Web</dt>
  <dd>Partie de l'Internet contenant des sites Web et des pages Web</dd>
  <dt>HTML</dt>
  <dd>Un langage de balisage pour la création de pages Web</dd>
  <dt>CSS</dt>
  <dd>Une technologie pour améliorer le rendu HTML</dd>
</dl>

Les listes de définitions sont rarement utilisées car leurs cas d’utilisation sont très spécifiques. Les tables à 2 colonnes sont l’alternative la plus populaire.

Blocs de citation – Blockquotes

Les blocs de citation sont utilisées pour identifier une citation.

<p>Sir Tim Berners-Lee a déclaré :</p>
<blockquote>
"L'idée initiale du Web était de créer un espace collaboratif dans lequel vous pouvez communiquer en partageant des informations."
</blockquote>

Rubriques – Headings

Il existe 6 niveaux de rubriques disponibles, allant de <h1> à <h6>, 1 étant le plus important.

Les titres sont destinés à être utilisés avec les paragraphes et les listes, pour dessiner une structure naturelle de votre document. Les en-têtes ayant plus de poids sémantique, veillez à maintenir l’équilibre entre le contenu important et le contenu «normal».

Utiliser uniquement des en-têtes dans un document HTML n’aurait aucun sens: si tout vous semble important, rien ne l’est vraiment. Vous devez donner de la profondeur à votre structure.

Article précédent3.1 Contenu HTML
Article suivant3.3 Sémantique en ligne – Inline