Simply put XHTML5 is the latest standard of HTML that is realistically achievable at the time of this writing. Also known as Polyglot HTML5, XHTML5 is a robust implementation of the HTML5 standard. Essentially it is HTML5 delivered with the content type of “application/xhtml+xml”, which will not work on all browsers. Which is what the polyglot part is about, the server will decide which content type should be sent to allow backward compatibility.
In case the client cannot accept XHTML5 the server will provide it with standards compliant HTML5 instead by delivering it with the usual content type of “text/html”. The pages are really written in HTML5 with proper end slashes of course:
<img src="/" alt="Home" />
Where HTML 5 allows both trailing slashes and omitting ending slashes, XHTML5 on the other hand, will not allow markup such as:
<img src="/" alt="Home">
Notice the ending slash is not required for HTML5 but with XHTML5 it is required otherwise there will be an error saying the markup is malformed. This provides strict error checking within the browser itself. The best part is that all modern browsers support XHTML5, however for those who haven’t updated the browser in a while the robust nature of XHTML5 will allow a perfect rendering for those browsers and devices that are too older to support XHTML5.
Using XHTML5 enforces coding standards in the markup that would be left up to personal preference otherwise. But by simply serving XHTML5 all developers on your team will be required to use proper end tags and ending slashes for inline tags, as well as many other specifications which can often get ignored.
Search engines will most like be considering pages done in XHTML5 to be new code since it adheres to the latest standards and enforces very high quality markup. It stands to reason that if that much care is being taken with the markup then the content is probably of a higher quality as well.
I would like to suggest a template to server XHTML5 using PHP. The structure of the document could be as follows:
<?php
if (isset($_SERVER["HTTP_ACCEPT"]) && stristr( $_SERVER["HTTP_ACCEPT"], "application/xhtml+xml")) {
header("Content-type: application/xhtml+xml;charset=UTF-8");
echo '<?xml version="1.0" encoding="utf-8" ?>' . "\n";
} else {
header ("Content-type: text/html;charset=UTF-8");
}
?>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Testing XHTML5</title>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="css/styles.css" />
<script src="js/scripts.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
That is the basic template for the XHTML5 (Polyglot HTML5) markup. The PHP code at the top checks to see if the client supports the content type “application/xhtml+xml”, then it delivers that content type to create the XHTML5 markup that is sent to the client. Otherwise it sends the text/html content type creating the HTML5 markup which the older client, browser or device can then process.
I developed this template in order to use the XHTML5 for HTML I write. I keep referring back to this template to get my HTML up to XHTML5 standards, so I thought it might help others to post it here.
Please comment below with questions or suggestions for improvement, thanks!