You know, I’ll always prefer HTML over XHTML because it’s much less verbose and I like to keep things simple. True story.

But that didn’t stop me from wondering how exactly one triggers HTML5’s XML mode — let’s call it XHTML5 from now on. As it turns out, there are three easy steps to convert your HTML5 documents to XHTML5.

Use the correct MIME type

You’re not really using XHTML5 until you’re serving your documents with the corresponding MIME type. For XML, this is application/xhtml+xml. You can easily do this by configuring your web server, or by using a server-side scripting language. Here’s an example in PHP:

<?php header('Content-Type: application/xhtml+xml;charset=UTF-8'); ?>

Note that documents served with this MIME type won’t render in IE8 and older versions. Instead, they’ll trigger a download popup. (There is a workaround that allows you to send them as application/xml instead, but why bother when you could just use HTML?)

Use the correct DOCTYPE — or don’t use it at all

The DOCTYPE declaration, which can be written as <!doctype html> in ‘regular’ HTML5, can be omitted in XHTML5. If you insist on using it, however, you should know ‘DOCTYPE’ is supposed to be written in uppercase in XML mode, like this:

<!DOCTYPE html>

Note that if you don’t uppercase DOCTYPE, the XML parser returns a syntax error.

The second part can be written in lowercase (html), uppercase (HTML) or even mixed case (hTmL) — it still works. However, to conform to the Polyglot Markup Guidelines for HTML-Compatible XHTML Documents, it should be written in lowercase.

Specify the XML namespace

XHTML5 requires you to add an XML namespace to the root element of the document, which in this case is of course the html element.

<html xmlns="http://www.w3.org/1999/xhtml">

Putting it all together

That’s all there is to it. You can view an example XHTML5 document. This is pretty much what the source code looks like:

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
	<head>
		<meta charset="utf-8" />
		<title>Example XHTML5 document</title>
	</head>
	<body>
		<!-- HERE BE DRAGONS -->
	</body>
</html>

Remember, the document must be served as application/xhtml+xml to trigger HTML5 in XML serialization mode. The DOCTYPE declaration is optional in XML mode, but if you don’t want to omit it, it needs to be uppercase.

Of course, you’ll have to use valid XHTML syntax for your document to work. This means you won’t be able to use <noscript> or document.write(). Also, a single syntax error is enough to cause a Yellow Screen of Death instead of the page you wanted to display. Use with caution!

Better yet, never ever use XHTML unless you have a very good reason to do so! There’s no added value, and it only complicates things. When in doubt, use regular HTML5.