The Rules
At the moment, the best one can hope to do is to write XHTML documents that are compatible with current browsers. I'll run down a few of the rules for writing in XHTML. If you've already read my XML tutorial, many will be familiar to you.
1. You will use the XML & XHTML declaration statements to start every XHTML page:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "DTD/xhtml1-strict.dtd"> |
The commands will alert the browser displaying the page that XHTML is the language to render.
2. The head and body tags are now mandatory.
3. Every tag must be closed.
In HTML, you could get away with simply putting a <P> between paragraphs and the browser would render it just fine. If you only had one table on a page, you didn't need the end TD and end TR tags. Under the XHTML DTD, that's no longer true. All tags that require end tags get end tags.
4. Empty tags get a terminating slash.
An empty tag is a tag that doesn't require an end tag. Examples include <BR> and <HR>.
Under the XHTML DTD, empty tags will now carry a space following the tag text and then a terminating slash, like so:
- <BR> is now <br />.
- <HR> is now <hr />.
- <IMG SRC="--"> is now <img src="--" />.
You may have noticed above that I wrote head, body, br, hr, and img in lower case in the XHTML examples. That's because:
5. All tags must be lower case.
This does not apply to attributes, only tags. For example, both of these formats are acceptable under the XHTML DTD:
- <font color="#ffffcc">
- <font color="#FFFFCC">
You may have noticed that I have quotes around all of the attributes. That's because:
6. Attribute quotes are now mandatory.
7. Tags may not nest.
In HTML, this is an acceptable format. It will render:
<B><I>Text</B></I>
No more. Now the tags must follow a logical begin and end pattern. They must end at the same level as they are started. This is the proper XHTML method of writing the code above:
Once again, note the lower case tags.
8. Attribute values must be denoted.
Most attributes are done this way. For example, FONT FACE="arial". Notice that "arial" follows the attribute "FACE=".
The attribute and equal signs, in some cases, have been eliminated in HTML. For example:
- <INPUT TYPE="radio" checked>
The word "checked" is a minimized attribute. Under XHTML, no more. You must denote every attribute. Here's the correct method of writing what is above under the XHTML DTD:
- <input type="radio" checked="checked">
These don't come up too often. Here are a few examples in HTML format:
- <INPUT TYPE="radio" checked>
- <INPUT TYPE="checkbox" checked>
- <OPTION selected>
- <DL compact>
- <UL compact>
In each case, you'll need to set the minimized attribute to one that is denoted. The easy way to remember it is that it always denotes itself: checked="checked" and selected="selected".
9. The <pre> tag cannot contain: img, object, big, small, sub, or sup.
10. You may not have any forms inside of other forms.
11. If your code contains a &, it must be written as &.
12. Any use of CSS should use all lower case lettering.
13. Any use of JavaScript should be done through external JavaScripting.
OK, this is not always true. You can set up a JavaScript within an XHTML DTD page. Here's a look at the format:
<script language="JavaScript type=text/javascript">
<![CDATA[
document.write("Hi there");]]>
</script>
I think you'll agree, my statement above, although not totally true, will save you multiple headaches.
14. <!--Comments are no longer used.-->
If you want to write a comment in an XHTML document, you write it as:
- <[CDATA[comment goes in here]]>
15. JavaScripts are no longer commented out. That will throw big errors in some browsers.
XHTML: Good or Bad?