DEV Community

Cover image for HTML Junk DNA
Ross Angus
Ross Angus

Posted on


Junk DNA is the term in biology for parts of the genome which no longer have any effect on the development of a life form. They don't cause any harm, but also don't have any effect. At some point, these genes were useful to an ancestor of the current creature, but this is no longer true.

However, this post isn't about biology (a subject I'm woefully unqualified to comment on) it's about HTML - a subject I can convincingly talk about, but where my qualifications remain a matter of some dispute.

Let's go back to 2000. In January of that year, the W3C made a formal recommendation of XHTML. This was exciting because we'd been stuck with HTML 4 for many years. XHTML didn't just add or take away some tags, it meant that our markup had to be well-formed for the first time. What I mean by this is that for every opening tag, we were supposed to have a corresponding closing tag. XHTML was intended to be well-formed, like XML.

What, you might suggest, should happen to image tags? These had to become self-closing. In HTML 4, we might type:

<img src="logo.gif" alt="Bankcorp">

In XHTML, this had to become:

<img src="logo.gif" alt="Bankcorp"/>

But there was a problem.

Alt Text

Netscape Communicator version 4.79

At that time, Netscape was still a browser webdevs were obliged to consider. And using a self-closing tag in this way caused Netscape to crash.

Luckily, the solution was simple:

<img src="logo.gif" alt="Bankcorp" />

Adding a single space before the closing slash on empty tags allowed pages to render correctly in Netscape. It became a sort of habit, when we were hand-coding HTML - like how Boomers still add two spaces, after a full-stop (sick, Generation-X burn there).

In the space year 2000, Stackoverflow and MDN Web Docs did not exist. We learned from a hotchpotch of blog posts, other people's code and whatever our IDE suggested.

In 2001, the absurdly named DreamWeaver began automatically adding a space before the closing bracket on empty tags.

We followed this practice, because if Macromedia (who were later swallowed by Adobe) was adding this slash, it must be best-practice.

Then further IDEs came along. These were often created by developers who didn't necessarily have any experience of web development, so they unthinkingly added in the space. The space is still added by Visual Studio 2019 and projects such as Prettify.

How is this still a problem?

Hang on - we've had HTML5 and its relaxed attitude to closing tags for over a decade now. How is this still relevant?

XML still lurks in many server-side languages and SVG is the rightful heir to what we might have achieved with GIFs or Flash twenty years ago. JSON has not killed off XML yet.

The final version of Netscape was released in 1999, before being officially discontinued in 2008. The space inside empty tags has not been required for more than a decade.

Projects such as Normalize are constantly revisiting their codebase, in order to remove declarations for browsers which are no longer relevant. This process should be ongoing in all aspects of web development, but I suspect the pointless space will be around for quite some time.

Top comments (0)