The body element

When we create or discover new things, we label them too. These labels act like IDs, making it easy to access these things in the databases that are our minds.

Unique labels are needed otherwise different things will get conflated and confused. But using random sets of characters every time makes the labels less memorable. Instead, a common “hack” for generating a new label is to take some established labels (ones you’re never likely to forget) and mash them together.

For example, “hammerhead shark” consists of the common, established terms hammer, head, and shark. It’s a much more memorable label than “cartilaginous saltwater fish with a perpendicular head protrusion” or, indeed, “skrandomif”.

Yes, it’s true that a hammerhead shark has never been observed using their idiosyncratically shaped cranium to nail a messiah to a crucifix. And, yes, it’s true that hammerhead sharks existed for 20 million years before the hammer itself was invented. These things are not semiotically relevant. We know what we mean.

The correct structure of an HTML document is memorable as an analog for a human being, with a <head> at the top and <body> underneath. This… wait… I need to search something.

Is the head part of the human body?

It says here, “the head is the upper part of the body, made up of the skull, its coverings, and the lower jaw. It supports the face and encloses the brain.” But if it’s part of the body, surely it should be like…

<body>
  <head></head>
</body>

…not…

<head></head>
<body></body>

… as specified?

This being published on Halloween, I am obliged to make some sort of joke about “The Headless HTMLman” or similar. But I can’t think of anything good. What I will say is this: I think perhaps the people standardizing HTML were distracted by their own necks. Were HTML developed by creatures with ill-defined necks, such as blobfish, this mistake may have been avoided.

In any case, the <body> must follow the <head>, as its sibling, and must only be included once per HTML document. In all cases, <body> must be the second child element of <html> , after <head>. It is not clear which part of the human body <html> alludes to. Perhaps the soul?

The HTMLBodyElement interface (defining the element’s properties, methods, and event handlers) inherits from the generic HTMLElement interface—not to be confused with the HTMLHtmlElement interface defining an <html> element (which also inherits from HTMLElement). Got that?

HTMLElement inherits from the primordial Element interface also responsible for SVG (Scaleable Vector Graphics).

That one can use SVG elements inline, within an HTML <body> tag, is extremely useful. However, SVG elements are not, technically, HTML elements and SVG is separate, rather than subordinate, to HTML. A file with a .svg extension represents an SVG document, like a file with a .html extension represents an HTML document.

SVG documents do not have <head> or <body> elements and, as such, are more like echinoderms than humans or blobfish. You can starfish an HTML document by omitting <head> or <body> tags. The W3C’s HTML5 validator will not complain. However, these elements will be added automatically, by browsers, during DOM generation. It works exactly like an Animorph but in reverse.

Some even suggest removing the tags to reduce document size. And I mean. Sure, go ahead, if you’ve already done literally everything else in your power to optimize your HTML payload (tip: ditch your utility class library).

From a document structure/outline perspective, the <body> represents the document’s supersection, to which all subsections belong. Accordingly, it’s best practice to use a single <h1> (main; principle) heading somewhere within the <body> but outside any sectioning element. Sectioning elements—subsections—of the highest level should use <h2>. This indicates they belong to the <body> labeled by the <h1>.

Since the contents of an HTML <head> are hidden, the <body> element is often said to represent the “visible” parts of an HTML page. This is somewhat ableist, since blind visitors to that web page will see neither the <head> nor the <body>. Instead, it’s better to consider the <body> as the interactive portion of the page. The <body> demarcates the interface.

In 2024, the interface is typically powered by JavaScript. While <script> tags do appear inside the <body>, these are invisible, as if they were in the <head>. This is partly because they are not, themselves, interactive; they simply apportion functionality to accompanying HTML elements. But it’s also because we are deeply ashamed of them, and rightly so.

Not everyone is a fan of my writing. But if you found this article at all entertaining or edifying, I do accept tips. I also have a clothing line: