Sams Teach Yourself HTML 4 in 24 Hours

Sams Teach Yourself HTML 4 in 24 Hours

By Dick Oliver

XHTML, the New HTML

XML does pose a few problems, not the least of which is that the HTML and XML standards are almost—but not quite—compatible with one another. To smooth out these technical bumps, the W3C created a 100 percent XML-compliant version of HTML 4, called (you guessed, didn't you?) XHTML 1.

(Does that mean there will never be an HTML 5 standard? Sort of. There will undoubtedly be more tags and attributes added to HTML in the future, but the result will probably be called XHTML 2 instead of HTML 5.)

The most important thing for you to know about XHTML? How to write your Web pages for compatibility with it, while still remaining compatible with HTML-based Web browsers. If you learned HTML from this book, you have nothing to worry about because every example in the book and on the accompanying Web site (http://24hourHTMLcafe.com) is fully compatible with both HTML 4 and XHTML 1. If you have some older HTML pages that you need to convert for XHTML and XML compatibility, the following checklist will get you there:

  1. In HTML, it doesn't matter whether tags are uppercase, lowercase, or a mixture of both. In XHTML, all tags must be lowercase. For example, use <body> instead of <BODY>.
  2. Closing tags are often optional in HTML, but are always required in XHTML for any tag that encloses (refers to) some content. For example, every paragraph must begin with a <p> tag and end with a </p> tag. Likewise, every <li> list item must have a closing </li>, every <td> table data cell must have a closing </td>, and so forth.
  3. HTML tags that don't enclose any content (such as <br>, <hr>, and <img>) must now contain a slash (examples: <br /> <hr /> <img src="pic.gif" />). This tells XHTML interpreters not to expect a closing tag.
  4. In XHTML, all attribute values must be enclosed in quotation marks. For example, <img src=pic.gif border=1> was valid HTML, but it must be written as <img src="pic.gif" border="1" /> to be valid XHTML.
  5. All attributes must have values in XHTML. For example, <input type="checkbox" checked> should technically now be written as <input type="checkbox" checked="checked">.

    CAUTION

    The preceding XHTML value rule is the only one that causes problems in some current Web browsers, especially pre-1998 Macintosh versions of Microsoft Internet Explorer. You may want to continue to use the old HTML form of valueless attributes for a while longer, until all the people clinging to their hopelessly antiquated, non–XHTML-compatible ways just give up and stop using computers altogether (or until they upgrade their software, whichever comes first).

  6. For technical reasons (read: bizarre and confusing reasons we don't need to get into), XHTML uses <a id="AnchorName"></a> instead of <a name= "AnchorName"></a> to create a named anchor. (See Hour 7, "Email Links and Links Within a Page," if you don't quite remember what an anchor is.) This is the only direct contradiction between HTML 4 and XHTML 1, but it's easy enough to be compatible with both. Simply use <a id="AnchorName" name="AnchorName"> </a> . (This redundancy is a bit of a hassle to type, and to be honest I haven't strictly followed the rule on this one in some of the examples in this book or on my own Web sites, since I doubt anyone will ever actually write software that fails to recognize name as meaning the same thing as id in this context.)

  7. Certain special characters are not allowed in HTML because in context it might be hard to tell if they were meant as part of a mark-up tag. XHTML forbids the same characters, but is much more strict about not allowing them to appear in embedded style sheets and scripts. The forbidden characters and the codes you must replace them with are shown in Table 24.1.

    (This is another case where I deserve a little slap on the wrist for not following religiously; for clarity I have used the single quotation mark character instead of #39; in some of the JavaScript examples in this book.)

Table 24.1. Characters You Should Avoid Using in XHTML Pages

Replace This… With This…
&(ampersand) &amp;
"(quotation/inch mark) &quot;
<(open angle-bracket) &lt;
>(close angle-bracket) &gt;
[ (open square bracket) &#91;
] (closed square bracket) &#93;
'(apostrophe/single-quote) &#39;

TIP

If you have a number of HTML pages that you'd like to convert to XHTML-compatible format, I strongly recommend that you download the free HTML-Kit software from http://www.chami.com/html-kit/. This free program includes a module called HTML-Tidy, which automatically changes HTML to conform to the rules mentioned here and also reports any other problems or incompatibilities it finds.

HTML-Kit is also a friendly and well-designed text editor with many handy features for writing new HTML and XHTML pages. I used HTML-Kit 1 to convert and edit every example file in this book, and didn't encounter any bugs or errors; you shouldn't hesitate to trust your precious pages to it. (One caveat: HTML-Tidy changes the line breaks and spacing of your code, so you may have to do some reformatting by hand if you like to neatly indent your code.)

Share ThisShare This

Informit Network