Un tour d'horizon du balisage sémantique schema.org en 2016.

1. PROFITER CONCRETEMENT DU BALISAGE
SEMANTIQUE SCHEMA.ORG
Comment révolutionner votre contenu
TUNISEO 2016

2. ASLAMA!
Je suis Erlé ALBERTON
Responsable SEO des Boutiques Online
Orange et Sosh et Ex-developpeur
@cubilizer

3. INTERVIEWVoyons un peu qui se cache dans la salle

4. LEVEZ LA MAIN SI
◉ vous êtes développeur
◉ vous avez une adresse physique pour votre entreprise
◉ vous envoyez des newsletters
◉ vous vendez des tickets pour des événements
◉ vous vendez des produits en ligne
◉ vos clients écrivent des avis sur ces produits
◉ vos clients ont une adresse Gmail

5. “Bouclez votre ceinture,
éteignez vos smartphones vous
n’aurez pas le temps de tweeter
*
PNC aux portes

6. CECI EST UNE REVOLUTION !
La phrase “OK Google” va
devenir la phrase la plus
utilisée dans le monde dans les
années qui viennent
Place your screenshot here

7. Place your screenshot here
CECI EST LA VRAIE REVOLUTION !
Schema.org (prononcez SKIMA)
explique, définit et regroupe
toutes les hierarchies des
“entités” existantes

8. “J’ai fait un rêve dans lequel les ordinateurs
deviennent capables d’analyser toutes les
données sur le Web - le contenu, les liens, et les
transactions entre les personnes et les
machines. [...] où tous les aspects de nos vies
quotidiennes seront traités par des machines
dialoguant avec d'autres machines.
Sir Tim Berners Lee

9. Introduction des concepts
de Sémantique Web
Reprenons du début 1

10. LE WEB SEMANTIQUE - WEB 3.0
◉ Le Web de données à vu le jour dans les années 90 avec la
structure RDF - Resource Description Framework
◉ La norme Schema.org Juin 2011 (version actuelle 2.2)
◉ HTML 5 finalisé en Octobre 2014
Le WEB sémantique n’est pas une révolution,
c’est son exploitation par Google qui en est une !

11. LA SEMANTIQUE C’EST :
l’étude de l’être en tant qu’être
c'est-à-dire l'étude des
propriétés générales de tout ce
qui existe
l'ensemble structuré des termes et
concepts représentant le sens d'un
champ d'information, que ce soit par
les métadonnées d'un espace de
noms, ou les éléments d'un
domaine de connaissances

12. COMMENT CA MARCHAIT AVANT ? RDF
Le Triplet RDF est un Graph Orienté qui permet de lier deux concepts “entités”
Sujet
Objet
prédicat Shakespeare
Romeo et
Juliette
a écrit
Artiste
Oeuvre
littéraire
est un
est une

13. BEURK ! LE SLIDE PLEIN DE CODE
Vocab:
http://schema.org
Typeof:
Restaurant
Property:
Name, address, servesCuisine,
priceRange, openingHour, …
! aggregateRating:
Property & typeOf

14. La structure de l’exemple précédent

15. COMMENT CA MARCHE AUJOURD’HUI ? Microdata
Schema.org ce n’est pas un
language c’est une collection
de syntaxes et de
vocabulaires, hierarchisée et
structurée
itemScope
Déclare le début d’une
nouvelle Entité
itemProp
Liste les propriétés
de l’entité
itemType
Cadre le type de
l’entité

16. C’EST TRES RESSEMBLANT AU PREMIER CODE
itemScope
itemType :
http://schema.org/Restaurant
itemProp:
Name, address, servesCuisine,
priceRange, openingHour, …
! aggregateRating:
itemProp & itemScope & itemType

17. UNE VUE DU SITE SCHEMA.ORG
Un “Event” hérite de
l’entité mère “Thing”
Il a des propriétés qui
lui sont propres :
Date, location, offers,
Organizer,
performers…
Et des entités filles qui
sont des types
d’événements
particuliers

18. UNE ADOPTION QUI LAISSE BEAUCOUP DE PLACE

19. COMMENT CA MARCHERA DEMAIN (aujourd’hui) ?

20. COMMENT CA MARCHERA DEMAIN (aujourd’hui) ?
Le Json est le format le plus léger pour les
échanges #M2M MachineToMachine
Il est massivement adopté par les
développeurs pour créer des #API
Schema.org normalise la structure du
langage

21. J’AI TOUTE VOTRE ATTENTION ?

22. Rassurez-vous ! vous faites déjà de
la sémantique :)
Dans sa version 5, la spécification du langage HTML
permet d’ouvrir la porte à des balises purement
sémantiques comme main, header, footer, nav,
aside, section. Elles viennent s’ajouter aux balises
h1...n, title, meta, em, strong, ul/li,
ol/li, dd/dt, figure, blocquote, time, date,
que les développeurs et aujourd’hui les SEO doivent
utiliser de façon optimale pour favoriser la qualité du
code source.
Puisque c'est bien de qualité dont il est question !
Extrait de mon article sur abondance.com :
http://recherche-referencement.abondance.com/2015/09/le-balisage-
semantique-next-seo-big.html

