Microsocial: How tiny bits of data can make or break your WordPress website

Seen and unseen, tiny bits of data are hard at work on every website. Search engines and social networks are using this information. But are you making them work for you? Microformats, microdata, metadata : what are they, what do they do, and how can you use them to attract visitors and improve SEO on your WordPress site.

This will be a presentation in three parts: a brief introduction to structured data, some easy actionable steps for the intermediate blogger, and some code examples for those hoping to integrate microformats or microdata into their WordPress themes and plugins.

Transcript

1. Microsocial
   How tiny bits of data can make
   or break your WordPress website
   Shannon Smith
   WordCamp Montréal 2013
   All rights reserved © Café Noir Design Inc., 2013
   

   View Slide

2. Shannon Smith
   Web Developer
   Café Noir Design
   www.cafenoirdesign.com
   @cafenoirdesign
   

   View Slide

3. O father, what a hell of witchcraft lies
   In the small orb of one particular tear.
   -William Shakespeare
   

   View Slide

4. What We’ll Cover
   1. Structured Data. What is it?
   2. Solutions for bloggers
   3. Code for developers
   

   View Slide

5. Does It Really Matter?
   

   View Slide

6. “Yes.”
   -Google, Yahoo, Facebook, Twitter
   

   View Slide

7. Structured Data
   

   View Slide

8. What Is Structured Data?
   

   View Slide

9. What Is Structured Data?
   Data with Meaning
   

   View Slide

10. What Is Structured Data?
    “I have a dream for the Web [in which computers]
    become capable of analyzing all the data on the
    Web – the content, links, and transactions between people and
    computers. A "Semantic Web", which makes this possible, has yet to
    emerge, but when it does, the day-to-day mechanisms of trade,
    bureaucracy and our daily lives will be handled by machines talking
    to machines. The "intelligent agents" people have touted for ages will
    finally materialize.”
    Tim Berners-Lee
    

    View Slide

11. What Is Structured Data?
    Context for Machines
    

    View Slide

12. A Brief History of Structured Data
    1995 Dublin Core
    2004 RDFa
    2006 Microformats (μF)
    2009 Microdata (part of HTML5)
    2011 Schema.org (Bing, Google and Yahoo!)
    2012 Open Graph protocol (Facebook)
    2012 Twitter Cards
    

    View Slide

13. What Is Microdata?
    By adding additional tags to the HTML of your web pages—
    tags that say, "Hey search engine, this information describes this
    specific movie, or place, or person, or video"—you can help
    search engines and other applications better
    understand your content and display it in a useful,
    relevant way.
    Microdata is a set of tags, introduced with HTML5, that
    allows you to do this..
    -Schema.org
    

    View Slide

14. What Is Microdata?
    If Google understands the content on your pages, we can create
    rich snippets—detailed information intended to help
    users with specific queries.
    -Google
    

    View Slide

15. What Does Structured Data
    Look Like?
    

    View Slide

16. What Does Structured Data
    Look Like?
    

    View Slide

17. What Does Structured Data
    Look Like?
    

    View Slide

18. Who Is Using Structured Data?
    1.Search Engines
    2.Social Networks
    

    View Slide

19. Who Is Using Structured Data?
    Facebook
    vs.
    

    View Slide

20. Who Is Using Structured Data?
    Twitter
    

    View Slide

21. Who Is Using Structured Data?
    Google Authorship
    

    View Slide

22. Who Is Using Structured Data?
    Google Search
    

    View Slide

23. Who Is Using Structured Data?
    Specialized Search
    

    View Slide

24. Who Is Using Structured Data?
    Everyone.
    LinkedIn flickr Google+ Lego
    Last.fm Google Maps Target
    BestBuy TripAdvisor Twitter
    Zappos Wikipedia Amazon
    Apple store Anthropologie
    Office Depot Costco Netflix
    Google Search Toys ‘R Us NYT
    

    View Slide

25. How Can You Leverage Up?
    Add structured data that is...
    • standards-compliant
    • semantic
    • tested
    •useful
    

    View Slide

26. “More Structured Data, Please.”
    -Bloggers
    

    View Slide

27. Yoast SEO Plugin
    

    View Slide

28. hCard Creator
    http://microformats.org/code/hcard/creator
    

    View Slide

29. hCalendar Creator
    http://microformats.org/code/hcalendar/creator
    

    View Slide

30. hReview Creator
    http://microformats.org/code/hreview/creator
    

    View Slide

31. rel tags
    http://microformats.org/code/hreview/creator
    
    rel="author">Erin  Smith
    @t
    

    View Slide

32. Other Plugins
    

    View Slide

33. Is It Working?
    Structured Data Testing Tool
    

    View Slide

34. “More Structured Data, Please.”
    -Developers
    

    View Slide

35. What Can I Code?
    

    View Slide

36. Structured Data Markup Helper
    

    View Slide

37. What Does Structured Data
    Look Like?
    

    View Slide

38. What Does Structured Data
    Look Like?
    

    View Slide

39. What Does Structured Data
    Look Like?
    

    View Slide

40. Where Do I Add hCards
    to WordPress?
    author.php
    page-­‐contact.php
    functions.php
    get_template_part
    widget
    shortcode
    

    View Slide

41. What Does Structured Data
    Look Like?
    

    View Slide

42. What Does Structured Data
    Look Like?
    

    View Slide

43. Where Do I Add Reviews/Products/
    Events to WordPress?
    single-­‐review.php
    single-­‐product.php
    taxonomy-­‐event.php
    functions.php
    custom  fields  /  meta  boxes
    

    View Slide

44. Where Do I Add Reviews/Products/
    Events to WordPress?
    

    View Slide

45. Where Do I Add Reviews/Products/
    Events to WordPress?
    http://www.techburnett.com/add-review-micro-data-to-wordpress.html
    

    View Slide

46. Is It Working?
    Structured Data Testing Tool
    

    View Slide

47. The greatest task before civilization at
    present is to make machines what they
    ought to be, the slaves, instead of the
    masters of men.
    Havelock Ellis
    

    View Slide

48. Shannon Smith
    Web Developer
    Café Noir Design
    Get the slides:
    http://chroni.ca
    www.cafenoirdesign.com
    @cafenoirdesign
    

    View Slide