0
Social 

Meta
The other semantic markup
#socialmetadata @mike_arnesen
Social metadata
can define
our content

Understanding
#socialmetadata @mike_arnesen
Social networks
need our sharing
#socialmetadata @mike_arnesen
Social shares that are

beautiful & engaging

#socialmetadata @mike_arnesen
Friends don’t let friends
leave social display
to chance

#socialmetadata @mike_arnesen
#socialmetadata @mike_arnesen
Add social metadata
for free & attractive screen real estate

#socialmetadata @mike_arnesen
What is?
Social metadata?
Social metadata lives in your <head>.
#socialmetadata @mike_arnesen
Great social shares for
Facebook, Twitter, & Google+
#socialmetadata @mike_arnesen
We’re Search Marketers

What is?

Why do we care?

Social metadata?

#socialmetadata @mike_arnesen
Social signals
can give us

Better SEO
#socialmetadata @mike_arnesen
It’s social proof

for organic

#socialmetadata @mike_arnesen
It’s social proof

for organic and paid

#socialmetadata @mike_arnesen
Search bots 
are hungry for 
social signals
This is big data
#socialmetadata @mike_arnesen
Social knowledge

for a better understanding of quality & resource
#socialmetadata @mike_arnesen
Yet there must be 
a filter…

#socialmetadata @mike_arnesen
Why use social metadata?

#socialmetadata @mike_arnesen
We win now. We win more later.
#socialmetadata @mike_arnesen
The Time is NOW
We win now. We win more later.
#socialmetadata @mike_arnesen
Social metadata
is easy to add

Getting started
#socialmetadata @mike_arnesen
OpenGraph

#socialmetadata @mike_arnesen
OpenGraph
Basics
•  og:title
•  og:type
•  og:image
•  og:url
Good to have
•  og:description
Optional
•  og:site_name
•  a...
Twitter Cards

#socialmetadata @mike_arnesen
Twitter Cards
Summary Card
•  twitter:card
•  twitter:title
•  twitter:description
•  twitter:image
Bonus
•  twitter:creat...
Rich Pins

#socialmetadata @mike_arnesen
Rich Pins
All Types
•  og:title
•  og:site_name
•  og:image
•  og:url
•  og:description

Product Pins
•  og:type
•  og:pri...
Rich Pins
Recipe Pins
Only supported when using schema.org & hRecipe
•  itemprop=“name”
•  itemprop=“ingredients”
•  itemp...
Interactive Posts

#socialmetadata @mike_arnesen
Interactive Posts
Button fields
•  Content URL
•  Client ID
•  Prefill Text
•  Call to Action Label
•  Call to Action URL

#...
<head>	
	<!--OpenGraph and Rich Pins-->	
	<meta property='og:site_name' content='Your Site'/>	
	<meta property='og:type' c...
Streamlining

implementation

Yoast’s	
  WordPress	
  SEO	
  Plugin	
  (OpenGraph,	
  Twi<er	
  Cards)	
  
h<ps://yoast.co...
Don’t leave a void

when you can put your best foot forward
#socialmetadata @mike_arnesen
We can start today
for free & attractive screen real estate

#socialmetadata @mike_arnesen
…and gain tomorrow
as social

becomes more valuable to SEO.

#socialmetadata @mike_arnesen
Your ROI

will continue to grow!
#socialmetadata @mike_arnesen
Structured data
Semantic markup
Social metadata

#socialmetadata @mike_arnesen
Structured data
Semantic markup
Social metadata

#socialmetadata @mike_arnesen
Structured data
Semantic markup
Social metadata

#socialmetadata @mike_arnesen
Structured data
Semantic markup
Social metadata

This is Semantic SEO
#socialmetadata @mike_arnesen
Structured data
Semantic markup
Social metadata

This is The Future.
#socialmetadata @mike_arnesen
Thank you!
Preso download
spath.us/sempdx14Link
Bundle
bit.ly/social-metadata

Mike Arnesen
@mike_arnesen
@swellpath
Upcoming SlideShare
Loading in...5
×

Under the Hood with Social Metadata - SEMpdx Feb 2014

2,086

Published on

My presentation from Under the Hood: Advanced Markup for SEO & Social Media. Full deck will be uploaded tonight.

Published in: Technology
2 Comments
11 Likes
Statistics
Notes
No Downloads
Views
Total Views
2,086
On Slideshare
0
From Embeds
0
Number of Embeds
5
Actions
Shares
0
Downloads
11
Comments
2
Likes
11
Embeds 0
No embeds

No notes for slide

