Prezentace pro Frontendisti.cz od Pavla Ševčíka. Záznam přednášky na YouTube: https://youtu.be/8Le8HVpzWlM

1. Microdata a Rich snippets
Pavel Ševčík | @pajasevi

2. K čemu to je?
Vylepšení SEO
Zobrazení Rich snippets ve výsledcích
Zobrazení action buttonu v Gmailu
Způsob jak dát kódu kontext

4. Nedávná historie

5. Mikroformáty - čiré zlo
Řízené pomocí class atributů
Určují strukturu kódu
Malé množství schémat

8. Microdata správně

9. Typy
Článek (datum vydání, autor)
Produkt (výrobce, typ, cena)
Událost (datum, čas, místo)
Recept (ingredience, hodnocení)
Organizace (název, sídlo)
A mnoho dalších

11. Jak na to
itemscope - říká “tady jsou microdata, sem se dívej robote”
itemtype - určuje typ dat(schéma), která jsme použili
itemprop - určuje danou vlastnost

12. Předtím
Potom

13. Se zanořením

14. Rich snippets

17. E-mailing
Přidání action buttonu
Chytré karty v Google Now
Co přinese budoucnost :)

19. Testování
Structured Data Testing Tool
Analyzuje z URL nebo vloženého kódu
Ukáže chyby a napoví
Bonus: URL automaticky zaindexuje do Google search

21. Nevýhody
Jsou stále moc invazivní do kódu
Stávají se nepřehledné (nejen) při zanořování
Dlouhodobá spravovatelnost

22. Budoucnost
(současnost)

23. JSON-LD
Serializovaná strukturovaná data
Specifikace W3C, doporučeno Googlem
Nepřekáží v kódu a vše je krásně pohromadě

25. Důležité odkazy
Schema.org - nejlepší zdroj schémat
Structured Data Testing Tool - testování Microdat
E-mail Markup Tester - testování e-mail markupu
Markup Helper - pomocník pro vytváření Microdat

26. Děkuji za pozornost
Pavel Ševčík | @pajasevi