23. Les nouveautés
Le web évolue très vite 2

24. WEB 1 Read only
XML / HTML
WEB 2 Interact
AJAX
WEB 3 Semantic
SCHEMA.ORG

25. LES NOUVEAUTES
Du coté de Google
◉ Rich Snippets
◉ Knowledge Graph
◉ Direct Answers
◉ Top box
◉ Related Search
◉ Google Now
Coté technique
◉ JSON-LD
◉ API
◉ Deep linking

26. Différentes sources de données un
seul objectif la Connaissance
globale et la compréhension du
monde physique
Comprendre le monde c’est
potentiellement mieux
comprendre les requetes des
utilisateurs
C’est la base des moteurs de
réponses

27. La partie facile
Les Rich Snippets 3

28. Les chemins de fer : breadcrumb

29. Sitelinks Search Box :
commencer l’experience de votre site dès Google

30. Les avis clients !
Augmentation instantanée du CTR (kpi indirect pour le ranking)
Un balisage imbriqué
Product
Review
Review
Review
...

31. Optimiser son KnowledgeGraph

32. Les événements :
Avec cette méthode gratuite doubler la taille de votre réponse

33. Les pages de listing produits
Créer des tableaux JSON-LD

34. Soyons plus malins
Trouver des idées grâce à schema.org 4

35. Je suis une agence de location à Tunis
● J’ai donc une propriété adresse schema.org
● un Knowledge Graph avec mon logo, mes
comptes sociaux, mes numéros de teléphone
● mes clients peuvent laisser des avis sur mon
agence ou mes appartements
Comment enrichir mon contenu ?
Je créé des événements liés à mon activité
Je peux créer une page sur la résidence dans lequel
l’appartement est disponible
Une page sur ma ville avec les données disponibles
Gratuitement grâce à l’open Data
Je peux envoyer des mails enrichis avec les données de
réservation

36. “
Quoi, des mails enrichis avec
schema.org ?

37. 88 440 000 000emails envoyés par jours (hors spam)
A quoi correspondra ce chiffre en 2017 ?

38. Google lit TOUS vos emails

39. ENRICHIR LES MAILS AVEC SCHEMA.ORG

40. GOOGLE NOW
Votre assistant personnel
intelligent
#AI #M2M #MachineLearning
Place your screenshot here

41. Place your screenshot here
GOOGLE INBOX
L’enrichissement de vos mails
devient une nouvelle manière de
travailler votre image de marque
et vous donne un avantage sur la
relation client 3.0

42. Les best practices
Il ne faut pas faire n’importe quoi attention à la
pénalité pour sur-optimisation
5

43. #RTFM
Google tient à jour toute la
documentation afin de faire adhérer
les éditeurs de sites à la technologie
https://developers.google.com/structured-data/

44. HOW TO ?
La technique pour appliquer le balisage sémantique est assez simple :
1. déterminer l’objet ou l’item à décrire, il sera le scope
2. déterminer son type le plus précisément possible
3. décrire les propriétés héritées de la définition par type
4. n’hésitez pas à imbriquer les objets dès que cela est possible

45. CONTENU UNIQUE / SCHEMA UNIQUE
Comme pour la création de votre contenu :
vous devez décrire une seule entité par page
elle peut imbriquer d’autres entités de contexte - ne pas trop les décrire
Donc on ne duplique pas le code Webiste du header sur toutes les pages

46. AJOUTEZ LES DONNEES NON VISIBLES
Utiliser au maximum la norme HTML5 - penser à nourrir le KnowledgeGraph
<Meta /> en coeur de page

47. Test and Try and Learn and
Test and Try and Learn ...
La qualité est un KPI important pour Google 5

48. EN TROIS TEMPS
En DEV/REC
Vous devez constamment
savoir si votre intégration
est correcte
Problème :
Le code est en local
En PROD
Vous êtes certain de votre
intégration, mais vous
n’êtes pas Google
Problème :
Google a-t-il bien compris ?
En RUN
Vous avez fait des mises à
jour, changer l’équipe de
DEV, votre client ne vous
comprend pas
Problème :
Comment suivre
l’évolution de ma qualité ?

49. GARANTIR LA QUALITE DE SON CODE SOURCE DEV/REC
Tester son code grâce à l’outil
“Structured Data Testing Tool”
avant de passer en Prod pour
garantir la qualité du balisage
sémantique

50. Place your screenshot here
GOOGLE SEARCH CONSOLE
Vos données sémantiques vues
par Google… C’est important
de savoir ce qui est vraiment
compris
GARANTIR LA QUALITE DE SON CODE SOURCE PROD

51. Tester Gratuitement OnCrawl avec le code : TUNISEO
Crawler de manière récurrente
le site pour suivre les
changements éventuels
GARANTIR LA QUALITE DE SON CODE SOURCE RUN

52. Quel est le nom anglais
des affichages enrichis ?

53. MERCI!
Des questions?
Si vous êtes timide
@cubilizer / erle.alberton@gmail.com

54. CREDITS
Special thanks to all the people who made and
released these awesome resources for free:
◉ Presentation template by SlidesCarnival
◉ Photographs by Unsplash