Using a validator

We will use the W3C MarkUp Validation Service to validate our example page. This validator gives two options for validating a page. You can type in the URL of a page that is already on the Internet or you can upload a page from your computer. The example page is available.

After trying to validate our example page we get 20 errors. Although there are not 20 errors, many errors are passed down because of a previous error. So it's best to start with the first error and work your way down. Also the description of the errors may look complicated. However since we already know what's wrong with our page it will be easier for us to decifer.

Here are the errors for the example page:

Errors:

  • Missing slash in closing tag of title element
  • Missing quotation mark in bgcolor attribute of the opening body tag
  • No slash before close of img element in the first paragraph
  • Wrong closing tag for h1 element around "Pit Bulls"
  • No closing tag for the second p element
  • No closing tag for the h2 element
  • Space between opening bracket and the word p in the third p element
  • Missing space between a and href for link around "Find a poodle"
  • No closing tag for the first list item in the ul element

Here are the errors returned from the validator:

  1. Line 5, column 20: document type does not allow element "TITLE" here (explain...).
      <title>Animals<title>
    
                          ^
  2. Line 7, column 72: document type does not allow element "META" here (explain...).
      ...ype" content="text/html; charset=iso-8859-1" /> 
    
                                                      ^
  3. Line 9, column 6: end tag for "TITLE" omitted, but its declaration does not permit this (explain...).
      </head>
    
            ^
  4. Line 5, column 14: start tag was here (explain...).
      <title>Animals<title>
    
                    ^
  5. Line 9, column 6: end tag for "TITLE" omitted, but its declaration does not permit this (explain...).
      </head>
    
            ^
  6. Line 5, column 0: start tag was here (explain...).
      <title>Animals<title>
    
      ^
  7. Line 11, column 15: literal is missing closing delimiter
      <body bgcolor="gray>
    
                     ^
  8. Line 13, column 44: end tag for element "P" which is not open (explain...).
      <p><img src="images/dog.jpg" alt="A dog"></p>
    
                                                  ^
  9. Line 15, column 17: end tag for element "H2" which is not open (explain...).
      <h1>Pit Bulls</h2>
    
                       ^
  10. Line 17, column 2: document type does not allow element "P" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag
      <p>I really hate dogs. Some people like them.
    
        ^
  11. Line 19, column 3: document type does not allow element "H2" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag
      <h2>Poodles
    
         ^
  12. Line 21, column 10: an attribute specification must start with a name or name token (explain...).
      < p><ahref="http://www.poodle.com">Find a poodle</a></p>
    
                ^
  13. Line 21, column 10: element "AHREF" undefined (explain...).
      < p><ahref="http://www.poodle.com">Find a poodle</a></p>
    
                ^
  14. Line 21, column 51: end tag for element "A" which is not open (explain...).
      < p><ahref="http://www.poodle.com">Find a poodle</a></p>
    
                                                         ^
  15. Line 21, column 55: end tag for "H2" omitted, but its declaration does not permit this (explain...).
      < p><ahref="http://www.poodle.com">Find a poodle</a></p>
    
                                                             ^
  16. Line 19, column 0: start tag was here (explain...).
      <h2>Poodles
    
      ^
  17. Line 23, column 3: document type does not allow element "H3" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag
      <h3>Top Dog Breeds:</h3>
    
         ^
  18. Line 25, column 3: document type does not allow element "UL" here; missing one of "APPLET", "OBJECT", "MAP", "IFRAME", "BUTTON" start-tag
      <ul>
    
         ^
  19. Line 32, column 6: end tag for "H1" omitted, but its declaration does not permit this (explain...).
      </body>
    
            ^
  20. Line 15, column 0: start tag was here (explain...).
      <h1>Pit Bulls</h2>
    
      ^

 

We already know what the first error is telling us. It says that we need to place a slash on our closing title tag. Now if we look at error #2, it tells us that we have placed a meta tag in the wrong location. However this is not true. This error shows because of error #1. If we change error #1 and run the validator again, we get 16 errors. Go through this example and try to remove the errors listed by the validator. Make sure you validate after each error.