The document discusses microformats and schema.org for marking up data on web pages. Microformats are simple, open data standards that use existing HTML elements and classes to semantically mark up information. Schema.org provides a shared vocabulary for structured data marking up people, organizations, events, reviews, products and more using JSON-LD, RDFa, or Microdata. Both aim to help search engines understand pages better but schema.org is controlled by major companies while microformats are more open and lightweight.

1. Format it!
Usage of microformats and schema.org
Dmitry Ivashutin at :iTechArt, Feb 2014

2. Microformats are:
A way of thinking about data
Design principles for formats
Adapted to current behaviors and usage patterns
Highly correlated with semantic XHTML
A set of simple open data format standards

3. Microformats are not:
A new language
Infinitely extensible and open-ended
An attempt to get everyone to change their behavior
and rewrite their tools
A whole new approach that throws away what
already works today

5. So what are
microformats?

6. Common address markup
<div>
<div>Dmitry Ivashutin</div>
<div>iTechArt Group</div>
<div>+1 732 917 06 32</div>
<a href="http://www.itechart.com/">
www.itechart.com
</a>
</div>

7. Adding styles
<div class="personal-info">
<div class="full-name">Dmitry Ivashutin</div>
<div class="company-name">iTechArt Group</div>
<div class="phone-primary">+1 732 917 06 32</div>
<a href="http://www.itechart.com/">
www.itechart.com
</a>
</div>

8. Are you an
inventor?

9. Don’t invent the wheel
<div class="vcard">
<div class="fn">Dmitry Ivashutin</div>
<div class="org">iTechArt Group</div>
<div class="tel">
<span class="type">Work</span>
<span class="value">+1 732 917 06 32</span>
</div>
<a class="url" href="http://www.itechart.com/">
www.itechart.com
</a>
</div>
Microformats hCard Creator

10. They are already here
hCard
geo
hAtom
adr
XFN
hCalendar
hReview
hProduct

11. What about
schema.org?

12. “Schema” style markup
<div itemscope itemtype="http://schema.org/Person">
<div itemprop="name">
Dmitry Ivashutin
</div>
<div itemscope itemtype="http://schema.org/Organization">
<a itemprop="url" href="http://www.itechart.com/">
<div itemprop="name">
iTechArt Group
</div>
</a>
<div itemprop="telephone">+1 732 917 06 32</div>
</div>
</div> Google Structured Data Testing Tool

13. Make the world search better

14. Prehistory of schema

15. Schema agreement

16. Pros and Cons

17. Pros and Cons
Microformats schema.org
“+”
❖ “semantic-ness”
➢ for services
➢ for extensions
➢ for SEO
❖ Open Web
“–”
❖ additional markup
❖ extra support
❖ extra attention to data
❖ no uniform support in
browsers
“+”
❖ generalized format
❖ rich formats
❖ SEO oriented
❖ strict and structured
❖ HTML5
“–”
❖ Big Three Agreement and
Closed Web
❖ agreement, not standard
❖ HTML5
❖ all other cons from
microformats

18. References
1. http://microformats.org
2. http://revolucao.etc.br/imagens/microformats_diagram_portug.jpg
3. http://coding.smashingmagazine.com/2007/05/04/microformats-what-they-are-and-how-
to-use-them/
4. http://schema.org/
5. http://schema-creator.org/
6. https://support.google.com/webmasters/answer/1211158?hl=en