Le document traite de l'importance et de l'implémentation de microformats, RDFa et microdatas pour améliorer la présentation des informations sur les moteurs de recherche. Il donne des exemples spécifiques tels que vCard, hRecipe, et hCalendar tout en discutant des défis rencontrés lors de leur intégration, notamment des problèmes de validité et de conflits. Enfin, il mentionne des cas pratiques pour illustrer ces concepts, comme coup de pouce et recettes.qc.ca.

1. 14 mars 2012
Camp #2
#doyouseo – www.doyouseo.ca Julien Lord et Arnaud Mangasaryan

2.  L’importance des rich snippets.
 L’élaboration des sujets de
discussions.

3. Sitelinks
Author
Microformats, RDFa, Microdata

4. Meta
description
Titre <h1>
4

6. 6

7. Depuis octobre 2007...
7

8. Sitelinks
Author
Microformats, RDFa, Microdata

9. G+ profile
9

10. Un markup peu complexe à
implanter...
10
http://support.google.com/webmasters/bin/answer.py?hl=en&answer=1408986

11. 11

12. 12

13. 13

14. Sitelinks
Author
Microformats, RDFa, Microdata

15. hRecipe
15

16. hCalendar/hEvent
16

17. hReview
17

18. Un microformat est une approche de formatage de données qui cherche à réutiliser
le contenu existant en n'utilisant que des classes et attributs HTML.
Langages
- HTML4, HTML5, XHTML1.
Navigateurs, clients et moteurs supportés
- Firefox 3+ (Tails Export)
- Microsoft Outlook et Apple Mail (vCard)
- Google
Exemple
<div class="vcard">
<span class="fn">Julien Lord</span>
<div class="org">TC Media</div>
<div class="adr">
<div class="street-address">1100 René Lévesque</div>
<span class="locality">Montréal</span>,
<span class="region">Québec</span>,
<span class="postal-code">H3B 4X9</span>
</div>
</div>
18

19. Les plus populaires
 vCard : carte d’affaire, contacts cellulaires.
 hRecipe : modèle efficace et supporté au Canada.
 hReview : format pouvant être greffé à d’autres microformats
(hrecipe, hproduct).
 hCalendar : pris en charge par des applications calendrier.
 hEntry : très populaire sur les blogs, lister des billets.
http://microformats.org/
19

20. • RDFa est un ensemble d'éléments et d'attributs conforme au modèle Resource
Description Framework (RDF) : des données décrites en RDFa peuvent donc être
facilement transformées en données RDF.
Langages
- XHTML 1.1, XHTML 2, XML.
Exemples
<div xmlns:dc="http://purl.org/dc/elements/1.1/" about="http://www.example.com/books/wikinomics">
<span property="dc:title">Wikinomics</span>
<span property="dc:creator">Don Tapscott</span>
<span property="dc:date">2006-10-01</span>
</div>
20

21. Les microdatas sont une fonctionnalité HTML5 créée afin d'offrir du contenu
sémantique ,c’est un juste milieu entre RDFa et Microformats.
Langages
- HTML5
Navigateurs et moteurs de recherche supportés
- Opera 11.6
- Autres navigateurs : Librairie MicrodataJS
- Bing, Google, Yahoo (Schema.org)
Exemple
<section itemprop="address” itemscope itemtype="http://data-vocabulary.org/Address">
J’habite à <span itemprop="street-address">1234 Peel</span>,
<span itemprop="locality">Montréal</span>,
<span itemprop="region">Québec</span>.
</section>
Type: address
street-address = 1234 Peel
locality = Montréal
region = Québec
21

22. Le cas Coup de Pouce
 Implantation risquée (production).
 Problèmes avec temps de cuisson.
 Conflits avec d’autres microformats.
 Utilisation du validateur Rich Snippets Testing Tool.
22

23. 23

24. 24

25. 25

26. Le cas Recettes.qc.ca
 Plusieurs gabarits à supporter.
 Duplication MSN.
 Support direct de Google avec exemples spécifiques !
26

27. Merci !
www.doyouseo.ca
#doyouseo
info@doyouseo.ca