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
to evolve into ever-more-powerful systems (e.g., XML, JavaScript, CSS), it
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.

Enter validators.

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
directly.

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.

6 comments on “How do I validate my Web HTML pages?”

Pat says:

October 21, 2010 at 5:07 pm

There are some easy to follow guidelines when you run the validation http://www.webauditapp.com – I came across it when doing some W3C validation.

Ross Sakey says:

March 29, 2008 at 5:58 pm

Hi Dave,
How do i get to draw a line across the two cells/parts of the “Interests” panel of my myspace profile. (using xhtml code)
(This is an obvious request, which most people would wish to know, but it is fiendishly difficult to get any type of clear and relevant explanation on.)
I am just learning HTML coding etc.
I was using to great effect until the browser suddenly decided to not recognise it.
After some research on google i came to the conclusion that myspace was now using XHTML.
Hence will not work.
If you check my site you will see that i have managed OK with stopping the Text from Wrapping by using 100 m as advised.
I have been able to enter links etc on one line so they make more sense to the uninitiated.
But stubbornly refuses to work using this method and wraps halfway. Grrr!!!!
(I wish to draw a line under each section containing a Band Logo/Photo & Link, so as to make it more obvious which part is related to which etc.)
Sorry if this is a bit of a long winded explaination.
Cheers!
Ross Sakey

David Corking says:

June 11, 2005 at 9:40 am

Thanks, Dave – you have alleviated my concerns.
I didn’t realise the differences between SGML and XML were that small.
I thought that I would upset IE by closing out every tag and using an XML DTD.
I see now that you have picked XHTML 1.0 Transitional for this site and it is clearly working well for you.

Dave Taylor says:

June 10, 2005 at 11:01 pm

I don’t fully understand your comment, David, because the difference between well-formed HTML 4.01 and well-formed XHTML is so miniscule that I can’t imagine anyone be pro or against any of it. I mean, in HTML you’d write a tag like <hr> and in XHTML you’d write <hr />
Is there really enough to quibble over?

David Corking says:

June 10, 2005 at 11:01 am

Dave,
Is HTML 4.01 more useful than XHTML 1.0 ?
There is a bit of advocacy building up against using XHTML until there is a widely-used version of IE that supports it. I read this article and it concerns me:
http://hixie.ch/advocacy/xhtml
Since I rarely use IE, and XHTML support (with the proper MIME type) in IE seems to be a long time coming, I am concerned to choose the right standards for my first websites.
What have been your choices of standards, and why have you made them?
My plan right now is to ignore the naysayers, stick with the new XHTML standard (validated 1.0 Strict), test in IE6 to make sure it looks ok, and hope for the best regarding IE5 and IE5.5.
David