How can JSON-LD be embedded in HTML body?

Hi all,

I've long been stumped by how we're supposed to use JSON-LD for content in
the body of a webpage. JSON-LD doesn't embed in HTML elements the way RDFa
and Microdata do. For example, let's say the webpage is an article or blog
post, and at some point it references a book. One of the RDFa markup
examples for the Book type on Schema.org starts off like this:


<div vocab="http://schema.org/">
>   <p typeof="Book" resource="#trilogy">
>     <link property="about" href="http://id.worldcat.org/fast/1020337">
>     The <strong property="name">Lord of the Rings</strong> is an
>     <span property="inLanguage" content="en">English-language</span>
>     <span property="genre">fictional</span> trilogy by
>     <span property="author" typeof="Person" resource="#author">
>       <link property="sameAs" href="http://viaf.org/viaf/95218067">
>       <span property="name" content="Tolkien, J. R. R. (John Ronald
> Reuel)">J. R. R. Tolkien</span>



As you can see, it's embedded in the content and it goes wherever the
content happens to be in the HTML body.

The JSON-LD given for this example on the website starts out like this:

<script type="application/ld+json">
> {  "@context": "http://schema.org",
>   "@graph": [
>     {
>       "@id": "#author",
>       "@type": "Person",
>       "birthDate": "1892",
>       "deathDate": "1973",
>       "name": "Tolkien, J. R. R. (John Ronald Reuel)",
>       "sameAs": "http://viaf.org/viaf/95218067"
>     },
>     {
>       "@id": "#trilogy",
>       "@type": "Book",
>       "about": "http://id.worldcat.org/fast/1020337",
>       "hasPart": [
>         {
>           "@id": "#book3",
>           "@type": [
>             "Book",
>             "PublicationVolume"
>           ],
>           "name": "The Return of the King",
>           "about": "http://id.worldcat.org/fast/1020337",
>           "isPartOf": "#trilogy",
>           "inLanguage": "en",
>           "volumeNumber": "3",

​          ​
> "author": "#author"



Where would this go? Can we put a JSON-LD script element anywhere in the
body? How would this script be associated with the content to which it
relates? Since it's not embedded in the HTML elements (div, span, p, etc.)
like the RDFa, I don't see how it can be used.

So if JSON-LD can't be used to attach metadata to specific content in the
HTML body, I think it would help to explicitly say this in the docs. Google
has been pushing JSON-LD a lot on the search side, and in AMP HTML, and
it's great, but as far as I know it's only useful in the <head> where it
would describe the page as a whole. Am I missing something?

Cheers,

Joe Duarte
https://twitter.com/ValidScience

Received on Friday, 9 December 2016 16:15:35 UTC