Brighton April 2015 - Schema, JSON-LD & the semantic web

@kirsty_hulse
Schema, JSON-LD &
the semantic web
(plus arbitrary pictures of space)
Remains of a dead star, located 11,000 light-years away, taken by NASA's NuSTAR telescope

@kirsty_hulse
What that actually means…
How can we implement structured markup,
to support a semantic web, when it is
complicated and expensive?

@kirsty_hulse
Why are we even interested in a semantic
web?

@kirsty_hulse
To do this, we need to have a uniform system
that allows data sharing
The vision of the Semantic Web is to […] create a
common framework that allows data to be shared
and reused
A ‘Galactic Gathering’ taken by the Hubble Telescope

@kirsty_hulse
From a search perspective
For search, the use of markup reinforces
meaning of the information
NASA's Orbiting Carbon Observatory (OCO)-2

@kirsty_hulse
Rich snippets and the knowledge graph

@kirsty_hulse
Owning your brand SERP

@kirsty_hulse
The sorry truth…
Andromeda galaxy taken by some dude on reddit

@kirsty_hulse
If you don’t - your competitors will

@kirsty_hulse
Where are we now?

@kirsty_hulse
Microdata (RDFa, microformats) are combined
with HTML properties
Inside the Flame Nebula

@kirsty_hulse
Schema.org is a shared markup vocabulary
Horsehead seen by the Hubble

@kirsty_hulse
Only about 0.3 percent of domains are
using schema markup on their websites

@kirsty_hulse
But there’s a new(ish) kid on the block

@kirsty_hulse
JSON-LD […] is a way of exchanging data
without using markup attributes in HTML
The Sun giving out X-rays

@kirsty_hulse
Watch this
https://www.youtube.com/watch?v=vioCbTo3C-4

@kirsty_hulse
Play around here
http://json-‐ld.org/playground/index.html

@kirsty_hulse
But the most important bit is…
JSON-LD does not need to be present in the
<body> of a page. It can be embedded in a <script>
in the <head> of a page
Asteroid tracks in the stars taken by NASAs Nowise

@kirsty_hulse
And Google is increasingly supporting it as a
format

@kirsty_hulse
They posted an update to support it for
organisation

@kirsty_hulse
A few weeks ago Google endorsed the use of JSON-LD
as a method of adding markup for the tour dates
markup

@kirsty_hulse
My client has limited/restricted/expensive
development resources T

@kirsty_hulse
You can inject JSON-
LD using Google Tag
Manager

@kirsty_hulse
Meaning there’s the potential for
implementing structured markup
to not be expensive,
to not be complicated
to not require development resource
Martian impact crater

@kirsty_hulse
The datalayer
“A data layer is an object that contains all of the information that
you want to pass to Google Tag Manager
Rather than referencing variables, transaction information, page
categories, and other important signals scattered throughout
your page, Google Tag Manager is designed to easily reference
information that you put in this data layer.”

@kirsty_hulse
Datalayer is excellent and wonderful because…
• Scalable
• Flexible
• Resolves security issues
• Measurable (Mike Arnesen)

@kirsty_hulse
But…for a non developer…it’s actually fairly
tricky and can require development resource

@kirsty_hulse
Back to square one!

@kirsty_hulse
Implement a data layer for information that
will change on a page by page basis
http://www.swellpath.com/2015/03/7-steps-to-pushing-json-structured-data-using-google-tag-manager/

@kirsty_hulse
But there is markup we can inject using JSON-LD via
GTM without the data layer using Custom HTML Tags

@kirsty_hulse
<script type="application/ld+json">
{
"@context": "http://schema.org",
"@type": "WebSite",
"url": "http://www.kirstyhulse.com/",
"potentialAction": {
"@type": "SearchAction",
"target": "http://kirstyhulse.com/?s={search_term}",
"query-input": "required name=search_term" }
}
</script>

@kirsty_hulse
This doesn’t guarantee inclusion however…
“The search box is triggered algorithmically based on
the website and the user query — we display it when
we think it might help the user refine their search.”

@kirsty_hulse
Social Markup
{
"@context" : "http://schema.org",
"@type" : "Person",
"url" : "http://www.simoahava.com/",
"name" : "Simo Ahava",
"sameAs" : [ "http://fi.linkedin.com/in/simoahava",
"http://plus.google.com/+SimoAhava",
"http://www.twitter.com/SimoAhava" ]
}
</script>

@kirsty_hulse
Organisation and logos
{
"@context": "http://schema.org/",
"@type": "Organization",
"url": "http://www.example.com/",
"logo": "http://www.example.com/logo.png"
}
</script>

@kirsty_hulse
But be careful - you MUST keep the JSON-LD in
sync with what appears on the page

@kirsty_hulse
Or this will be you

Brighton April 2015 - Schema, JSON-LD & the semantic web

Recommended

Recommended

More Related Content

Viewers also liked

Viewers also liked (20)

Similar to Brighton April 2015 - Schema, JSON-LD & the semantic web

Similar to Brighton April 2015 - Schema, JSON-LD & the semantic web (20)

More from Kirsty Hulse

More from Kirsty Hulse (12)

Recently uploaded

Recently uploaded (20)

Brighton April 2015 - Schema, JSON-LD & the semantic web