Voici un exemple de structure de base d’une page en HTML 5
<!doctype html>
<html lang='fr'>
<head>
<meta charset='utf-8'>
<title>Modèle</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/
jquery.min.js'></script>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/
jqueryui/1.8.10/jquery-ui.min.js'></script>
<script type='text/javascript' src='script.js'></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<!-- L'élément <header> contient des éléments introductifs (titre, logo, formulaire de recherche, etc) -->
<h1>Bienvenu sur le site</h1>
<h2>Structure de base d'une page HTML5</h2>
</header>
<aside>
<!-- L'élément <aside> est une section dont le contenu est indirectement lié à ce qui l'entoure -->
<!-- et qui pourrait être séparé de cet environnement. -->
<!-- Ce peut être des colonnes annexes ou des encadrés qui contiennent un glossaire, des publicités, la biographie -->
<!-- de l'auteur, etc -->
<h3>Première balise aside</h3>
<p>Contenu de la première balise</p>
</aside>
<aside>
<h3>Deuxième balise aside</h3>
<p>Contenu de la deuxième balise</p>
</aside>
<nav>
<!-- L'élément <nav> (pour navigation) permet de naviguer dans un document avec des liens vers des pages -->
<!-- ou des articles. -->
<p>Nouveautés</p>
<p>Qui sommes nous</p>
<p>Nos produits</p>
<p>Contact</p>
</nav>
<article>
<!-- L'élément <article> représente du contenu autonome. Chaque <article> doit être identifié avec un en-tête h1-h6) -->
<h2>La structure d'une page HTML5</h2>
<section>
<!-- L'élément < section> représente un groupement thématique de contenu, généralement avec un en-tête. -->
<h3>Le DOCTYPE</h3>
</section>
<section>
<h3>HTML</h3>
</section>
</article>
<footer>
<!-- L'élément <footer> représente le pied de page de la section. -->
<!-- Il contient habituellement des informations de copyright et/ou sur l'auteur de la section, -->
<!-- ou les liens vers d'autres documents en relation. -->
<p>Copyright 2015 | Michel Piallier | michelpiallier.info</p>
</footer>
</body>
</html>
[print-me target="pre" alt="Cliquer pour imprimer"]
x
<!doctype html>
<html lang='fr'>
<head>
<meta charset='utf-8'>
<title>Modèle</title>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js'></script>
<script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.10/jquery-ui.min.js'></script>
<script type='text/javascript' src='script.js'></script>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<header>
<!-- L'élément <header> contient des éléments introductifs (titre, logo, formulaire de recherche, etc) -->
<h1>Bienvenu sur le site</h1>
<h2>Structure de base d'une page HTML5</h2>
</header>
<aside>
<!-- L'élément <aside> est une section dont le contenu est indirectement lié à ce qui l'entoure -->
<!-- et qui pourrait être séparé de cet environnement. -->
<!-- Ce peut être des colonnes annexes ou des encadrés qui contiennent un glossaire, des publicités, la biographie -->
<!-- de l'auteur, etc -->
<h3>Première balise aside</h3>
<p>Contenu de la première balise</p>
</aside>
<aside>
<h3>Deuxième balise aside</h3>
<p>Contenu de la deuxième balise</p>
</aside>
<nav>
<!-- L'élément <nav> (pour navigation) permet de naviguer dans un document avec des liens vers des pages -->
<!-- ou des articles. -->
<p>Nouveautés</p>
<p>Qui sommes nous</p>
<p>Nos produits</p>
<p>Contact</p>
</nav>
<article>
<!-- L'élément <article> représente du contenu autonome. Chaque <article> doit être identifié avec un en-tête h1-h6) -->
<h2>La structure d'une page HTML5</h2>
<section>
<!-- L'élément < section> représente un groupement thématique de contenu, généralement avec un en-tête. -->
<h3>Le DOCTYPE</h3>
</section>
<section>
<h3>HTML</h3>
</section>
</article>
<footer>
<!-- L'élément <footer> représente le pied de page de la section. -->
<!-- Il contient habituellement des informations de copyright et/ou sur l'auteur de la section, -->
<!-- ou les liens vers d'autres documents en relation. -->
<p>Copyright 2015 | Michel Piallier | michelpiallier.info</p>
</footer>
</body>
</html>
Publier 28 août 2014 par
dans HTML5 - Structure de base
Commentaires fermés sur HTML5 – Document HTML5 de base