How to Correct and Validate Your HTML

by Eileen Mullin — May 11, 2007

Validating your HTML documents is an automated process, akin to spell-checking your Word documents. Sounds like a no-brainer that any conscientious Web developer should do, right? However, HTML validators can sometimes return cryptic or arcane-sounding results that may be difficult for Web site developers to determine how to fix. HTML validators may confuse novice Web designers as much as help them. As a result, it's an important safeguard that too many Webmasters skip over. It's like the Web equivalent of not flossing.

Validating your HTML is important because we all make mistakes when writing code. For checking HTML pages one at a time, I like to use online validators because they are free and up-to-date. The W3C, a standards body that regulates what is and is not in the HTML specifications, offers its W3C HTML Validation Service at http://validator.w3.org/. To use it, you can enter the address of a Web page that is already online, upload the HTML file, or copy-and-paste your HTML document in the online form. After you submit your information, the W3C HTML Validation Service will display a listing of the potential problems found in your HTML. After correcting the mistakes, you can resubmit your page to confirm that your document is free of HTML errors.

You may wonder, though, what do I do if I don't know what the errors mean? For example, I know one Web marketer who uses an online service for sending HTML e-mail newsletters that requires validation checking. If any HTML errors are found, the e-mail cannot be sent. As a fairly new HTML user, though, she simply gets stuck trying to decipher whether the problem is. It's important to realize, though, that there are several common HTML errors that are to blame for most validation problems. Here are some top troublemakers — and how you'd fix them:

  • Missing DOCTYPE. The first line of your HTML document should be a DOCTYPE declaration; otherwise, HTML validators will not be able to do their job. For example, a typical HTML 4.01 document would use the following as its first line:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

  • Missing closing tags. It's easy to leave a tag open by accident — for example, omitting a closing </b> or </table> tag — especially if you to tend to copy-and-paste code among documents. These errors can also present visible problems on your Web pages.

  • Improper nesting of HTML tags. This common error occurs if you fail to close tags in the reverse of the order in which you opened them:

    <b><i>This is proper nesting.</i></b>.

    <b><i>This is improper nesting.</b></i>.

    This is an easy error to make, but luckily it's an easy fix as well.

  • Missing quotation marks. Here's an example to demonstrate:

    <a href="http://www.cnn.com/>Find the missing quotation mark.</a>

  • Missing alt attributes. The alt attribute is required by the <img> tag, to show alternate text describing an image used in a Web page.

Once you've gotten the hang of how to prevent and resolve these common HTML validation errors, you'll feel a real sense of satisfaction when you run a validator and see clean, error-free results. Congratulations on pursuing the good habit of validating your HTML code — it will pay off in the long run!

Del.icio.us Digg Technorati Blinklist Furl reddit Design Float