Transcript of "Under the Hood with Social Metadata - SEMpdx Feb 2014"

  1. 1. Social Meta The other semantic markup #socialmetadata @mike_arnesen
  2. 2. Social metadata can define our content Understanding #socialmetadata @mike_arnesen
  3. 3. Social networks need our sharing #socialmetadata @mike_arnesen
  4. 4. Social shares that are beautiful & engaging #socialmetadata @mike_arnesen
  5. 5. Friends don’t let friends leave social display to chance #socialmetadata @mike_arnesen
  6. 6. #socialmetadata @mike_arnesen
  7. 7. Add social metadata for free & attractive screen real estate #socialmetadata @mike_arnesen
  8. 8. What is? Social metadata?
  9. 9. Social metadata lives in your <head>. #socialmetadata @mike_arnesen
  10. 10. Great social shares for Facebook, Twitter, & Google+ #socialmetadata @mike_arnesen
  11. 11. We’re Search Marketers What is? Why do we care? Social metadata? #socialmetadata @mike_arnesen
  12. 12. Social signals can give us Better SEO #socialmetadata @mike_arnesen
  13. 13. It’s social proof for organic #socialmetadata @mike_arnesen
  14. 14. It’s social proof for organic and paid #socialmetadata @mike_arnesen
  15. 15. Search bots are hungry for social signals This is big data #socialmetadata @mike_arnesen
  16. 16. Social knowledge for a better understanding of quality & resource #socialmetadata @mike_arnesen
  17. 17. Yet there must be a filter… #socialmetadata @mike_arnesen
  18. 18. Why use social metadata? #socialmetadata @mike_arnesen
  19. 19. We win now. We win more later. #socialmetadata @mike_arnesen
  20. 20. The Time is NOW We win now. We win more later. #socialmetadata @mike_arnesen
  21. 21. Social metadata is easy to add Getting started #socialmetadata @mike_arnesen
  22. 22. OpenGraph #socialmetadata @mike_arnesen
  23. 23. OpenGraph Basics •  og:title •  og:type •  og:image •  og:url Good to have •  og:description Optional •  og:site_name •  article:published_time #socialmetadata @mike_arnesen
  24. 24. Twitter Cards #socialmetadata @mike_arnesen
  25. 25. Twitter Cards Summary Card •  twitter:card •  twitter:title •  twitter:description •  twitter:image Bonus •  twitter:creator •  twitter:site Product Card •  twitter:card •  twitter:title •  twitter:description •  twitter:image •  twitter:data1 •  twitter:label1 •  twitter:data2 •  twitter:label2 #socialmetadata @mike_arnesen
  26. 26. Rich Pins #socialmetadata @mike_arnesen
  27. 27. Rich Pins All Types •  og:title •  og:site_name •  og:image •  og:url •  og:description Product Pins •  og:type •  og:price:amount •  og:price:currency •  og:availability Article Pins •  og:type Place Pins •  og:type •  place:location:latitude •  place:location:longitude •  place:street_address •  place:locality •  place:region •  place:postal_code #socialmetadata @mike_arnesen
  28. 28. Rich Pins Recipe Pins Only supported when using schema.org & hRecipe •  itemprop=“name” •  itemprop=“ingredients” •  itemprop=“image” •  itemprop=“prepTime” •  itemprop=“cookTime” •  itemprop=“totalTime” •  itemprop=“recipeYield” •  itemprop=“description” #socialmetadata @mike_arnesen
  29. 29. Interactive Posts #socialmetadata @mike_arnesen
  30. 30. Interactive Posts Button fields •  Content URL •  Client ID •  Prefill Text •  Call to Action Label •  Call to Action URL #socialmetadata @mike_arnesen
  31. 31. <head> <!--OpenGraph and Rich Pins--> <meta property='og:site_name' content='Your Site'/> <meta property='og:type' content='article'/> <meta property='og:title' content='A Title Optimzed for Social Engagement'/> <meta property='og:description' content='Social metadata you say? Click here to read more.'/> <meta property='og:url' content='http://www.yoursite.com/blog/social-metadata/'/> <meta property='og:image' content='http://www.yoursite.com/blog/social-metadata.jpeg'/> <!--Twitter Cards--> <meta name="twitter:card" content="summary"/> <meta name="twitter:site" content="@brand"/> <meta name="twitter:creator" content="@personal_handle"/> <meta name="twitter:description" content="Social metadata you say? Click here to read more."/> </head> <body> <!—Google+ Interactive Post--> <button class="g-interactivepost" id="myBtn" data-contenturl="http://www.yoursite.com/blog/social-metadata/" data-clientid="XXXXXXXXXXX.apps.googleusercontent.com" data-cookiepolicy="single_host_origin" data-prefilltext="Check out this post on social metadata and DOWNLOAD this whitepaper!" data-calltoactionlabel="DOWNLOAD" data-calltoactionurl="http://www.yoursite.com/lead-gen-form/"> <span class="icon">&nbsp;</span>Share this post on Google+! </button> </body> #socialmetadata @mike_arnesen
  32. 32. Streamlining implementation Yoast’s  WordPress  SEO  Plugin  (OpenGraph,  Twi<er  Cards)   h<ps://yoast.com/wordpress/plugins/seo/   Drupal  Metatag  Module  (OpenGraph,  Twi<er  Cards)   h<ps://drupal.org/project/metatag   Google+  InteracJve  Posts  WordPress  Plugin   h<p://blog.paulnshapiro.com/new-­‐google-­‐plus-­‐interacJve/       #socialmetadata @mike_arnesen
  33. 33. Don’t leave a void when you can put your best foot forward #socialmetadata @mike_arnesen
  34. 34. We can start today for free & attractive screen real estate #socialmetadata @mike_arnesen
  35. 35. …and gain tomorrow as social becomes more valuable to SEO. #socialmetadata @mike_arnesen
  36. 36. Your ROI will continue to grow! #socialmetadata @mike_arnesen
  37. 37. Structured data Semantic markup Social metadata #socialmetadata @mike_arnesen
  38. 38. Structured data Semantic markup Social metadata #socialmetadata @mike_arnesen
  39. 39. Structured data Semantic markup Social metadata #socialmetadata @mike_arnesen
  40. 40. Structured data Semantic markup Social metadata This is Semantic SEO #socialmetadata @mike_arnesen
  41. 41. Structured data Semantic markup Social metadata This is The Future. #socialmetadata @mike_arnesen
  42. 42. Thank you! Preso download spath.us/sempdx14Link Bundle bit.ly/social-metadata Mike Arnesen @mike_arnesen @swellpath
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×