Table des matières

Le Tutoriel de HTML Heading

View more Tutorials:

1- Section Heading

La structure d'une page  HTML comprend plusieurs  Section (section) qui peuvent être imbriquées. Ưn  section peut également contenir un  Section Heading (Titres de rubrique) qui permet aux utilisateurs d'apprendre le contenu principal mentionné par cette  section.

2- Heading Elements

Les éléments  HTML <h1> - <h6> représentent six niveaux de  section heading dont le  <h1> est le premier niveau, <h6> est le dernier niveau.
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5>Heading level 5</h5>
<h6>Heading level 6</h6>
Un site bien conçu montre la structure  Heading clairement donc il permet aux utilisateurs de rechercher le contenu facilement. De plus,  Heading est une des critères d'évaluation des moteurs de recherche comme Google, donc il devient utile pour  SEO.
Sur une page, vous devriez avoir le seul et unique élément  <h1> qui fait référence à  Heading de la page entière. La structure  Heading sur votre page est similaire à la structure arborescente, utilisant le  <h1> au niveau 1, puis le  <h2> au niveau 2, puis le  <h3> au niveau 3 ainsi de suite.
Vous ne devez pas sauter (skip) un certain niveau, par exemple, vous utilisez le <h1> au niveau 1, puis le <h3> au niveau 2, donc vous avez sauté le <h2>. Certains lecteurs d'écran (Screen Reader) pour les utilisateurs aveugles appliquent la technique de navigation (navigation technique) basée sur les Heading ; par conséquent, sauter un niveau particulier de Heading les embrouillera car ils ne savent pas pourquoi le contenu est perdu.
<!-- GOOD: -->

<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>

<!-- BAD: -->

<h1>Heading level 1</h1>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
 
Par exemple :
<h1>HTML Headings Tutorial</h1>
<i>Author: o7planning, Views: 500</i>

<h2>1 - What is section heading?</h2> Section Heading is ....
 

<h2>2 - Heading Elements</h2> The HTML &lt;h1&gt;–&lt;h6&gt;
elements represent six levels of section headings...

<h3>2.1 - H1 Element</h3> h1 is ....
<h3>2.2 - H2 Element</h3> h2 is ....

3- Taille

Chaque  HTML Heading a une taille par défaut, mais vous pouvez utiliser CSS font-size pour lui donner une nouvelle taille.
<h1>Heading level 1</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>
<h4>Heading level 4</h4>
<h5 style="font-size:20px;">Heading level 5 (font-size:20px)</h5>
<h6>Heading level 6</h6>

View more Tutorials: