The document discusses authorship markup for search engine optimization and social media integration. It covers topics like Google+ authorship markup, Facebook OpenGraph, Twitter Cards, semantic markup using Schema.org, and how this matters for features like the Knowledge Graph, Google Now and Google Glass. It provides examples of using rel=author, rel=me, and other tags to identify authorship and includes a live demo.

1. Who Wrote This $#!7
Authorship and Semantic Web Markup
for SEO and Social Media Integration

2. Nick Moline
Senior Software Engineer at Justia.com
Google+: plus.google.com/100038801356570551641
Twitter: @NickMoline
Facebook: facebook.com/nickmoline
LinkedIn: linkedin.com/in/nickmoline
Blog: www.nick.pro
Web: nickmoline.com

3. Topics Today
• Authorship Markup and Google+
• Facebook OpenGraph
• Twitter Cards
• Semantic Markup & Schema.org
• Why does it Matter?
– The Knowledge Graph
– Google Now
– Google Glass
• Live DEMO!

4. The rel=“type” attribute on Links
<a rel=“spouse met” href=“http://barbara.pro”>My Wife’s Site</a>
<a rel=“coworker met” href=“http://timstanley.com/”>My Boss</a>
<link rel=“stylesheet” href=“/site.css” />
<link rel=“shortcut icon” href=“/favicon.ico” />
<link rel=“next” href=“/page2.html” />
<link rel=“top” href=“/index.html” />
<a rel=“me” href=“http://nickmoline.com/”>My Website</a>

5. rel=“author”
<a rel=“author”
href=“https://plus.google.com/100038801356570551641/”>My Google+
Profile</a>
<link rel="author"
href="https://plus.google.com/100038801356570551641/" />

6. rel=“me”
By <a rel=“author” href=“/author/nickmoline”>Nick Moline</a>
<link rel=”author"
href="https://plus.google.com/100038801356570551641/" />
<link rel=”me" href="https://plus.google.com/100038801356570551641/" />

7. Authenticating the Link

8. Authorship on Google Search

9. Facebook OpenGraph

10. Twitter Cards
Similar to OpenGraph syntax, but uses meta
name instead of meta property
<meta name=“twitter:site”
value=“@JustiaCom” />
<meta name=“twitter:creator”
value=“@NickMoline” />

11. Semantic Markup (A History)
• HTML
– Great for Markup, but no Structured Data
• XML
– Great for Structured Data, but Difficult for Markup
• HTML with Microformats
– Hack
• RDF-A
– Adds XML to HTML, difficult for the novice
– I don’t get it!
• HTML5 Microdata
– Part of the HTML5 spec
– Markup First, but highlighting data in the markup
– Much simpler than RDF-A IMHO

12. Schema.org
• “Standard” set of Microdata Structures for
explaining real items in HTML in a way
Machines can easily and reliably
understand.

13. So why mark it up?