What purpose do the meta, link and style elements have within a document's body?

Question

The HTML4.01 specification states quite clearly:

Unlike a, [the link element] may only appear in the head section of a document...

— HTML4.01 Specification - 12.3 Document relationships: the link element

It also goes on to say roughly the same thing about the meta and style elements.

However the HTML5 specification states:

A body element's start tag may be omitted if the element is empty, or if the first thing inside the body element is not a space character or a comment, except if the first thing inside the body element is a meta, link, script, style, or template element.

— HTML5 Specification - 4.3.1 The body element

It doesn't appear to go on to explain why the meta, link and style elements are suddenly allowed to be contained within the body element; especially not as the very first element.

It does give a couple of examples of usages with the style and link elements, but it doesn't explain them very well. For example, one example featuring the link element it gives this:

<header>
  <h1 itemprop="headline">The Very First Rule of Life</h1>
  <p><time itemprop="datePublished" datetime="2009-10-09">3 days ago</time></p>
  <link itemprop="url" href="?comments=0">
</header>

It doesn't explain why the link element would be used here instead of a - nor does the Microdata Working Group Note which appears to define the itemprop attribute.

What's going on here? Why are these elements suddenly allowed within the body (and somewhat importantly as the first child)?

Hello, this is not related to this question, but the SE network doesn't provide any sort of private messaging, so I had no other means to contact you; I saw your question about web sites and host names on ServerFault and I was answering it, but while I was writing an answer you deleted it. If you repost it (possibly with better wording) I'll answer; in the meantime, this should help (see the section about host names in the HTTP request): https://en.wikipedia.org/wiki/Hypertext_Transfer_Protocol. — Massimo, Aug 20 '15 at 14:40
@Massimo I've undeleted the question. I deleted it as I assumed nobody was going to answer. ^^ — James Donnelly, Aug 20 '15 at 14:47

score 2 · Accepted Answer · answered Aug 13 '15 at 16:19

It doesn't appear to go on to explain why the meta, link and style elements are suddenly allowed to be contained within the body element

This seems to be left over from some proposals that didn't make it into HTML 5.

See HTML 5.1 which allows those elements in flow content and expands their definitions to describe what they do when they appear in the body.

especially not as the very first element.

The significance of being the first element only relates to the tag omission rules.

Given:

<head …>
    <title>
<h1>

It is clear that the h1 ends the head element and starts the body element because h1 cannot appear in the head.

Given:

<head …>
    <title>
<meta>
<h1>

You can't apply the same rule to <meta> because it can appear in the head or the body.

Interesting. Thank you. – James Donnelly Aug 14 '15 at 08:05 — James Donnelly, Aug 14 '15 at 08:05

score 2 · Answer 2 · edited May 23 '17 at 12:10

For Microdata and RDFa, it can be useful to use link and meta elements instead of elements that, by default, have visible content. (That’s why both specifications extend HTML5 so that link/meta may be used in the body.)

Examples:

You want to provide a URI that represents the thing you write about.

While it’s a good practice to provide a webpage about this thing when someone requests this URI, this is not required: the URI http://example.com/my-vocabulary/Berlin could represent the city Berlin, without serving any kind of content. Having a visible/clickable link for this would not make sense.

The same goes if you use vocabularies that do serve a webpage, but it would not be useful to let your human users visit them. In DBpedia, Berlin’s URI is http://dbpedia.org/resource/Berlin. If you visit it, you get redirected to http://dbpedia.org/page/Berlin (this URI does not represent the city, but a page about the city), but this page is not necesarily useful for your visitors.
You have to provide content in a specific format.

Schema.org’s openingHours property expects content in a format like "Tu,Th 16:00-20:00". It’s unlikely that you want to have it visible on your page exactly like this (even less so if you don’t use English).
Reserved values.

Schema.org’s accessibilityHazard property can have a value like "noFlashingHazard", which is not really useful to have visible on the page.

Schema.org’s availableDeliveryMethod property can have a URI like http://purl.org/goodrelations/v1#DeliveryModeFreight as value, which is likely not useful for your users.
Usability.

Sometimes you want to provide more data for bots (like search engines) that could possibly also be useful for your human visitors, but you don’t want to have it visible on the page (e.g., for aesthetic or usability reasons).

For example, you might have teaser images, where each teaser is linked to a page about this image. Each image has an author, but you don’t want to link the author profile where the teasers are shown, only on the dedicated page. But by using link, you could already link the author from the teaser page, giving consumers more data/context.

In the included markup snippet, the intention might be to provide the link for the thing (i.e., the current blog post) in the preferred form (with this comments parameter) without "confusing" the users by following a link that leads to the same page.

What purpose do the meta, link and style elements have within a document's body?

2 Answers2