0 Validate Your HTML

Validate Your HTML

A lot of people don't seem to worry too much that the HTML for their web page doesn't validate. Many people don't even know what validating a web page is. Their web page looks and functions the way that they want it to in their web browser (usually Internet Explorer) and they haven't even thought of looking at their page in a different browser. When they eventually do look at their page in a different browser not only might their page be a jumbled mess but the JavaScript on their page may also fail to work.

Quite aside from the fact that having invalid HTML may lead to your page not displaying correctly in some browsers (and you can't test all browsers as there are too many thousands of different browsers to install them all), having invalid HTML can also give problems when it comes to your JavaScript.

Whether you use the proper Document Object Model commands from your JavaScript or take a shortcut by using commands such as innerHTML, JavaScript still needs to make use of the DOM in order to work out how to interfact with the HTML. 

When you have valid HTML then all web browsers know exactly how to build the Document Object Model from the HTML so that your JavaScript will know how to access the page content correctly. If your HTML is not valid then the different browsers have to make guesses as to what the invalid code was supposed to mean. This can result in different browsers building a different DOM from the same invalid code and the JavaScript that you have which works in one browser may therefore fail in a different browser due to errors in your HTML.

It is also a good idea to always include those HTML tags that the standards define as being optional such as the head tag, body tag and the tbody tag when you have a table. The browser can work out from the rest of the content of your HTML where these optional tags would be if they were entered and so the Document Object Model will be built as if these tags were included in the HTML whether they are actually there or not. Leaving out these optional HTML tags can make debugging your JavaScript errors much harder when your JavaScript fails to work because you forgot to allow for an element that was not specified in the HTML but which was added by the browser in building the DOM. Including those optional HTML tags actually in your HTML will make it much easier for you to relate the calls to the Document Object Model in your JavaScript to the corresponding tags in the HTML because you will be able to see the actual HTML tags instead of having to remember where the W3C standards say that those tags should be assumed to be when they are not present.

Any JavaScript that interacts with your web page relies on the Document Object Model in order to interact with the HTML. To have that DOM built correctly requires that your web page be valid in accordance with the W3C standards. Validating your HTML is an important step in ensuring that your JavaScript will work properly.

HTML Validator