SEO et AEO sous HubSpot : ça se joue aussi dans le code de vos templates de page
On parle toujours de « quoi écrire » rarement de « comment le construire »
- Introduction SEO et AEO : le pilote et le copilote !
- Chapitre 1 Ce que le thème doit assurer, côté SEO
- Chapitre 2 Ce que le thème doit rendre possible, côté AEO
- Chapitre 3 Parler le langage des machines avec schema.org
- Chapitre 4 Une décision de conception : le fil d'Ariane qui devient le H1
- Chapitre 5 Ce que vous pouvez vérifier dès maintenant sur votre thème
- Conclusion Cinq questions à poser à votre thème
On parle beaucoup de contenu pour le SEO et l'AEO (Answer Engine Optimization) : mots-clés, questions, ton. On parle rarement de ce que fait le thème avec ce contenu — sa hiérarchie de titres, son balisage, sa structure HTML — alors que ces décisions, prises une fois dans le code, s'appliquent à chaque page publiée ensuite.
C'est ce côté-là qu'on regarde ici :
la programmation des templates et du CMS Hub.
SEO et AEO : le pilote et le copilote !
Le SEO répond à « comment être trouvé ? ». L'AEO répond à « comment être cité dans la réponse ? ». Les moteurs de réponse (ChatGPT, Perplexity, les aperçus IA de Google) fabriquent une réponse au lieu d'afficher une liste de liens, mais ils s'appuient sur les mêmes fondations que le SEO :
- Crawlabilité et indexabilité — les robots peuvent-ils accéder au site et le lire ?
- Qualité du contenu
- Structure orientée réponses — chaque section répond-elle clairement à une question ? — c'est ici que l'AEO entre en jeu
- Autorité et présence hors site
- Suivi et amélioration continus
Quatre marches sur cinq sont du bon vieux SEO. L'AEO s'ajoute à la troisième : sans elle, votre contenu peut être bien positionné sans jamais être extrait dans une réponse. Et sans les quatre autres, une structure parfaite ne suffit pas — un site mal indexé ou peu fiable n'inspire pas confiance, peu importe comment ses réponses sont formatées.
Le SEO vous rend trouvable, l'AEO vous rend citable. L'un ne va pas sans l'autre.
Contenus complémentaires
Ce que le thème doit assurer, côté SEO
C'est le socle, et c'est là que les thèmes se distinguent :
- Une hiérarchie de titres propre : un seul H1 par page, des H2 et H3 qui ne sautent pas de niveau, et des modules qui n'écrasent pas cette hiérarchie quand on les déplace en drag and drop.
- Les balises de base gérées dans le template : title, meta description, canonical, Open Graph, et hreflang pour un site multilingue.
- De la vitesse et un code propre : grille CSS légère, JavaScript chargé à bon escient, images bien dimensionnées.
- Du contenu dans le HTML initial. Ce qu'on ajoute après coup avec du JavaScript est plus risqué pour la lecture des robots. Le plus sûr est que le texte important soit déjà dans la page au chargement.
Outils utiles
Ce que le thème doit rendre possible, côté AEO
- Des sections autonomes, qui se comprennent même extraites du reste de la page.
- Des blocs FAQ dont le contenu est bien dans le DOM (un accordéon qui charge ses réponses à la demande, par exemple, est moins fiable qu'un accordéon dont tout le texte est déjà là), avec leur balisage FAQPage.
- Une table des matières et des titres descriptifs, qui fonctionnent comme des ancres de lecture.
- Des champs d'auteur et de date obligatoires sur les articles. Les moteurs évaluent la crédibilité d'une source et sa fraîcheur : un article sans auteur ni date de mise à jour manque de deux signaux.
Un exemple concret :
une table des matières générée automatiquement depuis les H2 d'un article de blog
Voici un module que j'ai développé en HubL qui parcourt automatiquement les titres H2 du contenu pour construire une table des matières, sans que l'équipe éditoriale ait à la maintenir à la main. Chaque entrée pointe vers une ancre réelle dans le DOM (#section-1, #section-2…), et un clic sur un titre copie ce lien direct dans le presse-papier, prêt à être partagé.
Résultat : une navigation claire pour le lecteur, des ancres solides pour les moteurs, et des sections qui peuvent être référencées individuellement — exactement ce que cherche un moteur de réponse qui veut citer une partie précise d'un article plutôt que la page entière.
Parler le langage des machines avec schema.org
Le balisage schema.org (en JSON-LD) décrit explicitement une page aux moteurs : c'est un article, une étude de cas, une page de service, voici son auteur, sa date, l'organisation qui la publie. Sans lui, un moteur doit deviner. Avec lui, il n'a plus à deviner.
Sous HubSpot, on n'a pas besoin de l'ajouter page par page. Un partial dans le template de base peut détecter le type de page visitée et injecter automatiquement le schéma qui lui correspond. Chaque nouvelle page créée par l'équipe marketing hérite ainsi du bon balisage, sans y penser et sans toucher au code.
Si on prend par exemple le schema.org pour la compréhension, voici ce que je recommande
Un même site peut, et devrait, produire un balisage différent selon le type de page.
Pour une page de service
L'essentiel est de situer la page dans le site. On y met le type WebPage, avec son titre et sa description propres, et surtout un fil d'Ariane balisé en BreadcrumbList. Ce fil d'Ariane dit explicitement au moteur où se trouve la page dans l'arborescence (Accueil /Services /nom du service), ce qui aide autant à la navigation qu'à la compréhension de la structure du site.
Pour un article de blogue
Je recommande au minimum : un titre, une image, la date de publication et la date de mise à jour, un auteur nommé, et des mots-clés qui reflètent les sujets réels de l'article. La date de mise à jour compte particulièrement : un moteur de réponse favorise le contenu récent, et sans cette date, un article encore pertinent peut passer pour périmé.
Pour une étude de cas
c'est là que le balisage peut vraiment apporter une valeur ajoutée. Au lieu de simplement dire « voici un article », on peut préciser « voici un article à propos de telle entreprise, publié par la mienne » :
-
le contenu type Article, avec titre, image, date de publication;
-
un champ about qui pointe vers l'entreprise cliente elle-même, comme une organisation à part entière, avec son nom et son site web;
-
un lien explicite vers l'organisation qui publie (la vôtre), pour que le moteur comprenne qui parle et de qui il parle.
C'est un signal d'autorité concret : ce n'est plus un texte anonyme, c'est une preuve nommée, reliée à une vraie entreprise cliente.
Un principe qui traverse ces types de page : tout se relie. L'organisation, le site, l'auteur, le fil d'Ariane — chacun a sa propre identité dans le balisage, et les autres éléments s'y réfèrent plutôt que de tout répéter à chaque fois. C'est ce qui permet à un thème bien construit de garder ce système cohérent d'une page à l'autre, sans dupliquer l'information.
Un piège à connaître : un balisage peut être invalide sans qu'aucune erreur ne s'affiche. Il ne suffit pas qu'un validateur dise « 0 erreur » : il faut aussi vérifier que chaque type de contenu attendu (page, article, organisation, fil d'Ariane) est bien détecté et nommé correctement. Un balisage mal assemblé peut très bien passer un test sans lever d'alerte, tout en restant invisible pour les moteurs. Le Rich Results Test de Google est un bon complément : il simule ce que Google comprend réellement de la page, plutôt que de seulement valider la syntaxe.
Outil indispensable
- Outil pour valider votre schema.org
- Rich Results Test de Google (Outil complémentaire pour simuler ce que Google comprend de votre page)
Une décision de conception : le fil d'Ariane qui devient le H1
Voici un exemple de ce qu'on peut décider au niveau du template, plutôt que page par page.
Sur les pages de services que j'ai conçues pour un client, le dernier élément du fil d'Ariane devient le H1 de la page, alors que le grand titre visuel, lui, passe au rang de H2. Concrètement : le fil d'Ariane affiche Accueil / Services / Nom du service, et c'est « Nom du service » qui devient le vrai H1 de la page, invisible visuellement en tant que tel, mais bien présent dans le code.
Pourquoi faire ça ? Parce que le H1 sert avant tout à dire aux moteurs de quoi parle la page, pas à être le titre le plus impressionnant visuellement. En le calquant sur le fil d'Ariane, il reste toujours cohérent avec la structure du site, même si l'équipe marketing change le grand titre visuel pour un message plus accrocheur ou plus émotionnel.
Résultat : le fil d'Ariane sert trois fois plutôt qu'une : à la navigation, à la hiérarchie des titres, et au balisage schema.org du chapitre précédent (BreadcrumbList). Une seule règle dans le template, et toutes les pages de services en héritent automatiquement.
C'est un exemple de décision qui vit dans le thème plutôt que dans le contenu : personne dans l'équipe éditoriale n'a besoin d'y penser, et pourtant chaque nouvelle page de service en bénéficie.
Ce que vous pouvez vérifier dès maintenant sur votre thème
Pas besoin de tout refaire pour commencer. Voici une série de vérifications rapides, à faire sur vos templates de pages, de landing pages et d'articles.
-
Un seul H1 par page, peu importe les modules utilisés ou leur ordre.
- Le texte important est bien présent dans le HTML brut, pas seulement à l'écran. Un contenu qui apparaît visuellement peut avoir été injecté après coup par du JavaScript, invisible dans le code source initial que lisent certains robots. Pour vérifier : clic droit / « Afficher le code source » (pas l'inspecteur), et cherchez le texte. S'il n'y est pas, c'est un signal d'alerte.
-
Les articles affichent un auteur et une date de mise à jour, pas seulement une date de publication.
-
Le balisage schema.org change selon le type de page, et ses types sont bien reconnus par un validateur, pas seulement présents sans erreur.
-
Les blocs de questions et de réponses (FAQ, accordéons) ont leur contenu déjà dans le HTML, même avant qu'on clique dessus.
-
Sur un site multilingue, les balises hreflang et le canonical concordent d'une langue à l'autre.
Chacun de ces points se vérifie en quelques minutes. Aucun ne demande de tout reconstruire : ce sont des ajustements qu'on peut faire un par un, sans attendre une refonte complète du site.
Cinq questions à poser à votre thème
-
Les robots peuvent-ils lire et indexer mes pages sans obstacle technique ?
-
Ma hiérarchie de titres est-elle la même quelles que soient les pages et les modules utilisés ?
-
Mes templates produisent-ils des sections autonomes, faciles à extraire ?
-
Mon balisage dit-il aux machines le type de chaque page, son auteur et sa date ?
-
Puis-je vérifier tout ça, et le corriger à un seul endroit ?
Si votre thème répond « oui » aux cinq, votre équipe éditoriale peut se concentrer sur le contenu : le reste tient déjà en place. Sinon, c'est le thème qu'il faut regarder en premier, pas le prochain article de blogue.
Le SEO vous rend trouvable. L'AEO vous rend citable. Les deux se jouent, en bonne partie, avant même que le premier mot soit écrit.
Votre thème est-il prêt à décoller ?