Validate Your Web Page or Not? What is HTML and CSS Validation?

If you design your web page using a visual web editor like KompZer or Dreamweaver, or code HTML directly with a simple text editor, the industry standard is to validate it after you finish designing it.

In this reading, we will discuss what validation means, point you to some of the free tools that you can use, and examines its limitations and the obstacles that a new webmaster may face.

If you are not sure what HTML and CSS mean, please read What are HTML, CSS, JavaScript, PHP and Perl? Do I need to Learn Them to Create a Website? before you continue to read. Otherwise you’ll be completely lost here since I assume you at least know what these terms mean.

What does Validating HTML or CSS Mean?

For those who are not familiar with the term; “validating” a page is just jargon-filled way of referring to the use of a computer program to check that a webpage is free of errors.

In particular, an HTML validator checks to make sure the HTML code on your web page complies with the standards set by the W3 Consortium, the organization that issues the HTML standards. There are various types of HTML validators: some only check for errors, while others also make suggestions about your code, telling you when it might lead to, unexpected results.

The W3 Consortium has its own online validator which you can use for free. It may be found at: https://validator.23.org/

A CSS validator checks your Cascading Style Sheet in the same manner. That is, it will check that it complies with the CSS standards set by the W3 Consortium. There are a few which will also tell you which CSS features are supported by which browsers (since not all browsers are equal in their CSS implementation).

You can get free validation for your style sheets from the W3 Consortium: https://jigsaw.w3.org/css-validator/

There are many other validator around, free and commercial, focusing on different aspects of your web page. You can find a list of free ones (including specialized validators like those that check your code for accessibility) from the Free HTML Validators, CSS Validators, Accessibility Validators page at https://www.thefreecountry.com/webmaster/htmlvalidators.shtml.

Why Validate Your HTML and CSS Code?

There are a number of reasons why you should validate your page.

1. It Helps Cross-Browser, Cross-Platform and Future Compatibility

Although you may be able to create a web page that appears to work on your favorite browser (whatever that is), your page may contain HTML or CSS errors that do not show up with that browser due to an existing quirk or bug. Another person using a different browser that does not share that particular bug will end up viewing a page that does not show up correctly. It is also possible that later versions of your browser will fix that bug, and your page will be broken when people use its latest incarnation.

For Example: You can have a beautiful web page, that is aesthetically pleasing, An analogy is a new Mercedes Benz Cl65 AMG Coupe; beautiful car, in anyone’s view. But what if you pull up the hood of that Mercedes and find the engine of a 1950 Ford Pick-up truck? This is the perfect analogy for a nice looking website, but it’s coding doesn’t work well in all browsers or devices.

Coding your pages so that it is correct without errors will result in pages that are more likely to work across browsers and platforms (for example, different systems.) It is also a form of insurance against future versions of browsers, since all browsers aim towards compliance with the existing HTML and CSS standards.

2. Search Engine Visibility

Browsers typically try to compensate when there are errors in a web page in different ways. Many ignore the broken elements while others make assumptions about what the web designer was trying to do. The problem is that when search engines obtain your page and try to parse them for keywords, they will also have to make certain decisions about what to do with the errors. Like browsers, different search engines will probably make different decisions about thos errors, resulting in certain parts of your web page (or perhaps even the entire page) not being indexed.

The best way to make sure the search engines see the page you want them to see is to present them an error free page. That way, there is no dispute about which part of your page comprises the content and which the formatting code.

Limitations: What Validation Does Not Do

Validating your web page does not ensure that it will appear the way you want it to. It merely ensures that your code is without HTML or CSS errors.

If you are wondering what the difference is, an analogy from normal human language will probably make it clear. If you look at this sentence, “Sarah a sandwich ate” which is grammatically incorrect when used in a non-poetic context. It can be fixed by simply reversing the order of the last two words so that the sentence reads “Chris ate a sandwich.”

But lets see what happens if you write that same sentence and it says “Chris at a pie” which you means that he a sandwich? Syntactically, the sentence is correct, since all the elements of the sentence, subject, “Chris”, ver “ate” and object “a pie” are in the right order. Semantically, however, the sentence describes a different thing from what you meant.

HTML and CSS validators are designed to catch the first type of error, exemplified by the grammatical error of my first sentence. So if you write HTML code that has, let’s say, the wrong order, the HTML validator will spot it and tell you. However; it cannot catch errors of the second kind, where you get the spelling and order and all other technical aspects correct, but the code you used does not match the meaning you intended.

