The W3C is the World Wide Web Consortium. This groups sets the coding standards for client-side code that runs in browsers. This includes HTML, XHTML, and CSS. Their web site, W3.org includes tools that validate a web page’s HTML/XHTML and CSS code to assure that it meets the proper coding standards. This article coves the HTML validator.
Why Use the Validator?
There are a number of good reasons for using the HTML validator.
1. Valid code helps assure browser compatibility, which in turn helps a web page to render faster and more accurately.
2. Some search engines, such as Bing, state in their Guidelines for Successful Indexing that you should “Use only well-formed, HTML code in your pages.” While the majority of coding errors will never affect search engine rankings, there are a few errors that can.
3. The validator can be a good trouble shooting tool when you are looking for a hard-to-find rendering problem.
4. Using the validator is a good way to learn how to write standards-compliant code. There is big difference in coding standards when a page is upgraded from HTML 4.01 to HTML 5. Using the validator is a good way to learn about the differences.
The validators will only scrutinize client-side code and will not identify issues with any server-side code, such as PHP or ASP.NET. The focus is on the validity of the code sent to a user’s browser.
The HTML/XHTML Markup Validator
The HTML Markup Validator is found at http://validator.w3.org. There are three tabs used to Validate by URI, Validate by File Upload or Validate by Direct Input. Every web page should use a valid Doctype prior to using these tools. The Doctype sets the standard to use to scrutinize the page for compliance.
“Client-side code” refers to complete web page code as it is sent to a user’s browser. This can be the code you see when you select View > Source in a browser. It can also be the code used to generate a static HTML page.
“Server-side code” is code that runs on a server and is used to generate client-side code for dynamic web sites. This can be PHP, Java or other web server languages. The extension on a web page file name does not matter as far as validation is concerned. The server-side code for dynamic web pages generates the client-side code, and the validity of the client-side code is all that matters.
For a live web page, choose Validate by URI, enter the URL for the web page, and click the Check button.
For a web page currently being developed on your PC, choose Validate by File Upload, browse to the file, upload it, and click the Check button. This method will only work for client-side code, such as a complete HTML or XHTML page. It will not validate server-side code.
The third method is Validate by Direct Input. This means that you will need to cut-and-paste the complete client-side code into the text box.
After running the validation, you will either see a green bar with words indicating that the code passed all of the tests and is valid for the chosen Doctype, or you will see a red bar and a list of coding errors and warnings. Keep in mind that all errors do not necessarily cause a problem. An error is simply an indication that the code segment identified does not meet the standard.
To help identify the location of the errors in your code, check the Show Source box and run the validation again. The tool will display the code that is being validated and adds line numbers to make it easy to find the exact line where the problem exists.
For a web page to be completely compliant, all of the errors and warnings should be addressed. Some of the error messages are cryptic. We will address those in another article.