From Microdata & Schema

To Rich Snippets

SMX Munich – Jan-Willem Bobbink

@jbobbink - http://www.notprovided.eu

WHO AM I?

VISIT US AT STAND NUMBER 16

MAJESTIC SEO AMBASSADOR

WHAT’S THE SEMANTIC WEB?

IS IT CODE?

STRUCTURE THE WEB?

W3C SEMANTIC WEB ACTIVITY

“The Semantic Web is a collaborative movement led by international standards body the World Wide Web Consortium (W3C). The standard promotes common data formats on the World Wide Web”

GOAL: EVOLUTION OF THE WEB

THE SEMANTIC WEB

Tim Berners-Lee:

“The Semantic Web provides a common framework that allows data to be shared and reused across application, enterprise, and community boundaries”

GOAL: CONVERTING THE WEB

LINKED OPEN DATA

STARTING POINT:

1. Make data available

2. Use specific markup languages

3. Data is available for everyone

ONLINE MARKETING POSSIBILITIES?

GOAL 1: SEO

GOAL 2: SOCIAL MEDIA

HOW MANY WEBSITES ARE USING MARKUP?

Use Amazon EC2, setup a crawler and crawl the top 1.000.000 Alexa URLs

Checked for occurrences of:

–Microdata / Schema

–OpenGraph

–Twitter Cards

CRAWLED AT 18-03-2014

RESULTS

- Crawled with 360/URLS/sec

- 68.4GB of data used

- 68% (683267 URLs) returned 200 OK

- 27% 30X Redirects

- 3% of domains had DNS issues

CRAWLED AT 18-03-2014

15,84%

14,55%

1,59%

1,32%

7,27%

2,69%

0,22%

OpenGraph Title

OpenGraph URL

Twitter:title

Twitter:url

Schema itemprop

Schema Itemprop Name

AggregateRating

USAGE STRUCTURED DATA

BASED ON 683K OF TOP MILLION ALEXA URLS

USAGE MICRODATA

Commercial tool: http://www.builtwith.com

USAGE OPEN GRAPH PROTOCOL

Commercial tool: http://www.builtwith.com

MANY OPPORTUNITIES!

MICROFORMATS – RDFa - MICRODATA

A BRIEF HISTORY

MICROFORMATS

• March 2003: rel="friend" was used

• 2004 during eTech, Tantek hosted a presentation titled “Real World Semantics”

• May 2009: Google announced parsing hCard, hReview and hProduct attributes

http://tantek.com/presentations/2004etech/realworldsemanticspres.html

RDFa

• First proposed in 2004, since 2012 RDFa 1.1 is recommended and can be used within HTML4 & 5

“The essence of RDFa is to provide a set of attributes that can be used to carry metadata in an XML language (hence the 'a' in RDFa).”

26-04-2010 - INTERNATIONALLY LAUNCHED

PREFERRED: MICRODATA “Microdata is a set of tags, introduced with

HTML5, that allows you to do this.”

SCHEMA.ORG: JUNE 2011

Which snippets can you use?

NOT EVERY STRUCTURE IS USABLE YET

REVIEW SNIPPETS

<div itemscope itemtype="http://data-vocabulary.org/Review-aggregate"> <span itemprop="itemreviewed">Several German beers</span> <img itemprop="photo" src="beer.jpg" /> <span itemprop="rating" itemscope itemtype="http://data-vocabulary.org/Rating">

<span itemprop="average">9</span> <span itemprop="best">10</span>

</span> <span itemprop="votes">24</span> <span itemprop="count">5</span>

</div>

PERSONAL SNIPPETS

<div itemscope itemtype="http://schema.org/Person"> <span itemprop="name">Jan-Willem</span> <img src="janwillem.jpg" itemprop="image" /> <span itemprop="jobTitle">International SEO</span> <div itemprop="address" itemscope itemtype="http://schema.org/PostalAddress">

<span itemprop="addressLocality">Amsterdam</span>, <span itemprop="addressRegion">- Europe</span> <span itemprop="postalCode">9999XX</span>

</div> </div>

PRODUCTS SNIPPETS

1. Products

2. Product offer

3. Product aggregated offer

BREADCRUMB SNIPPETS

