Serving HTML5 as application/xhtml+xml

Serving HTML5 as application/xhtml+xml is quite simple, though there are some gotchas you need to know before doing so. The first thing to do is to set an XML prolog before the HTML5 DOCTYPE, thus providing also the default character encoding of the entire document. Since all XHTML documents have also a meta tag that tells the validator what kind of content type they're going to handle, most developers will try to set this kind of tag in the head section of their documents. Unfortunately, this will return a validation error.

There's no need to set this kind of tag. To pass validation, you have to follow two approaches:

  1. if you're serving a static file with a file extension (such as xht or xhtml), you don't need this tag
  2. if you're serving a dynamic document, just set the appropriate HTTP header before returning any output.

Finally, you have to set the XHTML namespace on the root element, which is http://www.w3.org/1999/xhtml. A basic HTML5 template served as application/xhtml+xml is shown below.

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Serving HTML5 as application/xhtml+xml</title>
</head>

<body>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
</body>
</html>

This entry was posted in by Gabriele Romanato. Bookmark the permalink.

2 thoughts on “Serving HTML5 as application/xhtml+xml”

  1. You can serve HTML5 as application/xhtml+xml, but why? What's the compelling use case?

    Also, why are you referencing jQuery in your code? You make no mention of it in your explanation.

  2. application/xhtml+xml is useful when you want to benefit both of HTML5 elements and attributes plus other markup languages, such as SVG and MathML which require this content type. SVG is handy when you have to draw complex graphics and preserve the accessibility of your content. Finally, JavaScript frameworks can actually be used with this MIME type, obviously by knowing in advance that there are some differences, for example with the use of the innerHTML property and, conversely, all the framework-specific methods that make use of this property.

Leave a Reply

Note: Only a member of this blog may post a comment.