J'étudie ce sujet depuis plusieurs jours et j'ai trouvé de nombreuses suggestions contradictoires en ce qui concerne l'indexation de la recherche. Je travaille sur un projet qui a beaucoup de pages différentes allant de simples descriptions de produits à une documentation utilisateur approfondie.
J'ai divisé cette question en sections car je pense que cela la rendra plus utile pour les futurs lecteurs de cette question.
Certaines de mes découvertes
Plusieurs sites Web semblent avoir adopté des contours de documents tels que les suivants:
1. Programmer's Guide (https://www.dartlang.org/docs/)
1. Getting Started
2. Concepts
1. Libraries
2. Fundamental classes
etc.
Je trouve intéressant que l'exemple ci-dessus n'utilise pas l' <nav>
élément avec un en-tête approprié. J'aime la simplicité du contour et étant Google, je suis assez certain qu'ils savent ce qu'ils font quand il s'agit de cela.
Mais je suis confus car le plan ci-dessus ne fait aucune mention de "Dart". La seule mention de «Dart» au sens sémantique semble se trouver dans l' <title>
élément principal du document «Guide du programmeur | Dart: applications Web structurées».
Le MDN (Mozilla Developer Network) est un autre exemple brillant d'un site Web qui suit ce principe. De nombreux <h1>
titres fournissent un contexte complet ( sections et contours d'un document HTML5 ):
1. Sections and Outlines of an HTML5 Document
1. Untitled Section (nav)
2. Untitled Section (nav)
3. Structure of a Document in HTML 4
4. Problems Solved by HTML5
Alors que d'autres n'ont pas beaucoup de sens hors contexte ( pratiques obsolètes à éviter ). Par exemple, le plan HTML5 suivant se rapporte-t-il à CSS, HTML5 ou C # ... avec juste le plan du document, qui sait!
1. Obsolete practices to avoid
1. Untitled Section (nav)
2. Untitled Section (nav)
3. Doctype
4. <meta> element and charset attribute
Pour aggraver les choses, que se passerait-il si le MDN contenait 2 sujets avec le même (ou très similaire) titre "pratiques obsolètes à éviter" où l'un fait partie de leur guide CSS et l'autre fait partie de leur guide HTML ...
À l'autre extrémité du spectre, les sites Web semblent utiliser l'en- <body>
tête de niveau principal pour le nom du produit (Foo) ou le conteneur de rubrique (Guide de l'utilisateur pour Foo). Où toutes les pages suivantes sont ensuite utilisées <h2>
pour le titre de la page réelle.
La question
Comment les moteurs de recherche infèrent-ils le contexte d'une page Web comme ceux trouvés sur le site Web MDN en utilisant le DOM et le contour HTML5?
Quelle est la bonne façon de baliser la page HTML5 suivante afin que Google puisse indexer la page dans le contexte approprié? Cela inclut l' utilisation des <title>
, <header>
et des <h1>
éléments.
- Nom de la compagnie
- Nom du produit
- Mode d'emploi
- Commencer
La rubrique la plus importante du code HTML qui s'affiche dans un navigateur Web, si elle représente le contexte de l'ensemble du site Web (nom de l'entreprise ou nom du produit), la collection de sujets (Guide de l'utilisateur) ou le sujet réel en cours (Mise en route) ?
Ma meilleure supposition
<!DOCTYPE html>
<html>
<head>
<title>Getting Started | User Guide | Product Name - Company Name</title>
</head>
<body>
<header role="banner"> <!-- Note: Lack of <h1> in here -->
<a id="logo" href="http://example.com">Company Name</a>
<nav>
<h1>Site Navigation</h1>
<ul> ... </ul>
</nav>
</header>
<main role="main">
<div class="product-name">Product Name</div>
<div class="document">User Guide</div>
<h1>Getting Started</h1>
<p>blah</p>
</main>
</body>
</html>
Menant au contour:
1. Getting Started
<title>
pour fournir un contexte. Par exemple, est-ce une mauvaise idée d'inclure la même chose <h1>User Guide for Ubermachine</h1>
sur chaque page où le titre du sujet est présenté avec <h2>Getting Started</h2>
... ou le plan doit-il commencer <h1>Getting Started</h1>
par un accompagnement <title>Getting Started | User Guide for Ubermachine</title>
pour fournir un contexte utile aux moteurs de recherche. Il s'agit d'une question de référencement.
<title>
fournit suffisamment de contexte.