Essential Knowledge: Open Graph Social Markup By Merry Morund

24
ESSENTIAL KNOWLEDGE OPEN GRAPH SOCIAL MARKUP Merry Morud, Social Media Director | @MerryMorud

description

From the SMX East 2014 Conference in New York City, NY. SESSION: Up Close With Twitter Cards & Facebook's Open Graph. PRESENTATION: Essential Knowledge: Open Graph Social Markup - Given by Merry Morud, @MerryMorud, Social Advertising Director - aimClear. #SMX #14B

Transcript of Essential Knowledge: Open Graph Social Markup By Merry Morund

Page 1: Essential Knowledge: Open Graph Social Markup By Merry Morund

ESSENTIAL KNOWLEDGE OPEN GRAPH SOCIAL MARKUP

Merry Morud, Social Media Director | @MerryMorud

Page 2: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency. Image  credit:  flickr  sco1chene    

Page 3: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency. Image  credit:  flickr  popdust  

Open  Graph  API  (OG)  =  Integra7on  Between  Facebook  &  Websites  

Page 4: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

SOCIAL MARKUP OVERVIEW

• Why Social Markup is CRITICAL

•  Facebook Open Graph (OG)

• Social Markup Strategies

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 5: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Content is KING but…

Page 6: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Strategic  Content  Markup    For  Social  Distribu>on  is  EVERYTHING    

Page 7: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

SOCIAL MARKUP = MORE SOCIAL SHARES

•  Compelling, Accurate Social Markup Increases Click-through Rates

•  Easier for users to Share Content

•  More Likely for users to Share Content

•  Which means…

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 8: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

SOCIAL SHARES = CRITICAL TO LONG-

TERM SEO HEALTH

Page 9: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

SMART BRANDS TAKE CONTROL OF HOW CONTENT IS DISPLAYED

VIA STRATEGIC SOCIAL MARKUP

Page 10: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 11: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

FACEBOOK OPEN GRAPH (OG)

•  Integration between Facebook & Websites •  Twitter, Google, & LinkedIn Pull in OG Tag Data •  Homepage HTML: xmlns:og="http://ogp.me/ns#" xmlns:fb="https://www.facebook.com/2008/fbml"> •  Add Custom OG Tags to Individual Pages

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 12: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

og:descrip>on  

og:>tle  

og:image  

Page 13: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

FACEBOOK OG TAGS <meta property="og:title" content=“Webpage Title"/> •  Bolder than the rest •  FB will truncate ~88 characters

<meta property="og:description" content=“description of the webpage."/> •  Similar to HTML meta description for SERPs

–  Don’t KW stuff, but be compelling (& accurate) •  Keep it ~200 characters

–  Most important message ~100

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 14: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

FACEBOOK OG TAGS <meta property="og:image" content="Your image URL"/> •  MOST IMPORTANT •  Static pages must change this tag manually •  Most CMSs have Plugins •  Optimal FB Size: 1200x627

–  No smaller than 400x209! (or it’ll be a thumbnail L ) •  Image doesn’t even have to be on your page! <meta property=”og:image” content=”http://www.yourdomain.com/image-name.jpg” />

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 15: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

FACEBOOK OG TAGS

<meta property="og:type" content="article"/> •  Determines if your content will appear in a user’s interest

section of profile if “Liked” –  Typically for real-life objects (people, movies, books, etc)

•  Default = website <meta property="og:site_name” content=“website name"/>

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 16: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

MULTIPLE URLS TO SAME CONTENT?

IMPORTANT! SET CANONICAL:

LEARN MORE:

<meta property="og:url" content=”webpage URL"/>  

http://bit.ly/canonical-URL  

Page 17: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

CHECK YOUR WORK!

https://developers.facebook.com/tools/debug/

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

BONUS:  This  Will  Clear  FB’s  Cache!  

Page 18: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

EASILY IMPLEMENT WITH WITH SIMPLE

PLUGINS

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 19: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

OPEN GRAPH PLUGINS •  Wordpress

–  Wordpress SEO by Yoast >> http://bit.ly/YoastOG

–  SEO Ultimate >> http://bit.ly/SEOult

–  FB Official >> http://bit.ly/FB-OG •  Magento >> http://bit.ly/Mag-OG

•  Drupal >> http://bit.ly/Dru-OG

•  Joomla >> http://bit.ly/Joom-OG

•  Zen Cart >> http://bit.ly/OG-Zen

•  osCommerce >> http://bit.ly/os-OG

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

See  ‘Em  All:  hLp://bit.ly/OGplugins  

Page 20: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

SOCIAL MARKUP STRATEGY

Page 21: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 22: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Approach  Social  Markup    Like  Ad  Crea>ve  

Page 23: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

STRATEGIC ASSIGNMENTS

•  Marketing establishes Social Markup – Social Mark = AD FOR YOUR SITE (Blog, etc…) – Treat Social Markup like Ad CREATIVE

•  Dev’ implements

© 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.

Page 24: Essential Knowledge: Open Graph Social Markup By Merry Morund

@MerryMorud

TAKEAWAYS •  Awesome & Accurate Social Markup (OG Tags)

= Essential for Increased Content Sharing

•  Impacts long-term SEO health

•  OG Tags read by LinkedIn, G+, & Twitter

•  Easily implement with CMS Plugins

•  Marketing Creates Markup, Dev’ Implements © 2014, is a publication of aimClear®, an integrated social, search, PR & display marketing agency.