schema.orgrdfa

Schema.org RDFa: marking up <img> as ImageObject?


I'm using Schema.org and RDFa to mark up an HTML page. I have an image as follows:

<div class="image_container">
    <a href="big_whatever.jpg">
        <img src="whatever.jpg" alt="A picture of Whatever" title="Whatever">
    </a>
</div>

What is the correct way to mark this up, so that: 1. big_whatever.jpg (the link href) becomes the contentUrl 2. The alt property becomes the description 3. The title property becomes the name 4. Ideally, I would also like the alt property to be the caption, as well.

Now, this is easy enough with JSON-LD, but I prefer to use RDFa for this particular case. This is what I've got so far:

<div class="image_container" vocab="http://schema.org/" typeof="ImageObject">
    <a href="big_whatever.jpg">
        <img src="whatever.jpg" alt="A picture of Whatever" title="Whatever">
    </a>
</div>

Solution

  • It is not possible to use the values of alt or title attributes in RDFa.

    You could duplicate them with "hidden" meta elements:

    <div vocab="http://schema.org/" typeof="ImageObject">
      <a property="contentUrl" href="big_whatever.jpg">
        <img src="whatever.jpg" alt="A picture of Whatever" title="Whatever" />
        </a>
      <meta property="description caption" content="A picture of Whatever" />
      <meta property="name" content="Whatever" />
    </div>
    

    If you don’t need a property on the img element (e.g., for thumbnailUrl), you could use property+content to save one meta element:

    <div vocab="http://schema.org/" typeof="ImageObject">
      <a property="contentUrl" href="big_whatever.jpg">
        <img src="whatever.jpg" alt="A picture of Whatever" title="Whatever" property="name" content="Whatever" />
        </a>
      <meta property="description caption" content="A picture of Whatever" />
    </div>
    

    Thanks to the content attribute, RDFa won’t use the src value. But I think it’s more clear to go with the first snippet.