5

This question is related to this question: Uniform way to add multiple descriptive properties in Schema.org

Recently I found this code on HTML5 & Schema.org - Structured Microdata for SEO, along with the statement that the Schema.org WPHeader type is a WebPageElement that can include markup from CreativeWork as well as Thing:

<header role="banner" itemscope itemtype="http://schema.org/WPHeader">
    <meta itemprop="name" content="A name">
    <meta itemprop="description" content="A description text">
    <h1 itemprop="headline">A headline text</h1>
    <img itemprop="image" src="image.jpg">
</header>

If the above statement and usage of WPHeader is correct, I wonder if the code below whould make sense in terms of structured data for the sematic web. The reason behind my question is that I am looking for a solution in which I can use a banner/hero image for webpages presenting an Event (or other) type with typical CreativeWork properties such as headine, creator etc.

    <article>
         <!-- Banner/hero image section for Event-->
         <header class="my_hero_class" role="banner" itemscope itemtype="http://schema.org/WPHeader">
            <meta itemprop="name" content="My Event">
            <meta itemprop="description" content="Description of My Event">
            <meta itemprop="keywords" content="keyword1, keyword2, keyword3">
            <h1 itemprop="headline">A headline text</h1>
            <p itemprop="alternateHeadline">Another headline text<p>
            <p itemprop="creator">Artist name<p>
            <img itemprop="image" src="hero_image.jpg">
        </header>
        <!-- Event section -->
        <section class="my_event_class" itemscope itemtype="http://schema.org/Event">
           <h2 itemprop="name">Name of My Event</h2>
           <p itemprop="description">Description of My Event</p>
           <p itemprop="text">Text about My Event</p>
           <p itemprop="startDate" content="2016-04-21T20:00">Thu, 04/21/16 8:00 p.m.</p>
<meta itemprop="startDate" content="2016-04-21T20:00">
           <img itemprop="image" src="poster.jpg">
        </section>
        <!-- Event Artist section --> 
        <section class="my_person_class" itemscope itemtype="http://schema.org/Person">
           <h2 itemprop="name">Name of Artist</h2>
           <p itemprop="description">Description of of Artist</p>
           <p itemprop="text">Text about of Artist</p>
           <img itemprop="image" src="artist.jpg">
        </section>
    </article>
iep
  • 601
  • 1
  • 8
  • 23

1 Answers1

3

WPHeader

The WPHeader type is for the header of a page (i.e., WebPage).

If you add properties to WPHeader, these properties describe the header (!), not the page.

So, for example, the name might be "Header", the image might be a screenshot of the header etc. This is of course typically not useful to have on a page, and typically not useful to provide as structured data, so my recommendation is not to use them.

WebPage

It seems to me that the WebPage type is what you want. Its name is the name of the page, its description is the description of the page etc.

If the page is about a single entity (e.g., an Event), then you could use the more specific ItemPage type. With the mainEntity property, you can specify the primary entity of that page.

The ItemPage might share some property values with the Event (e.g., the description might be the same), but there might also be slight differences (e.g., the name of the WebPage might contain the site name in addition).

<body itemscope itemtype="http://schema.org/ItemPage">

  <!-- properties about the event page -->

  <article itemprop="mainEntity" itemscope itemtype="http://schema.org/Event">
    <!-- properties about the event -->
  </article>

  <!-- properties about the event page -->

</body>
unor
  • 92,415
  • 26
  • 211
  • 360
  • Thanks Unor. Great explanation. My main concern remains, however: what would be a reasonable ‘type’ and set of ‘properties’ for a ‘Hero’ image and its text overlays? – iep Feb 02 '18 at 18:52
  • I also wonder if the statement that a WPHeader type may have properties from Thing and CreativeWork, is correct; this because in that case I thought a header would be suitable to “render” as Hero, if users of my application whish to present ‘header’ information in such a way. – iep Feb 02 '18 at 19:33
  • 1
    @iep: You can use all properties that are listed in the table on a type’s page. The table has sub-headings pointing out where the properties are defined. In case of `WPHeader` you can see that the properties come from `WebPageElement`, `CreativeWork`, and `Thing`. -- In other words: You can use properties from the type itself as well as from all of its parent types. – unor Feb 04 '18 at 03:11
  • 1
    @iep: If you really want to provide data about the hero image (and not about the content presented by this image), then `WPHeader` is the right type (assuming that it’s the hero image of the web page). What you convey is: *This web page (`WebPage`) has this header (`WPHeader`), and this image (`ImageObject`) is part of the header (`image`/`hasPart`).* -- I don’t see how this would be interesting for consumers of your structured data, but that would be the way to specify it. – unor Feb 04 '18 at 03:15
  • This seems to be what I want to convey, because how you describe it, is exactly how the situation is (in my application case). If this is not interesting for consumers, would it **harm** consumers??? In my application the HTML is rendered based on sdo schema’s (which are used to catalogue/catagorize authors, artists, publications and events). The ‘Hero’ image is typically a presentation thing, not semantic (it seems to be used often to beautify only). But, the textoverlays *might* contain meaningful content such as names, dates or authors. – iep Feb 04 '18 at 10:28
  • @iep: No harm (if used correctly). But, to be clear, the textoverlay content (e.g., the author name) should *not* be specified in properties of `WPHeader` (if you’d use `author`, you would specify the author of the `WPHeader`, not the author of the `WebPage`). – unor Feb 04 '18 at 14:51
  • Ok, glad you are so clear about this point. So, if one wants to add a textoverlay to a Hero image (which is part of *WPHeader*) and such a text actually is a text describing the *author* of a *CreativeWork* which the *WebPage* is about (the *mainEntity*), this text should not have any property if it appears in the *WPHeader*, but **the same text** could appear again as a property (*author*) of the *CreativeWork*? Such a scenario would work for my application case. – iep Feb 04 '18 at 15:42
  • @iep: Yes. The text can still be part of the HTML element which has the `itemtype="http://schema.org/WPHeader", but don’t mark it up with `itemprop` attributes inside, so Microdata will ignore it. – unor Feb 05 '18 at 02:15
  • Thanks a lot for this very useful discussion – iep Feb 05 '18 at 13:59