serps to markup: how to increase your earned traffic

@petecampbell [email protected]

From SERPs to Markup How to Increase Your Earned Traffic


THE FUTURE OF GOOGLE SEARCH


THE STAR TREK COMPUTER


“The destiny of [Google search] is to become the Star Trek computer, and that’s what we are building” Amit Singhal – Google SVP Search, 2013


“You could ask it a question and it would tell you exactly the right answer, and sometimes it would tell you things you needed to know in advance, before you could ask it.” Amit Singhal – Google SVP Search, 2013


WE’RE GETTING THERE ALREADY!


OK GOOGLE SEARCH WITHOUT THE KEYBOARD


KNOWLEDGE GRAPH TELLS YOU EXACTLY THE RIGHT ANSWER


GOOGLE NOW TELLS YOU THINGS IN ADVANCE


HOW FAR WE’VE COME GOOGLE’S ‘MIND-READER’ APRIL FOOLS PRANK


THE SHIFT TO MOBILE


“More Google searches

take place on mobile

devices than on

computers in 10

countries including the

US and Japan.” ”

Jerry Dischler, Google VP, May 2015


BUT MOBILE USERS PREFER APPS OVER BROWSERS


“Discover has been driving millions of pageviews per day for its partners”

SNAPCHAT DISCOVER CAUSES A REVOLUTION 50% GROWTH IN MOBILE DATA USAGE


FACEBOOK INSTANT DITCHES THE BROWSER IN-APP ARTICLES

“Instant Articles load 10x faster than the mobile web”


THE CHALLENGE FOR SEO


1 IN 4 SEARCHES FEATURE THE KNOWLEDGE GRAPH


PPC & ANSWER BOXES 0% ORGANIC SERP’S


HOTEL KNOWLEDGE GRAPH


ORGANIC SERP CLICKS ARE FALLING

0 5

10 15

20 25 30 35 40 45

2006 2010 2014

% C

TR

POSITION 1 CLICKTHROUGH RATE %


GOOGLE SEARCHES ARE ALSO FALLING

Source: Google Official History, Comscore, Statistic Brain Research Institute

2.04

2.06

2.08

2.1

2.12

2.14

2.16

2.18

2013 2014

Tri

llio

ns

ANNUAL GOOGLE SEARCHES


MicroData Markup (JSON-LD & HTML)

Push & Resyndicate Content via APIs Open Graph Tags

Google Now Card Markup

Create App Version of Mobile Site

5 THINGS YOU CAN DO TO EMBRACE THE CHANGE


From SERPs to Markup How to Increase Your Earned Traffic


PETE CAMPBELL / KAIZEN •  Founder / Managing Director

•  Kaizen is a team Content Marketing & Technical SEO specialists

•  “Rising Star of the Year” (Travolution Awards)

•  6+ Years in Agency & In-House Roles

•  Built first website at 11

•  Ran several high-traffic video gaming sites

•  Proud owner of a Game Boy Colour


WARNING – CODE INCOMING


Get in Touch: @petecampbell [email protected] https://www.kaizensearch.co.uk/

DOWNLOAD THESE SLIDES KAIZENSEARCH.CO.UK/BRIGHTON

Don’t Panic!


MOST OF THE INTERNET LOOKS LIKE THIS TO GOOGLE


MICRODATA CAN SOLVE THIS PROBLEM

“A form of HTML mark-up

primarily used to help search

engines better understand a

web-pages content such as

company details, product

reviews and video”


BEFORE

DEPARTMENT STORE WEBSITE


AFTER

TOYS

CLOTHING CLEANING

BEDROOM

JUST PLAIN OLD CRAP

STORAGE

DEPARTMENT STORE WEBSITE


66% OF THE TOP 100K WEBSITES HAVE NO

MICRODATA https://www.similartech.com/categories/document-standard


WHY USE MICRO-DATA?

•  Increase CTR by 30%+

•  Gain SERPs for Semantic KW’s

•  Lower Bounce Rate by 10%+


THE MOST USED MICRODATA TYPES

OPEN GRAPH

33.7% SCHEMA

<12% * At least one tag https://www.similartech.com/categories/document-standard


SCHEMA


WHAT IS SCHEMA.ORG? I’LL LET THE KNOWLEDGE GRAPH TAKE THAT ONE


TWO WAYS TO IMPLEMENT SCHEMA.ORG

HTML JSON-LD * At least one tag https://www.similartech.com/categories/document-standard


BUT WHICH IS BETTER?

NERD FIGHT


JSON-LD

•  Lightweight & Efficient Code

•  Easiest to Implement: Copy & Paste

•  No HTML Knowledge Needed

•  Google Hinting at JSON-LD Preferred

•  Risk of Repeated Content within Code

•  Newer, Some Markup Still Being Defined


HTML MICRODATA

•  Better Supported

•  More Suitable for Longer-Form Content

Such as Reviews, Articles

•  Makes ‘Ugly-Looking’ Code

•  Requires HTML Knowledge


CONCLUSION

USE BOTH


