Dev Tutorial: Behind the Scenes with XHTML Behind the Scenes with XHTML Lee Underwood
Behind the Scenes with XHTML
In a previous article, we quickly touched on the requirements for proper XHTML coding, especially in relation to HTML 4.01. In this article, we'll take a closer look at what some of those requirements are in relation to the head portion of the Web page. This is the portion of the document that the user agent (i.e., browser) will read first. It's important that it doesn't stumble here. Remember, our goal is to develop standards-based Web pages (here, I make the assumption that the reader has a working knowledge of HTML).
Let's start at the top of a valid XHTML document and work our way down. For this part of the discussion, I'll be referring to the code below.
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
The first line shown above is the XML declaration. This line defines the version of XML you're using as well as the character coding. It's recommend by the World Wide Consortium (W3C) but is not required. If you're not using XML, it's not necessary. In fact, it can cause problems with some of the older browsers. Most of them will choke if they encounter a page that begins with this encoding. If you don't include the XML declaration, you'll need to include the meta tag below (also shown above, after the title tag). Do not include both.
If the XML declaration is used, it must be the first line on the page. If the content meta tag is used, it must be placed within the head of the document.
The content meta tag is divided into two parts. The first part (content="text/html) tells the browser the mime type. Mime is short for "Multipurpose Internet Mail Extensions". It was originally used in formatting e-mail but is now also used by Web browsers to declare the type of content being served to the browser. The W3C actually recommends using application/xhtml+xml as the mime type for an XHTML document. However, there are problems with using it.
An example is Internet Explorer (up to version 6 for both Windows and Mac), which doesn't recognize it, nor do many other browsers. Using text/html should make your page acceptable to IE and is "allowable" by the W3C. The second half of the meta statement (charset=UTF-8) identifies the character set used by the browser.
Note that the meta tag ends with a " />". This is because, in XHTML, all tags must be closed, except for the DOCTYPE statement. The meta tag is an empty element tag. This means the tag itself is the content or a place holder for the content. Empty element tags include <img /> and <br />. Since the tag has no additional content, it doesn't have an end tag and must be closed within itself. If you leave a space before the slash, older browsers won't get confused.
