Validating Your WebPage to XHTML 1.0 Transitional
Validating to the recommended standards set out in the XHTML Transitional doctype is a popular trend of late, but not a lot of people can do it properly — most are still using deprecated coding/etc. The point of advancing HTML and moving over to XHTML was to clean up the coding and to provide better compliancy with a wider range of devices which can now browse the Internet. By simply sticking an XHTML doctype up and not following any of the recommendations people are defeating the point of this cross-breed language.
There are some important differences between XHTML and HTML. All tags must be closed, tags must be properly nested, tag attributes/names must be in lowercase and XHTML documents must be structured correctly.
All tags closed? But some elements don't have closing tags?
This is where we employ the help of the handy forward slash. Anything which doesn't have a ready-made closing tag needs a space (for cross-browser compliancy) and a forward slash placed before the closing >. <img>, <br> and <hr> are a few examples of tags which need to be closed with the 'new' technique.
<img>becomes<img /><br>becomes<br /><hr>becomes<hr />- ..and so on.
What's this about nesting? Nesting is for birds!
Properly nesting a tag is simply the process of opening and closing tags in the right order. To nest tags, you must simply close tags in the opposite order in which they are opened — like symmetry. For example: <a href="index.html"><strong> text </strong></a>
Lowercase? Why lowercase?
Ahh — this is because XML is case-sensitive. XHTML is based on XML and similar standards are followed. All tags and attributes need to be lowercase. <a HREF="link.html"> is just as incorrect as <A HREF="link.html"> and <A href="link.html">. This is correct: <a href="link.html">
Correct structure? You mean with steel girders, right?
It's not that kind of structure. All tags (with the exception of the doctype) must be inside the root <html> </html> element and <head> </head> must come before <body> </body> and so on. Example:
<html>
<head> </head>
<body> </body>
</html>
Phew! All that fuss. That's it now?
Nope — there are certain other important parts to the XHTML specification. For example, all images must have an alt attribute. If the image is a purely decorative one, you can specify a blank alt (alt=""), otherwise it must contain a short description of the image (longer descriptions can be specified with longdesc="").
Unlike with HTML, all attributes within a tag must be quoted (<a href="link.html"> and not <a href=link.html>). Also, attribute minimilisation is not allowed — things like <frame noresize> must be changed to <frame noresize="noresize" />. Full list:
| HTML | XHTML |
|---|---|
| compact | compact="compact" |
| checked | checked="checked" |
| declare | declare="declare" |
| readonly | readonly="readonly" |
| disabled | disabled="disabled" |
| selected | selected="selected" |
| defer | defer="defer" |
| ismap | ismap="ismap" |
| nohref | nohref="nohref" |
| noshade | noshade="noshade" |
| nowrap | nowrap="nowrap" |
| multiple | multiple="multiple" |
| noresize | noresize="noresize" |
Another important thing about XHTML coding is that id="" now replaces name="". However for compliancy across older browsers it is advisable to use both id="" and name="" together.
Under the XHTML transitional doctype, you can use all of the tags which were allowed in the HTML 4.01 transitional doctype. However, the same tags are deprecated and should be avoided if possible. The deprecated elements are:
<applet><basefont><center><dir><font><isindex><menu><s><strike><u><xmp>(use<pre>instead)
Last, but certainly not least — to insert the mandatory doctype. As we've learnt about Transitional validation, you'll need to Transitional doctype (this goes at the very top of your XHTML document, before the <html> tag):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Your page should now be ready for basic XHTML validation. You can test to see if your pages are valid at the w3c x/html validator.
Final note: Although a page will validate without it (because the validator will add it for you), it is recommended that you put the xmlns attribute (xmlns="http://www.w3.org/1999/xhtml") in the <html> element of an XHTML document.
Tags:
,
Last Updated On: 05th February 06 by Jem
Bookmark At: StumbleUpon, Digg
Handy Stuff
Downloads
Top Links
Resources