Ensuring that your code does what you want it to do requires you to actually test it in a web browser. Depending on the complexity of your code, you may even want to test it with different browsers to make sure that your site looks the same in all of them, since its possible that you are using features of HTML and CSS that are only implemented in some browsers but not others.

What to Do If You Don’t Know HTML and CSS

If you used a visual web editor to design your site and are not familiar with HTML and CSS, you will face an additional problem.

While running the validator and getting it to validate your page itself will not be an issue, since the W3 Consortium’s validator is not only free, it doesn’t even have to be installed to be used), the problem comes when the validator checks your page and tells you that there are errors.

If you have no knowledge of HTML and CSS, you will probably have some difficulty figuring out what those errors mean, whether they are serious, and how to fix them.

Although there is no perfect solution to this, you are not completely without resources.

1. If you are using an editor like Dreamweaver, Microsoft’s Expression Web, KompoZer or BlueGriffon, you can usually assume that the code they produce on their own is valid. From my experience, these four editors seem to create correct HTML and CSS code.

This means if you get errors when you validate your page, the problems must come from elsewhere. If you have inserted code that you obtained from a website (like if you added a Youtube video to your page), it’s possible that the code is the source of the error message.

Conversely, if you have modified the code on the page manually, the error may have crept in there.

Because of that, basically, sometimes the error is benign. Let’s use this example, if you added XHTML code to a page that has HTML, you may or may not get validation errors since you are mixing 2 different HTML families that have slightly different conventions. As far as I can tell, for the most part, this kind of error does not cause any problem for either browsers or search engines.

2. Another way is to search the Internet for the solution. You can copy and paste the error message given by the validator into a search engine and see if there are any websites out there are talk about this particular error. This may not be as good an idea as it if seems at first, since their solution may be too general to be helpful for your specific problem. Except if the error message is the result of your pasting code from some popular source (like Youtube or something of that level of popularity).

3. A third way is of course to ask someone, whether it’s someone you know personally, or someone on the Internet. This solution also has its own issues, since you may get a solution that creates a bigger mess of your page than it had in the first place. It all boils down to their competence and willingness to spend enough time figuring out the problem.

4. Finally, you can ignore the problem. If you want to do this, you should test your web page in as many web browsers as you can to make sure the error message does not diagnose a problem that causes visible issue.s If you find that your site seems to work fine in spite of the error, you may decided to just ignore it and hope for the best.

While this solution may not be ideal, you may be forced to take it if you can’t find another way. It’s not ideal because the error may bite you later when you least expect if. Like when there’s a new version of some web browser that chokes on the bad code. It may also caus problems in a non-visible manner, such as in the way the search engines index your page.

How Often Should I Validate?

Some people validate every time they make a modification to their pages on the grounds that careless mistakes can occur any time. Others validate only when they make a major design change.

It’s good to validate the template for pages when you make a major design change. Try to validate your pages each time you make modifications. Admittedly, sometimes you may forget to do so with the occasional disastrous consequences: Murphy’s Law doesn’t spare webmasters.

Having an offline validator helps to make sure that you remember to validate: having to go online just to validate your pages tends to make people put off validation until later, ending up that oftentimes they simply forget. For those who are not familliar with the terminology “offline validator”, it simply means a validator that can be dowloaded and installed on your computer so that you can run it on your pages without having to go to the W3 Consortium’s website. You can find offline validators on the free validator page mentioned earlier. https://www.thefreecountry.com/webmaster/htmlvalidators.shtml

The HTML Tidy validator (listed on that page) is available for numerous platforms (including Linux, Mac, Windows) and has proven itself to webmasters worldwide.

Conclusion

It’s generally a good idea to validate your web page. It will point you to errors that may affect how your website is understood by web browsers and search engines. Even if you ae not familiar with HTML and CSS, there are still some ways you can deal with the errors that you discover from validating your page.

Our clients, allsportdesigns.com and sailradios.com have just had their templates completely recoded by MakDigitalDesign.com. Recoding their templates made them a lot more competitive and viable. Their websites were designed with the very poor standards. They are smart entrepreneurs and realized they must evolve with technology to stay ahead in the ever-changing world of both business and technology.

Do you due diligence when it comes to your website. In today’s marketplace, most sales are made using computers, tablets and cellphones. Your website should be able to adapt and evolve also. And of course, VALIDATE, where your site is parked!