Marquage des horaires pour les boutiques en ligne

De nombreux membres d'eMany connaissent les étoiles jaunes de Google dont il a été question plus haut dans ce blog. Les images des vidéos et le prix ou l'état des stocks d'un produit sont également des exemples d'ajouts supplémentaires qui apparaissent dans les résultats de recherche. Pour bénéficier de ces "Rich snippets", vous devez donner un coup de main aux moteurs de recherche. Pour ce faire, vous devez ajouter des codes supplémentaires (balisage de données structurées) à votre site web. Cela permet aux moteurs de recherche non seulement de lire ce qui est écrit, mais aussi d'en comprendre le sens.

Un exemple de rich snippets

Les rich snippets sont les ajouts supplémentaires que Google affiche dans les résultats de recherche. Ils peuvent garantir un CTR (taux de clics) plus élevé et donc un plus grand nombre de visiteurs dans votre boutique en ligne.

Exemple de balisage Schema dans les résultats de recherche

Les snippets riches existent dans Google depuis le 12 mai 2009.

Qu'est-ce que les données structurées ?

Les données structurées sont le nom collectif des données nom-valeur que vous ajoutez à votre site web sous forme de code supplémentaire. Avec le contenu de votre site, elles aident les moteurs de recherche à identifier, classer et indexer les informations. Il existe plusieurs méthodes pour clarifier le contenu pour les moteurs de recherche. Par exemple, la spécification HTML5 des données structurées est appelée " Microdata", tandis que d'autres formats de données structurées bien connus sont RDFa et JSON-LD . Il est judicieux de ne pas inclure les mêmes données structurées dans différents formats, car cela peut être source de confusion pour les moteurs de recherche.

Un exemple de données structurées

Imaginez que vous vendiez des aspirateurs dans votre boutique en ligne. Vous avez maintenant une page sur un aspirateur spécifique avec le nom, le prix, une image, une brève description et quelques caractéristiques du produit. Votre code HTML ressemble alors à ceci

<div> <h1>Philips FC8477 PowerPro Compact</h1> <div>Aujourd'hui pour 1 150,99 €</div> <img src="/images/-FC8477-powerpro-compact.jpg" /> <div>Le Philips FC8477 PowerPro Compact est un aspirateur sans sac bon marché d'une puissance de 750 watts. Cet aspirateur est particulièrement adapté aux tapis à poils bas.</div> <div>Marque : Philips</div> <div>Couleur : Noir</div> <diviv> </div> </div>

Si vous ajoutez des microdonnées, le code source ressemblera à ceci :

<div itemcope itemtype="https://schema.org/Product" > < h1 itemprop="name ">Philips FC8477 PowerPro Compact</h1> <div itemprop="offers" itemcope itemtype="https://schema.org/Offer" > Maintenant pour <span itemprop="priceCurrency" content="EUR ">€</span> <span itemprop="price" content="1150.99 ">1 150,99</span> </div> <img itemprop="image " src="/images/-FC8477-powerpro-compact.jpg" /> <div itemprop="description ">Le Philips FC8477 PowerPro Compact est un aspirateur sans sac économique d'une puissance de 750 watts. Cet aspirateur est particulièrement adapté aux tapis à poils bas.</div> <div>Marque : <span itemprop="brand ">Philips</span></div> <div>Couleur : <span itemprop="color ">Noir</span></div> </div> <div>Marque : <span itemprop="brand ">Philips</span></div> </div>

Si vous regardez les codes additionnels (surlignés en vert), vous verrez item type="schema.org/Produit " en haut et item type="schema.org/Offre " plus loin. Cela indique que cette page concerne un aspirateur qui peut être vendu à un certain prix. Ainsi, cet exemple clarifie le nom, le prix, la devise, l'image du produit, la description, la marque et la couleur de l'aspirateur.

Qu'en est-il du balisage Schema ?

Schema.org est la principale norme pour le balisage des données structurées. Elle est le fruit d'une collaboration de 2011 entre Google, Bing et Yahoo. La société russe Yandex prend également en charge schema.org. Vous pouvez considérer schema.org comme une grande bibliothèque de toutes les clarifications possibles que vous pouvez ajouter à un site web. Le balisage par schéma peut être mis en œuvre avec tous les formats de données structurées courants (Microdata, RDFa, JSON-LD). Il existe différents "schémas", chacun ayant son propre objectif. Par exemple, il existe des schémas pour les produits , les personnes , les entreprises , les avis , les événements , etc. Certains de ces schémas peuvent être définis de manière plus spécifique. Par exemple, si vous avez un magasin de chaussures, vous pouvez l'indiquer en tant qu' entreprise locale , mais aussi en tant que magasin ou même ShoeStore . Il est important de définir un schéma de manière aussi précise que possible afin que les moteurs de recherche puissent mieux comprendre de quoi vous parlez. Consultez donc toujours la liste complète des schémas lorsque vous ajoutez des balises de schéma à votre site web.

Les avantages du balisage par schéma

En tant que boutique en ligne, vous souhaitez naturellement savoir ce que la mise en œuvre du balisage par schéma vous apportera. Cette mise en œuvre présente trois avantages pour le référencement :

1. Vous augmentez considérablement les chances d'affichage de rich snippets pour votre site web. Cela peut se traduire par des CTR plus élevés et donc par un plus grand nombre de visiteurs sur votre site web. Une étude de cas réalisée en 2011 par Independer.nl a révélé une augmentation de 28 % des CTR grâce à l'affichage d'extraits d'évaluation dans les résultats de recherche.
2. Les moteurs de recherche comprennent mieux le contenu de votre site web et peuvent distinguer les pages dont les sujets se chevauchent. Dans une étude de cas réalisée en 2015, cela a même permis de rétablir le trafic de recherche sur un site web qui avait été déclassé à la suite du déploiement de certaines mises à jour Panda.
3. Comme les moteurs de recherche comprennent mieux votre contenu, votre site web peut apparaître dans des recherches auxquelles vous n'étiez pas associé auparavant.

L'utilisation des balises de schéma est la meilleure pratique pour présenter le contenu aux moteurs de recherche. Bien que Google ne l'utilise pas comme facteur de classement, vous pouvez en tirer profit.

Un balisage schématique pertinent pour le commerce électronique

Pour les sites de commerce électronique, il y a énormément de choses à étiqueter avec le balisage de schéma. Les possibilités les plus importantes sont énumérées ci-dessous. Bien que cette liste soit relativement complète, il est possible que d'autres balises soient disponibles pour votre secteur d'activité spécifique.

Schéma de balisage de base pour les produits

• Le nom
• La marque
• La catégorie du produit
• Le modèle
• La (les) couleur(s)
• La hauteur , la largeur , la profondeur et le poids
• La période de garantie et le contenu de la promesse de garantie
• L 'image du produit (peut être plus détaillée, voir ici )
• Le prix
• La devise dans laquelle le prix est affiché
• L ' existence ou non d'un stock et l'état du stock en chiffres
• Le numéro de série
• Le code SKU , EAN (GTIN ) et/ou le code de l'article

Marge bénéficiaire facultative pour les produits

• L'état du produit
• Le nombre de produits dans le cadre de cette offre
• Offre(s) supplémentaire(s) associée(s) à ce produit
• la durée de l'offre ou de la tarification
• Le volume de la commande pour obtenir un prix/une marge spécifique
• les accessoires ou les pièces détachées
• Produits connexes (par exemple, produits de la même série)
• Produits similaires
• Le produit est une variante de
• Le produit est le successeur de
• Fabricant du produit
• Zone de livraison
• Méthodes de livraison
• Méthodes de paiement acceptées
• Délai de traitement jusqu'à l'expédition du produit
• Référence à la source officielle ou à la description détaillée (Wikipedia) de l'article

Marquage d'évaluation

La balise d'évaluation permet d'obtenir des étoiles jaunes dans Google.

• L'article faisant l'objet d'un avis
• Le nombre total d'avis
• La note totale de l'avis
• La note moyenne de l'avis

Si vous utilisez un système d'évaluation qui n'utilise pas une échelle de 5 points, indiquez également la note la plus basse possible et la note la plus haute possible .

Formatage des avis individuels

• Le titre de l'évaluation
• Le texte de l'évaluation
• La note attribuée à l'évaluation
• La personne qui a rédigé l'évaluation
• La date de rédaction de l'avis
• Images des commentaires

Schéma de marquage concernant l'organisation

Cette balise n'est généralement ajoutée que sur la page de contact et/ou dans le pied de page. Bien qu'elle soit également utilisée pour les entreprises locales (schema local business), il n'est jamais inutile de l'ajouter.

• Le nom de l'organisation
• Le nom légal de l'organisation
• Le nom de la société mère
• Le site web
• L'adresse
  • La rue
  • Le code postal
  • Ville
  • Pays
• La localisation géographique
  • Longitude de l'emplacement de l'entreprise
  • Latitude de l'entreprise
• L'adresse email
• Numéro de téléphone
• Heures d'ouverture
• Logo de l'entreprise
• Numéro de TVA
• Autres schémas de majoration

Outre les possibilités mentionnées ci-dessus, il existe un certain nombre de situations dans lesquelles un balisage supplémentaire peut s'avérer intéressant. Blog - ceci est intéressant lorsque vous avez un blog vivant sur votre boutique en ligne où il y a une réelle interaction avec votre public cible et/ou que plusieurs personnes écrivent sur ce blog. Médical - lorsque vous fournissez des produits ou des informations médicales, un formatage supplémentaire est disponible. Jeux , films ou musique - Dans ces catégories, de nombreux formats supplémentaires sont disponibles. Livres ou livres audio - Un formatage supplémentaire est également disponible pour les produits disponibles en plusieurs langues . Comme vous l'avez vu, les possibilités offertes par le balisage Schema sont très nombreuses. Lorsque vous commencez à les mettre en œuvre, il est judicieux de déterminer d'abord quelles sont les données les plus importantes sur votre site web. Vous éviterez ainsi de perdre du temps, de l'argent ou de l'énergie à mettre en place des balises inutiles.

Ajout du balisage Schema

Il existe deux façons d'ajouter des données structurées à votre site web. La première consiste à ajouter des balises de schéma au code de votre site web et la seconde à utiliser l'outil de mise en évidence des données de Google (Google Data Highlighter ).

Mise en œuvre dans votre site web

En tant que boutique en ligne, vous devez souvent faire appel à un programmeur externe pour ajouter des données structurées directement au code de votre site web. Contrairement à beaucoup d'autres fonctions, il n'y a souvent pas de plugins ou de modules supplémentaires disponibles pour cela. Il existe cependant des outils qui peuvent aider à générer le code. Dans la pratique, la mise en page supplémentaire devra être ajoutée au logiciel existant par quelqu'un qui comprend la programmation dans le système de votre magasin.

Différentes méthodes de mise en œuvre

Comme indiqué précédemment, le balisage de schéma peut être mis en œuvre dans trois formats de données structurées. Il s'agit de Microformats, RDFa et JSON-LD. Google préfère JSON-LD . Cela dit, le choix du format dépend principalement de votre système CMS ou des préférences de votre programmeur. La méthode la plus simple sur le plan technique doit être privilégiée ici.

Exemples pratiques

Nous avons mis en œuvre un grand nombre des balises de schéma présentées dans cet article dans la boutique en ligne premium-hookahs.com . Le code source des pages produits en est un bon exemple. Ici, l'accent est mis sur le balisage du produit et le balisage des commentaires. Notre propre site web peut également servir d'exemple. Vous pouvez voir ici comment de nombreux éléments concernant l' organisation avec les microdonnées (notez l'élément itemprop ) sont mis en œuvre. Le code source de la page de contact le montre particulièrement bien. En outre, vous pouvez voir que l'élément "SameAs" dans le pied de page a également été utilisé pour indiquer les pages qui concernent toutes le même objet. Il peut donc s'agir de pages internes à votre site web ou de pages externes sur Wikipédia, par exemple.

Mise en œuvre via Google Search Console

Google propose une alternative à l'implémentation technique (difficile) des données structurées sur votre site web. Il le fait par le biais de l'outil de mise en évidence des données (Data Highlighter), disponible sous la rubrique "Formatage de la recherche" -> "Mise en évidence des données" dans Google Search Console . Cet outil vous permet de mettre en évidence des sections de votre site web avec le formatage approprié directement dans une interface visuelle. Google est également en mesure de détecter des modèles, de sorte que cette méthode peut également être appliquée à des boutiques en ligne plus importantes. Bien qu'il s'agisse d'une excellente alternative, il existe plusieurs limitations qui nécessitent souvent l'intervention d'un programmeur pour une mise en œuvre complète. Les limites du Data Highlighter

1. Le Data Highlighter est un outil Google. Les autres moteurs de recherche ne peuvent pas utiliser ces données.
2. Les fonctionnalités du Data Highlighter sont limitées. Par conséquent, seulement 50 % des mises en forme présentées dans ce blog peuvent être appliquées.
3. Lorsque les informations sur les produits sont cachées derrière des onglets, elles ne peuvent pas être formatées à l'aide du Data Highlighter.
4. Lorsque la structure HTML de votre site web change, il se peut que vous deviez réinitialiser l'outil de mise en évidence des données.

Test des données structurées

Pour vérifier si la mise en œuvre a réussi sur votre site web, vous pouvez utiliser l' outil de test des données structurées de Google. Cet outil vous permet de vérifier, pour chaque URL, si les données structurées sont reconnues ou non par le robot de Google. Vous pouvez également utiliser cet outil pour générer des exemples de mise en page. Enfin, grâce à la Search Console, Google vous permet d'évaluer l'état actuel de votre site et d'identifier d'éventuelles erreurs dans votre balisage. Si vous n'avez pas encore de balisage de schéma sur votre site, vous trouverez ici le message "Nous n'avons détecté aucune donnée structurée sur votre site" ou "Nous ne détectons aucune donnée structurée sur votre site". Je suis curieux de savoir quel schéma de balisage vous avez déjà dans votre boutique en ligne et quelle est votre expérience en la matière. Si vous avez des questions ou des remarques, j'aimerais les entendre dans les commentaires !