[HTML5] Page avec une seule thématique

**judev57** · 16/12/2013, 14h29

Bonjour à tous,
Sur certaine page de mon site web, je n'ai qu'une seule thématique, la page entière pourrait être englobé dans la balise section. De ce fait, je ne sais pas trop qu'elle est la structure sémantiquement correct. J'ai 4 choix possibles :

N°1

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<body>
	<!-- header de la page -->
	<header>
		<h1>Mon titre</h1>
	</header>
	<section>
		<article>
			<!-- ... -->
		</article>
	</section>
</body>

N°2 :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
<body>
	<!-- header de la page -->
	<header>
		<!-- ... -->
	</header>
	<section>
		<h1>Mon titre</h1>
		<article>
			<!-- ... -->
		</article>
	</section>
</body>

N°3 :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
<body>
	<section>
		<!-- header de la page -->
		<header>
			<h1>Mon titre</h1>
		</header>
		<article>
			<!-- ... -->
		</article>
	</section>
</body>

N°4 :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<body>
	<!-- header de la page -->
	<header>
		<h1>Mon titre</h1>
	</header>
	<article>
		<!-- ... -->
	</article>
</body>

Pouvez vous m'aidez svp ? Merci d'avance.

**karamaster** · 16/12/2013, 15h21

Salut, si tu revoir très bien le rôle de chaque balise tu résoudra le problème.
On met généralement le logo, le nom du site, etc... dans le header.
le reste du contenu sera très dans la balise <section>
Le cas N°1 est tout à fait adapté.

**judev57** · 16/12/2013, 16h17

Merci de ta réponse, j'ai beau relire les spécifications de chaque balise, dans ce cas là, je n'était pas sûr à 100%.

D'un côté, chaque page contient forcément une thématique. Il faut mettre la balise section parce que la spécification html5 l'impose mais dans la logique, elle serait inutile.

**ceweb** · 16/12/2013, 16h47

Pour vérifier si ton code semble sémantique tu peux utiliser HTML 5 Outliner.

Pour répondre à tes questions :
The section element | HTML5 Doctor

Mais ta question est intéressante parce qu'il est aussi possible de faire :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<section class="bloc">
    <h1>titre 2 au milieu de la page</h1>   
      <nav>
        <li><a href="#"><img src="img.jpg" alt="item 1" id="item 1"></a></li>
        <li><a href="#"><img src="img.jpg" alt="item 2" id="item 2"></a></li>
        <li><a href="#"><img src="img.jpg" alt="item 3" id="item 3"></a></li>
      </nav>    
</section> 
 
<section class="bloc">
    <h1>titre 3 au milieu de la page</h1>
 
    <div>
      <p>Blabla</p>
    </div>
</section>

Quand tu auras trouvé ce qui te convient le mieux, il serait bon de partager tes résultats ici

[HTML5] Page avec une seule thématique

Web sémantique

Discussions similaires

Partager

Partager