How do I validate my Web pages and end up with one of those nifty “xhtml 1.0 verified” graphics for my page?
In the beginning of the Web, web browsers were lazy and HTML coders were
sloppy, trusting that if things ‘just kinda worked alright’ that it was time
to move on to the next page. As the HTML language and its descendents began
began to be a problem that sloppy HTML was so pervasive.
Worse, the World Wide Web Consortium published a formal, but almost incomprehensible
specification that detailed exactly the valid and legal HTML language
structure for each generation of HTML.
The idea of a validator is that you can feed it the address of a Web page,
specify exactly what ‘flavor’ of HTML you’ve written it in, and it’ll then
parse and analyze the actual tag structure to see if it’s all legal. There
are a surprisingly large number of different flavors of HTML too, but the
newest and most important is called XHTML, a slight twist on HTML 4 that
enforces XML-based syntax.
In a nutshell, this means that you can’t do something like this:
Sample line one. <p> Sample line two. <P align=center> Sample line<br>three.
Why? Because the
paragraph tag is a container tag: it needs a closing </p>
each time it’s used. Further, all xhtml tags MUST be in all lowercase, so
the second <P> is wrong in that regard too. Finally, every argument must be
quoted (e.g., align=”center”) and every non-paired tag must end with the
rather odd looking space+slash+angle sequence: <br /> not <br>
So why bother? Because as more sophisticated Web-based tools appear on the
network, they are more and more relying on properly formed pages. Ditto the
latest generation of browsers. And in general, it’s just good karma to have
clean, properly written pages, just as it’s best to communicate with proper
spelling and grammar.
STRUCTURING A PAGE FOR VALIDATION
So that’s the long answer as to why validation is useful. To actually
validate a Web page you need to do two things:
- Add an XML type definition to the very top of the page. I use this:
<?xml version="1.0" encoding="UTF-8"?>
This indicates that I’m using 8-bit Unicode (you’ll probably be using the
same on your page: you can safely copy this without knowing more about it
than ‘it’s gotta be there’)
- Add an HTML or XHTML data definition reference line. I use this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
This says that I’m writing “xhtml 1.0 transitional” code. There are lots of
different types of DOCTYPE, as alluded to earlier in my message. You can
find a list of ’em at the w3.org Web site, if you’re curious.
TO VALIDATE YOUR PAGE
To validate your Web page, once you’ve added the ?xml and !DOCTYPE header
lines as detailed, go to http://validator.w3.org/ and enter the full URL of
the page. You can also upload files directly to their validator, but since I
always have my projects online in a work directory, I let them find it
If everything looks good, you’ll run the validator and, assuming you’re also
writing to xhtml 1.0 transitional, it’ll come back with the cheery message:
This Page Is Valid XHTML 1.0 Transitional!
Otherwise you’ll see:
This page is not Valid XHTML 1.0 Transitional!
and it’ll give a detailed list of the problems it found and why they’re a
problem. Fix them, submit the URL again, and you should be able to get to
the success message.
Then, finally, at the bottom of that page is the information on how to link
to the neato graphical buttons on your own validated pages.