Create multiple links to relevant pages within 1 entry in the SERPs.

CREATE COMBINATIONS

SOME URLs TO HELP YOU:

• Schema Creator by Raven http://schema-creator.org/

• Schema.org Generator http://www.microdatagenerator.com/

• Rich Snippets Testing Tool Bookmarklet • http://www.blindfiveyearold.com/rich-snippets-testing-tool-bookmarklet

• Everything you need to know to generate rich snippets: http://seogadget.com/micro-data-schema-org-guide-to-

generating-rich-snippets/

HOW TO IMPLEMENT? MAKE SURE:

1. You have specific data points available

2. SE’s accept specific markup language

3. SE’s accept certain snippets

4. Information within the SERPs is correct

• Implement code and check with the SE’s:

http://www.google.nl/webmasters/tools/richsnippets

DELAYS BECAUSE OF PROCESSING

PITFALLS

• Make sure all items are structured and nested in the correct way.

• Google Testing tool only shows errors based on missing elements, not on wrong coding!

KEEP CALM AND ADD SNIPPETS!

WMT: WHAT DOES GOOGLE SEE?

ERRORS ON PAGE LEVEL

WMT: DATA HIGHLIGHTER

DOES IT HELP YOUR RANKINGS?

“Google doesn’t use markup for ranking purposes at this time—but rich snippets can make your web pages appear more prominently in search results, so you may see an increase in traffic.”

Source: https://support.google.com/webmasters/answer/1211158?hl=en

RICH SNIPPET SPAM?

REPORT SPAM!

https://support.google.com/webmasters/contact/rich_snippets_spam

RISKS OF SPAMMING?

SHARE YOUR DATA?

STRUCTURED DATA FOR SOCIAL

“The Open Graph protocol enables any web page to become a rich object in a social graph. For instance, this is used on Facebook to allow any web page to have the same functionality as any other object on Facebook.”

OPEN GRAPH PROTOCOL

FACEBOOK: OPEN GRAPH

Start at: https://developers.facebook.com/docs/opengraph/

BASIC ELEMENTS

Use: http://ogp.me/

https://developers.facebook.com/docs/opengraph/

SPECIFY CERTAIN ELEMENTS

USE THE DEBUGGER TOOL!

WRONG DETAILS? CACHING ISSUES WRONG DETAILS? CACHING ISSUES

Use: https://developers.facebook.com/docs/opengraph/

TWITTER: TWITTER CARDS

TWITTER: EXAMPLE CODE

https://dev.twitter.com/docs/cards/validation/validator

WRONG DETAILS? CACHING ISSUES MAKE SURE YOU VALIDATE!

• Schema.org microdata

• Open Graph protocol

• Title + metadescription element

• Best guess from page content

MULTIPLE OPTIONS

Use: https://developers.google.com/+/web/snippet/

WRONG DETAILS? CACHING ISSUES GOOGLE+

USE YOAST SEO PLUGIN

USING WORDPRESS?

QUESTIONS?

http://www.notprovided.eu @JBOBBINK

Jan-Willem Bobbink

HTTP://WWW.NOTPROVIDED.EU/SMXDATA

PICTURE CREDITS: Linked Open data: http://commons.wikimedia.org/wiki/File:LOD_Cloud_Diagram_as_of_September_2011.png

Schema meme: http://www.fscinteractive.com/wp-content/uploads/2013/07/schema-rich-snippets-all-the-things-meme-560x345.jpg

Social meme: http://socialmediasatisfied.com/wp-content/uploads/2013/06/529797_10150904238024534_3188681_n.jpg

Possibility meme: http://makeameme.org/character/dr-evil-austin-powers

Matrix coding: http://indervilla.com/matrix-wallpapers/matrix-code-hd/

Image processing: http://www.habiledata.com/blog/wp-content/uploads/2013/05/image-processing-services.jpg

Spam: http://www.cj-weblog.nl/wp-content/uploads/2009/11/Spam.jpg

Changes: http://erinamsili.blogspot.de/2011/12/ch-ch-ch-changes.html

Obama meme: http://cdn.memegenerator.net/instances/250x250/38508282.jpg

THANKS FOR THE PICTURES!