Validating Web Pages

Getting your pages ready for validation
The validation process itself
Fixing what's wrong
Interpreting Error Messages

Getting your pages ready for validation

Is there a Document Type Definition (a "DTD") above the <html> tag in your document?
Here's one that is commonly used:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
Is character-encoding properly specified in the documents head?
Here's a sample that works for English and most European languages:
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

Putting these together your structure might be something like this:
```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

 <head>

 <title>title goes here</title>

 <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

 </head>

 <body>

 ... 	text ... 

 </body>

</html>
```
Check your HTML:
1. Are all tags closed that need to be?
 For tags such as <ol><ul><table> there must be a corresponding closing tag.
2. Are tags properly nested?
 For example, this is wrong: Text
 The tag opens first, but it closes first. No overlapping tags are allowed in valid HTML.
 Your broswer might show it the way you want it but it should be:
 Text
3. What goes into what is important!

The Validation process itself

The Validation form from W3C (the World Wide Web Consortium) allows you to validate all sorts of mark-up (HTML, XHTML, CSS, and so forth). You can use it to validate pages that have been put on the web, and pages that are still in your file space. Here we'll be using it to validate forms in your file space.

Here's what the Validation form looks like:

Notice there are two buttons for Validation - "Validate URI" and "Validate File". You will be using "Validate File" button since the files you'll be checking will not be on the web. (Even if you've put them up in your "public_html" folder on Raptor, this file space is only viewable within a University of Kent log-in, so the W3C validator can't get to the page).

Using the Browse button, find the file that you want check for Validity.
When you've found the file you want, and it appears in textbox, click on Validate File.

Fixing what's wrong

There are a few options:

Your HTML validates. Nothing's wrong! Congratulations!
You get nothing useful back at all. It says
I was not able to extract a character encoding labeling from any of the valid sources for such information. Without encoding information it is impossible to validate the document.
Try using the Extended File Upload Interface. Choose appropriate values for the DTD (4.02 Transitional) and the character encoding.
It says you've got a bunch of errors.

Start with the first bunch - all related to a specific line in your HTML. Note down what it says there. Scroll down in the Validator results window to where your HTML code is listed. Look for the line that was the first problem. See if you can figure out what's wrong with that line. If you can see a problem, go back to your text editor. Fix the problem, view the page in a browser, then go back to your web connection to the Validator and try it again.
You've got a pile of errors and nothing seems to be correct.
Start simple.
Let me repeat that: Start simple!

Make the simplest web page you can that will validate.
Browsers, of course, will let you get away with practically anything, and that's as it should be. You can write a web page that a browser will show by just writing a single character - "T" for example and saving that to a file with an html extension- say "T.html", but, of course, that won't validate.

The simplest page I can think of that will validate (and has some "content"- just the capital letter T):
```
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
	<html>
		<head>
			<title>The letter T</title>
			<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
		</head>
		<body>
			T
		</body>
	</html>
	
```
You're stuck. You can't figure out what's going on. Comment out parts of your code. This means the validator won't look at the code between the comment marks. Put  around bunches of code. This can help to figure out what right and wrong.
CAUTION: you need to be careful not to have other comments in the part you're commenting out and comment out only full and complete blocks of code - from before a tag to after that tag's matching close.

Interpreting error messages

W3C themselves state that

Interpreting the error messages isn't quite what you'd call easy. The error messages are generated in the context of a full SGML environment which demands a somewhat higher level of technical detail then your average HTML

http://validator.w3.org/docs/users.html

You write:	What's wrong	The validator says	You might try
<p><b><i>Text</b></i></p>	The bold tag starts. Inside it is an italic tag. The bold tag finishes, but the italic tag has not been closed.	end tag for "I" omitted, but its declaration does not permit this <p><b><i>T</b></i></p> ^ start tag was here <p><b><i>T</b></i></p> ^ end tag for element "I" which is not open <p><b><i>T</b></i></p>	Switch the order of the tags.

The validator says	You might try
end tag for element "P" which is not open </p>	Deleting the tag </p>

W3C provides a page to guide users to better understand the responses from the validator.
It can be very helpful, but it takes a bit of getting used to. I've used it to help me build the table above. Have a look, but, if it feels like information overload, work through the steps suggested above.

Bob Keim CO352 October 2003