Knowledge Graph (Organization)

Interactive Breadcrumbs

Sitelinks Search Box (SearchAction)

Blogs & Articles Star Ratings (AggregrateRating)

SCHEMA MARKUPS EVERY BRAND SHOULD BE USING


LOGO, PHONE NUMBER & SOCIAL MEDIA LINKS ‘ORGANIZATION’ SCHEMA

REQUIREMENTS •  150px x 150px Logo •  Customer Service Number •  Social Media URLs

SUPPORTED SOCIAL PROFILES •  Facebook •  Twitter •  Google+ •  Instagram •  YouTube •  LinkedIn •  Myspace •  Pinterest •  SoundCloud •  Tumblr


LOGO, PHONE NUMBER & SOCIAL MEDIA LINKS ‘ORGANIZATION’ SCHEMA

RECOMMENDED – JSON-LD MARKUP<script type="application/ld+json">{ "@context" : "http://schema.org","@type" : "Organization","name" : "Company Name","logo" : "http://www.domain.com/logo.png","url" : "http://www.domain.com/","contactPoint" : [{ "@type" : "ContactPoint", "telephone" : "+44-2078225951", "contactType" : "customer support" }],"sameAs" : ["https://www.facebook.com/company-name","https://twitter.com/company-name","https://www.linkedin.com/company/company-name","https://plus.google.com/company-name/posts"]}</script> * Customise Red Values

https://developers.google.com/structured-data/customize/overview


TEST YOUR MARKUP

https://developers.google.com/structured-data/testing-tool/


DISPLAY AN INTERACTIVE BREADCRUMB TRAIL ‘BREADCRUMB’ DATA VOCABULARY

REQUIREMENTS •  Display a Visual Breadcrumb Trail to Users

On-Site Breadcrumb


DISPLAY AN INTERACTIVE BREADCRUMB TRAIL ‘BREADCRUMB’ DATA VOCABULARY

RECOMMENDED – HTML MICRODATA MARKUP

<ul><li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="https://www.domain.co.uk/" itemprop="url"><span itemprop="title">Home</span></a></li><li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><a href="https://www.domain.co.uk/category-name/" itemprop="url"><span itemprop="title">Category Name</span></a></li><li itemscope itemtype="http://data-vocabulary.org/Breadcrumb"><span itemprop="title">Landing Page</span></li></ul>

* Customise Red Values

https://developers.google.com/structured-data/breadcrumbs


ECOMMERCE? USE SITELINKS SEARCH BOX MARKUP ‘SEARCHACTION’ SCHEMA

REQUIREMENTS •  An Internal Search Engine On Your Site •  Try Google Custom Search Engine if Needed


RECOMMENDED – JSON-LD MARKUP

<script type="application/ld+json">{ "@context": "http://schema.org", "@type": "WebSite", "url": "https://www.domain.co.uk/", "potentialAction": { "@type": "SearchAction", "target": "https://www.domain.co.uk/catalogsearch/result/?q={search_term}", "query-input": "required name=search_term" }}</script>


ECOMMERCE? USE SITELINKS SEARCH BOX MARKUP ‘SEARCHACTION’ SCHEMA

https://developers.google.com/structured-data/slsb-overview


GIVE CONTEXT TO YOUR ARTICLES, BLOGS & GUIDES ‘ARTICLE’ SCHEMA

PUBLISHER NAME Dedicated SERPs Box

REQUIREMENTS •  A Blog, duh!



<div itemscope itemtype="http://schema.org/Article"><h1 itemprop="headline">Article Name</h1><img src="https://www.domain.co.uk/article-thumnail.png" itemprop="image" /><span itemprop="author">Author Name</span><span itemprop="datePublished">2015-09-18</span><span itemprop="description">Short Article Description</span><div itemprop="articleBody">The Body Copy of Your Article Goes Here </div></div>


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

GIVE CONTEXT TO YOUR ARTICLES, BLOGS & GUIDES ‘ARTICLE’ SCHEMA


USE CUSTOMER REVIEW DATA TO GAIN STAR RATINGS ‘PRODUCT/AGGREGATE RATING’ SCHEMA

REQUIREMENTS •  Real-Customer Review Data •  No Data? Run an Incentive-Based Survey •  Testimonial Page



<div itemtype="http://schema.org/Product" itemscope="itemscope" class="star-rating"><span itemprop="name">[Product Name]</span><div itemprop="AggregateRating" itemtype="http://schema.org/AggregateRating" itemscope="itemscope"><span itemprop="ratingValue">4.89</span> out of 5 - (<span class="reviewCount" itemprop="reviewCount”>[Number of Reviews]</span>)</div> </div>


https://developers.google.com/structured-data/rich-snippets/reviews

USE CUSTOMER REVIEW DATA TO GAIN STAR RATINGS ‘PRODUCT/AGGREGATE RATING’ SCHEMA


OPEN GRAPH TAGS


Max 80 Characters 66% Engagement Increase

1200 x 628 Pixels

USE A CTA BUTTON

Open Graph Tags

25 Characters Max

The Perfect

Facebook Open

Graph Box

Facebook Guidelines: http://on.fb.me/1JmMDTH Jeff Bullas: http://bit.ly/19VD8E9


RECOMMENDED – OGP.ME MARKUP

<meta property="og:locale" content="en_gb" /><meta property="og:type" content="article" /><meta property="og:title" content="[Content Title]" /><meta property="og:description" content="[Description of your content]" /><meta property="og:url" content="https://www.domain.com/content-url/" /><meta property="og:site_name" content="[Site Name e.g. Kaizen]" /><meta property="article:publisher" content="https://www.facebook.com/fb-page-url" /><meta property="og:image" content="http://www.domain.co.uk/thumbnail-image.jpg" />


http://ogp.me/

THE PERFECT FACEBOOK OPEN GRAPH BOX MICRO-DATA


TYPES •  Promoted Cards (No HTML Required)

•  Lead Gen - Capture Email •  Website - Drive Clicks to Content

•  Set Headline •  Social Image •  CTA Button

•  App Cards

•  Organic Cards •  Get Approved - http://bit.ly/1jjwSw5 •  Card Types

•  Summary + Summary Image •  Product •  Photo / Video •  Apps

USING TWITTER CARDS TO INCREASE TWEET CTR META TAGS


RECOMMENDED – TWITTER.COM MARKUP

<meta name="twitter:card" content="summary"><meta name="twitter:site" content="@TwitterHandle"/><meta name="twitter:domain" content="http://www.domain.co.uk/"/><meta name="twitter:creator" content="@TwitterHandle"/><meta name="twitter:title" content="Content Title"><meta name="twitter:description" content="Description of your content"><meta name="twitter:image" content="http://www.domain.co.uk/thumbnail-image.jpg">


https://dev.twitter.com/cards/overview

USING TWITTER CARDS TO INCREASE TWEET CTR META TAGS


TRY TWITTER CARD ANALYTICS

https://analytics.twitter.com/


GOOGLE NOW CARDS


GOOGLE NOW RELIES ON STRUCTURED DATA IN EMAILS

REQUIREMENTS •  JSON-LD / SCHEMA markup within emails •  You’ll also see markup within Gmail directly

h"ps://developers.google.com/schemas/tutorials/embedding-‐schemas-‐in-‐emails


HTML CODE https://developers.google.com/schemas/reference/hotel-reservation

USES / VARIANTS •  Basic Reservation Details •  Update/Cancel Reservation •  Business Details •  Customer Details

HOTEL BOOKINGS ‘LODGINGRESERVATION/BUSINESS’ SCHEMA


HTML CODE https://developers.google.com/schemas/reference/event-reservation

USES / VARIANTS •  Basic Event Details •  Event Reminders •  Ticket / No Ticket Variants for Music & Sport •  Multiple Tickets •  Update/Cancel Event

EVENT TICKETS ‘EVENTRESERVATION’ SCHEMA


HTML CODE https://developers.google.com/schemas/reference/restaurant-reservation

USES / VARIANTS •  Basic Restaurant Reservation •  Update/Cancel Reservation

RESTAURANT RESERVATIONS ‘FOODESTABLISHMENTRESERVATION’ SCHEMA


FLIGHT BOOKINGS & BOARDING PASSES ‘FLIGHTRESERVATION’ SCHEMA

HTML CODE https://developers.google.com/schemas/reference/flight-reservation

USES / VARIANTS •  Flight Confirmation •  Boarding Pass •  Check-In •  Update / Cancel Flight •  Multi-Leg Flights •  Multiple Passenger Flights


PUSH & RESYNDICATION VIA API’S


NOTIFY VISITORS WHEN YOU PUBLISH A NEW BLOG POST CHROME & SAFARI PUSH NOTIFICATIONS

Desktop Notification

Mobile Notification

https://goroost.com/


ENABLE PUBSUBHUBHUB TO UPDATE RSS READER FEEDS IN REAL-TIME

http://wordpress.org/plugins/pubsubhubbub/


GET READY FOR IOS9 APPLE NEWS

SIGNUP FOR NEWS PUBLISHER

https://www.icloud.com/newspublisher/


MOBILE APP WRAPPER


SPOT THE DIFFERENCE?

BROWSER VS APP


TURN YOUR RESPONSIVE WEBSITE INTO AN APP USE PHONEGAP OR CORDOVA

http://phonegap.com/about/ http://cordova.apache.org/


GET READY


MicroData Markup (JSON-LD & HTML)

Push & Resyndicate Content via APIs Open Graph Tags

Google Now Card Markup

Create App Version of Mobile Site

IMPLEMENT ALL OF THIS


GET DISCOVERED BY THE STAR TREK COMPUTER


& EARN 1 MILLION VISITS!!


BACK UP PLAN?


Get in Touch: @petecampbell [email protected] https://www.kaizensearch.co.uk/

DOWNLOAD THESE SLIDES KAIZENSEARCH.CO.UK/BRIGHTON

Thank You!