XHTML 1.0 and HTML 4.0 consist of the same sets of elements. (HTML5 introduces some new elements, but those are not covered in this course.) The only difference between HTML and XHTML is that HTML is fairly flexible; whereas, XHTML has strict rules.
HTML is a SGML-based; whereas XHTML is XML-based. XML and SGML are both meta-languages (languages for defining other languages). XML applies stricter rules than SGML does.
The DOCTYPE declaration goes at the beginning of the document and is used to indicate which version of (X)HTML the page uses. There are three versions of (X)HTML documents: strict, frameset and transitional (loose). In HTML, the DOCTYPE declaration is optional. In XHTML, it is required.
All this DOCTYPE stuff used to be really important and is explained below, but with the introduction of HTML5, there is an easy way out, which we highly recommend as it is both simpler and forward-compatible. Instead of worrying about the complicated DOCTYPEs explained below, simply use the new HTML5 DOCTYPE:
This DOCTYPE is, believe it or not, completely backward compatible and will make all browsers work in "standards mode."
As many web pages will still use the old DOCTYPEs, they are worth understanding and are explained below.
The strict versions of HTML and XHTML do not allow use of tags and attributes that have been deprecated.
Deprecated tags are tags that the W3C has indicated may eventually be removed from the specification because of new and better ways of accomplishing the same thing. Most of these tags are for formatting; the W3C recommends using Cascading Style Sheets instead. See http://www.w3.org/TR/html401/appendix/changes.html#h-A.3.1.2 for a list of deprecated tags.
The strict versions do not support framesets.
XHTML Strict <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> HTML Strict <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
The transitional (or loose) versions of HTML and XHTML allow for the use of deprecated tags and attributes. The transitional versions also do not support framesets.
XHTML Transitional <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> HTML Transitional <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
The frameset versions of HTML and XHTML are the same as the transitional versions, except that they also support frames.
XHTML Frameset <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> HTML Frameset <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
HTML 4.0 allows some closing tags to be omitted. For example, in HTML, list item (
<li>) tags do not require a matching close tag (
In XHTML, all tags must be closed. Empty tags are closed by adding a forward slash before the final angle bracket of the tag:
<tagname att1="value" att2="value" />
Note the space before the forward slash. Though this is not required by XHTML, it may help older browsers from getting confused.
In HTML 4.0, the forward slash is not required:
<tagname att1="value" att2="value">
In HTML, case is not important. In XHTML, all tags and attributes must be in lowercase letters.
In HTML, attribute values do not always have to be in quotes; whereas, in XHTML quotes are required. Either single quotes or double quotes may be used.
In both HTML and XHTML, tags should be nested properly. Proper nesting requires nested tags to be closed in reverse order from which they were opened. Another way to say this is that each element must be completely contained by its parent element. For example, the following line of code uses improper nesting:
The corrected line looks like this:
XHTML documents are, by definition, XML documents. This means that they follow the rules of XML. Although not required, it is good practice to include an XML declaration in your XHTML documents. If included, the XML declaration must be at the very beginning of the document. The XML declaration looks like this:
<?xml version="1.0" encoding="UTF-8"?>
For best results, it is best to define the encoding in a
meta tag as well. Note that you should include the following tag within the
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
In XHTML documents, the html tag must contain an
xmlns declaration for the XHTML namespace, which indicates that the document must conform to the rules defined in the XHTML namespace. The syntax is shown below: