Ceci est une ancienne révision du document !
HTML sémantique
Il consiste à utiliser certaines balises donnant un sens au travers de la structure du document.
Sémantique et structure
| Balise | Rôle |
|---|---|
| h* | Titres |
| header | En-tête général de la page |
| main | Zone de contenu principal |
| aside | Zone supplémentaire de complément |
| footer | Pied de page |
| article | Bloc de contenu en relation avec d'autres articles, peut contenir des sections |
| section | Défini une zone spécifique de contenu, peut contenir des articles |
| nav | Zone de navigation de la page |
Balises sémantiques
Liste de description
<dl>
<dt>Prénom</dt>
<dd>John</dd>
<dt>Nom</dt>
<dd>DOE</dd>
<dt>Ville</dt>
<dd>Caen</dd>
</dl>
| 
|
Citations
<blockquote>
<p>La théorie, c'est quand on sait tout et que rien ne fonctionne.</br>
La pratique, c'est quand tout fonctionne et que personne ne sait pourquoi.</p>
<p>Ici, nous avons réuni théorie et pratique : Rien ne fonctionne… et personne ne sait pourquoi !</p>
<footer>
<cite>Albert EINSTEIN</cite>
</footer>
</blockquote>
| 
|
Adresse
Pour mettre des informations de contact:
<p>Contact the author of this page:</p>
<address>
<a href="mailto:jim@rock.com">j.doe@mail.com</a><br>
<a href="tel:+13115552368">(343) 555-3228</a>
</address>
| 
|
Micro-données
Les microdonnées permettent de spécifier des informations spécifiques sur le contenu d'une page Web, telles que le type de contenu, l'auteur, la date de publication, etc.
Elles permettent aux moteurs de recherche de mieux comprendre le contenu de la page et de fournir des résultats de recherche plus pertinents.
Exemple :
Utilisation de microdonnées de schema.org pour spécifier le type de contenu de la page (http://schema.org/Article), ainsi que les informations sur l'auteur et la date de publication de l'article (itemprop=“author” et itemprop=“datePublished”), itemprop=“headline” pour spécifier le titre de l'article.
<!DOCTYPE html>
<html>
<head>
<title>Mon article sur les microdonnées</title>
<meta charset="utf-8">
<!-- Ajout des microdonnées -->
<meta itemprop="name" content="Mon article sur les microdonnées">
<meta itemprop="author" content="Jean Dupont">
<meta itemprop="datePublished" content="2023-05-08">
</head>
<body>
<article itemscope itemtype="http://schema.org/Article">
<header>
<h1 itemprop="headline">Mon article sur les microdonnées</h1>
<p><span itemprop="author">Jean Dupont</span> - <span itemprop="datePublished">8 mai 2023</span></p>
</header>
<section>
<p>Dans cet article, je vais vous expliquer comment les microdonnées peuvent améliorer la visibilité de votre site web dans les résultats de recherche.</p>
<p>Les microdonnées permettent de spécifier des informations spécifiques sur le contenu d'une page Web, telles que le type de contenu, l'auteur, la date de
publication, etc. Cela permet aux moteurs de recherche de mieux comprendre le contenu de la page et de fournir des résultats de recherche plus pertinents.</p>
<p>En utilisant les microdonnées, vous pouvez également améliorer la présentation des résultats de recherche, en ajoutant des éléments tels que des images,
des évaluations, des prix, etc.</p>
</section>
<footer>
<p>Publié par <span itemprop="author">Jean Dupont</span> le <time itemprop="datePublished" datetime="2023-05-08">8 mai 2023</time>.</p>
</footer>
</article>
</body>
</html>
jcheron