Informatique


Les balises structurantes

Aller à

Remédiation

Les balises structurantes du document HTML

Le document html a une structure:
  • <html> et </html> encadrent le document, le doctype permet de préciser le type de document aux moteurs de recherche.
  • <head> et </head> encadrent l'en-tête
  • <body> et </body> encadrent le corps

	<!doctype html>
	<html lang="fr">
	<head>
		<!-- l'en-tête du document -->
	</head>
	<body>
		<!-- le contenu du document -->
	</body>
	</html>	
	

Les balises structurantes du contenu

Ces balises aux noms évocateurs sont reconnues par les moteurs de recherche et utilisées pour le référencement, elles seront utilisées par les moteurs de recherche pour élaborer l'arborescence de la page, le Document Type Definition (DTD).
Pour structurer les pages nous utiliserons donc:
  • <header>, pour la bannière principale, le titre de la page, la date du jour,...
  • <nav>, pour la barre de navigation principale (celle qui permet de voyager dans le site)
  • <aside>, pour une barre de navigation secondaire, d'éventuelles publicité, sites liés,etc
  • <section>, pour le contenu informatif
  • <article>, au sein de section, pour le contenu informatif
  • <footer>, pour le copyright

	<!doctype html>
	<html lang="fr">
	<head>
		<!-- l'en-tête du document -->
	</head>
	<body>
		<header>
			<!-- l'en-tête du contenu du document -->
		</header>
		<aside>
			<!-- pour un éventuel contenu publicitaire par exemple-->
		</aside>
		<nav>
			<!-- la barre de navigation principale -->
		</nav>
		<section>
			<article>
				<!-- contenu -->
			</article>
			<article>
				<!-- contenu -->
			</article>
		</section>
		<footer>
			<!-- le pied de page -->
		</footer>
	</body>
	</html>
Visuellement: