0

Microdata – Enrichissez vos contenus web

Aujourd’hui c’est un article sur les Microdata que j’ai décidé de vous partager.

Les microdata, c’est quoi ?

Voila une bonne question. Les microdata sont des attributs de balise qu’on va mettre en place dans notre architecture html pour enrichir notre contenu. Vous avez tous déjà rencontré cela dans une recherche Google !

microdata_google

Comment je peux avoir sur mon site toutes ces informations .. Une image, un prix, une note, un fil d’ariane etc..? Et bien avec les microdata les amis :)

Les microdata, comment cela fonctionne ?

Tout est basé sur une structure simple, les Schémas : Schema.org

Dans un premier temps, il faut identifier le type de contenu. Ma page présente un produit ? une recette ? un livre ? Une fois que j’ai l’information je vais pouvoir trouver le schéma associé. Ensuite il faut taper dans le code.

On va prendre un exemple courant, celui d’un produit sur un site e-commerce. Le Schéma est donc celui-ci : http://schema.org/Product. Maintenant comment tout cela fonctionne ? et bien voilà le code :

	<div itemscope itemtype="http://schema.org/Product">
		<div>
			<span itemprop="name">Calculatrice</span>
			<span itemprop="price">59.00</span>
			<img src="/casio.png" itemprop="image" alt="Calculatrice" />
		</div>

		<div>
			<span itemprop="description">Super calculatrice de la mort !</span>
			<span itemprop="manufacturer">CASIO</span>
		</div>
	</div>

Résumons le fonctionnement :

  1. Je déclare que je vais enrichir un élément avec l’attribut : itemscope
  2. Je déclare de quel type il s’agit avec : itemtype
  3. Je précise pour chaque élément de quoi il s’agit avec : itemprop

La liste des attributs itemprop est justement disponible sur le site de Schema.org.

Voilà vous venez d’enrichir votre contenu à l’aide de microdata. D’ici quelques temps, dans les résultats de recherche vous pourrez voir apparaitre certaines informations comme le prix l’image etc. On peut déjà tester le rendu de notre site à l’adresse suivante :

http://www.google.com/webmasters/tools/richsnippets

Il existe d’autres balises comme itemref et itemid, mais je vous laisse la curiosité de regarder de quoi il s’agit !

Il s’agit là d’une introduction qu’il faut mettre en pratique. Vous pouvez ajouter les notes.. les prix .. les moyennes de prix … un auteur .. un éditeur .. enfin vraiment tout un tas d’informations intéressantes pour l’internaute et les moteurs de recherche.

Bonne découverte, n’hésitez pas à nous partager vos astuces sur le sujet.

A propos de Thibault

Thibault a écrit 17 articles sur le blog.

Les amis de nos amis sont nos amis, alors partageons !

Laissez un commentaire





Si vous êtes un vrai développeur, vous devez savoir compter.
Alors on vous met au défi !
Si vous réussissez cette épreuve, nous nous ferons une joie de lire votre commentaire.