Is leaving out end tags valid?

Question

I remember reading a while ago that in some cases leaving out end tags (</li>, for example) speeds up the rendering (and loading/parsing, since there is less bytes) of a webpage?

Unfortunately, I forgot where I read this, but I remember it saying this feature was specific to HTML 4.0.

Since I no longer have access to this source I was wondering if someone can confirm this or link to the documentation on w3c (since I wasn't able it find it myself)?

Thanks!

---

EDIT: Forgot to mention that I meant to ask if this behaviour is also available in HTML5.

---

EDIT 2: I manged to find the article again, and it does mention it only speeds the download speed of the page, not actual rendering:

One good reason for leaving out the end tags for these elements is because they add extra characters to the page download and thus slow down the pages. If you are looking for things to do to speed up your web page downloads, getting rid of optional closing tags is a good place to start. For documents that have lots of paragraphs or table cells this can be a significant savings.

Sorry for asking a pointless question! :(

Answer 1

Here is the list of HTML 4.01 elements.

http://www.w3.org/TR/html401/index/elements.html

The End Tag column says where end tags are optional.
However, take note that this is valid only in HTML 4.01. In Xhtml, all end tags are required. Not 100% sure about HTML5.

I wrote a HTML parser once, and believe me, if you're a parser and you're inside a <p> and you encounter a </table> end tag, it's slower to check in your document tree if that is correct, and if so, to close the current <p> first, than if you simply encounter a </p>.

Edit:
Ah, found it: http://dev.w3.org/html5/html-author/#index-of-elements
Same requirements as HTML 4.01.

New edit:
Oh, that was a page from 2009. This one is more up to date:
http://dev.w3.org/html5/spec/syntax.html#optional-tags

Answer 2

AFAIK, in XHTML you must always at least self-close a tag <img ... />

In HTML (non xml-html) some tags do not need to be closed. <img> for instance. However, I'd suggest making sure you know exactly which version you're targeting and use W3C's validation service to double-check.

http://validator.w3.org/

I don't see how this would speed things up except that you'd have to send less bytes of data per page (no /'s for some tags, no closing tags for others.) As for building the DOM, I don't know the details of a given implementation (webkit, mozilla, etc) to know which way is faster to parse. I would imagine XML is simply because it is more regular.

EDIT: Yes this behavior is available in HTML5. Note that the help pages are confusing, such as:

http://www.w3schools.com/html5/tag_meta.asp

Meta's in non-xml-html do not require the /, but they can have it. Because of the (in my opinion) leaning towards XML-flavored HTML's the ending slash is more prevalent in written HTML, but you can see they use both styles in the document. The Validator will let you know for sure what you can get away with. :)

Answer 3

If you're writing using an xhtml DOCTYPE, then the answer is 'yes', they are required. An xhtml document needs to be valid XML, which means that all tags need to be properly closed.

An HTML document is a bit less fussy. Some tags are specified as being 'self closing', which means you don't need to close them specifically. These include <br>, <img>, etc.

The browsers are generally pretty lenient, because they need to be able to cope with badly written code. But beware that sometimes skipping closing tags can result in different browsers interpreting your code differently, and producing hard-to-debug layout glitches.

In terms of page load speed, you might be right that there would be a marginal gain to be had in download speed and bandwidth costs, but it would be marginal. In terms of rendering, I suspect you'd actually lose speed if you provided invalid HTML, as the browser would have to work harder to parse it.

So even if there is a speed gain to be had it will be marginal, and I don't think skipping closing tags deliberately is a worthwhile exercise. It might possibly be helpful to reduce bandwidth if you're running a site that has massive traffic, but very few of us are writing for Facebook or Google; for virtually everyone else, it's better to write valid code than to try to shave those few bytes.

If you're that worried about bandwidth and page loading speeds, there are likely to be other better ways to reduce your page load sizes than this. For example, compressing your files with gZip will drastically reduce your bandwidth, with zero impact on your code or the browser. gZip compression can be configured in your web server, so you just switch it on and forget about it. You can also 'minify' your CSS and JS code by stripping out unnecessary white space. (HTML can also be minified to a certain extent, but beware that white space is syntactically relevant in HTML, so minifying may not be the right thing to do in all cases).

Answer 4

Leaving out ending tags is usually forgivable by browsers (it's generally smart enough to know what you're doing). However, any css or js markup properties that the unclosed tag has can affect descendant and/or sibling tags, leaving you scratching your head as to what happened.

While XHTML does expect you to add a closing forward slash to self-contained tags, HTML 5 does not.

XHTML: <img src="" />
HTML5: <img src="">

Answer 5

Some tags in some version of the HTML spec have optional end tags. However, I believe it is generally considered bad form to exclude the end tag.

As mentioned, the end tag of li is optional in html4:

http://www.w3.org/TR/html401/struct/lists.html#h-10.2

so technically this is valid:

<ul>
    <li>
        text
    <li>
        <span>stuff</span>
</ul>

But you are only saving 5 characters per li, not really worth what you lose in readability/maintainability.

EDIT: The HTML5 spec is sort of interesting:

An li element's end tag may be omitted if the li element is immediately followed by another li element or if there is no more content in the parent element.

Answer 6

In HTML 4.01, which became a W3C Recommendation way back in 1999, you're right:

9.3.1 Paragraphs: the P element

Start tag: required, End tag: optional

http://www.w3.org/TR/1999/REC-html401-19991224/struct/text.html#h-9.3.1

And as for <li>,

Start tag: required, End tag: optional

http://www.w3.org/TR/1999/REC-html401-19991224/struct/lists.html#h-10.2