What's New With Structured Markup: 2017 Update By Eric Enge

48
#SMX #22A1 @stonetemple 2017 Update by Eric Enge What’s New With Structured Markup?

Transcript of What's New With Structured Markup: 2017 Update By Eric Enge

Page 1: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

2017 Update by Eric Enge

What’s New With Structured Markup?

Page 2: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

2017 Update by Eric Enge

What’s New With Structured Markup?

Page 3: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

ERIC ENGE, CEOSTONE TEMPLE CONSULTING

2016 Landy’s Search Marketer of the Year2016 US Search Awards Search Personality of the Year

Eric’s Studies Have Been Covered In:

Page 4: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

What is Structured Data?

Page 5: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Definition of Structured Data

Structured data refers to any data that resides in a fixed field within a record or file. This includes data

contained in relational databases and spreadsheets

Source: Webopedia

Page 6: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

What is Schema.org?

Schema.org is a joint effort, in the spirit of sitemaps.org, to improve the web by creating a structured data markup schema

supported by major search engines. On-page markup helps search engines understand the information on web pages and

provide richer search results.

Source: Schema.org

Page 7: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

“If Google were to implement major search functions solely based on people implementing Schema correctly,

it would be a very empty search engine”

Page 8: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Example for King Castle Hotel - Text

Page 9: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Example for King Castle Hotel – No Schema

Page 10: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Example for King Castle Hotel – With Schema

Page 11: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

But, There is a Difference in the Code

Page 12: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

And, Also in the SERP

Page 13: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Google’s John Mueller

"One thing that you can do to test …. whether or not your site is high quality or

not is to do a site: query to look at the pages that were indexed, and if the site query

shows rich snippets in the search results, but the normal searches don't show it then

usually that's a sign that from a quality point of view we don't quite trust your site

perfectly yet.“

https://www.youtube.com/watch?v=EaSyuH2D7Mw&t=6m20s&t=6m20s

Page 14: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Rich Cards

Page 15: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Page 16: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Rich cards are a new Search result format building on the success of rich snippets. Just like rich snippets, rich cards use schema.org structured markup to display content in an even more engaging and visual format, with a focus

on providing a better mobile user experience.

https://webmasters.googleblog.com/2016/05/introducing-rich-cards.html

Page 17: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Rich Cards Announced in May 2016

Page 18: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Still Available

Only in the US

Expanded in November 2016

Page 19: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Social Media Structured Data

Page 20: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

The Open Graph Protocol

“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”

Source: ogp.me

Page 21: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

og:title - The title of your object as it should appear within the graph, e.g., "The Rock”.

og:type - The type of your object, e.g., "video.movie". Depending on the type you specify, other properties may also be required.

og:image - An image URL which should represent your object within the graph.

og:url - The canonical URL of your object that will be used as its permanent ID in the graph, e.g., "http://www.imdb.com/title/tt0117500/".

Required on Every Page

Page 22: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

OG:Image

OG:Title

OG:Description

Page 23: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

With No OG Tags• Image defaults to the post

featured image (but if no featured image was set in Wordpress, could be any random image from the post).

• Title is the post title • Description is just the first few

lines (truncated) of the post.

Page 24: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Facebook Instant Articles

Page 25: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Corresponding Web Page Must Have:• OG: Title• OG: Description• OG: Image

This Lightning Bolt Indicates an FIA

Page 26: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Apple News

Page 27: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

OpenGraphTags

Schema

Page 28: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Structured Data and AMP

Page 29: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Google’s Accelerated Mobile Pages (AMP)

Supports:• Schema.org• JSON-LD• Microdata

• Open Graph• Twitter Card

Page 30: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Topic Specific

Site Specific

Requires:• Article, NewsArticle,

BlogPosting, or VideoObject type

• image and logo information

If no structured data, your page will only show as a blue link

AMP News Carousels

Page 31: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

• Support Added: Nov 21, 2016

• Requires:• Restaurant list pages

in AMP HTML with ItemList markup

• Individual restaurant pages with Restaurant markup

Host-Specific Lists For

Restaurants

Page 32: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Latest Updates on Structured Data

bit.ly/sdataeventsSource: Aaron Bradley

Page 33: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

GTIN

Page 34: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Global Trade Item Numbers (GTIN)

Page 35: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

• Global Trade Item Number (GTIN) is an identifier for trade items• Used to look up product information in a database • Allows matching of a product in one database with the same

product in another database

Schema.orgExtension

Specific to e-commerce

Adds “many more detailed

properties”

What is GTIN?

Page 36: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

May 2016: GTINRequired for all

Google ShoppingProducts

Page 37: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

GTIN Recommended to Show Product Info in an Image Search

Page 38: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Structured Data Testing Tool

Page 39: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Page 40: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Page 41: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

JSON-LD

Page 42: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

“JavaScript Object Notation… is an open-standard file format that uses human-readable text to transmit data objects consisting of attribute–value pairs and array data types ” (Wikipedia)

JSON-LD (Linked Data) uses JSON in a specific context to enable Linked Data, and is used by schema.org as a way to encode Structured Data.

JSON and JSON-LD

{“menu”: {“id”: “file”,“value”: “File”,“popup”: {

“menuitem”: [{“value”: “New”, “onclick”: “CreateNewDoc()”},{“value”: “Open”, “onclick”: “OpenDoc()”},{“value”: “Close”, “onclick”: “CloseDoc()”},

]}

}}

<script type=“application/ld+json”>{

“@context”: “http://schema.org”,“@type”: “PostalAddress”,“addressCountry”: “United States”,“addressLocality”: “Mountain View”,“addressRegion”: “CA”,“name”: “Google Inc.”, “postOfficeBoxNumber”: “1234”,“postalCode”: “94043”

}</script>

Sample JSON Sample JSON-LD, Including Script Tag

Page 43: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Structured Data encoded in JSON-LD is placed in a SCRIPT block in the document HEAD.

• Separates the content from the document BODY.

JSON-LD Structured Data is not dependent on the HTML to be properly nested.

Improper nesting of Structured Data is a common mistake

Machines can read Structured Data content without parsing the entire document.

How is JSON-LD used for Structured Data?

Page 44: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

• Microdata can be added to a document by placing attributes in the pertinent HTML tags

• Familiarity with HTML is sufficient to implement Microdata• JSON-LD requires some amount of understanding of JavaScript or at least JSON

More complex from a coding standpoint

• Structured Data content exists both in the BODY HTML and in the HEAD HTML• Microdata turns the content in the BODY HTML into Structured Data

For most sites, JSON-LD requires duplicating data

What are the downsides of JSON-LD?

Page 45: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Eric [email protected]@stonetemple+Eric Enge

ThankYou!

Stone Temple [email protected]@stc_corp(508) 879-0995

Page 46: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

LEARN MORE: UPCOMING @SMX EVENTS

THANK YOU! SEE YOU AT THE NEXT #SMX

Page 47: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetempleYou Can Use This Space for A Subtitle

TITLE SLIDE ALTERNATIVE LAYOUT

Page 48: What's New With Structured Markup: 2017 Update By Eric Enge

#SMX #22A1 @stonetemple

Use Impact Visuals Above, Move Presentation Title As Needed

TITLE SLIDE ALTERNATIVE LAYOUT w/ *EXAMPLE* IMAGE

(SWAP IN YOUR OWN AS NEEDED)