Whether you design your web page using a visual web editor like Expression Web, Dreamweaver or BlueGriffon, or you code HTML directly with a simple text editor, the generally recommended practice is to validate it after you finish designing it.
This article discusses what validation means, points you to some of the free tools that you can use, and deals with its limitations and the problems that a new webmaster may face.
Note: 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 continuing. Otherwise you'll be completely lost here since I assume you at least know what these terms mean.
For those unfamiliar with the term, "validating" a page is just a jargon-filled way of referring to the use of a computer program to check that a web page 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 organisation ("organization" if you use a different variant of English) 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 (say) unexpected results.
The W3 Consortium has its own online validator which you can use for free. It may be found at: https://validator.w3.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).
Again, you can get free validation for your style sheets from the W3 Consortium: https://jigsaw.w3.org/css-validator/
There are numerous other validators around, both free and commercial, focusing on different aspects of your web page. You can find a list of free ones (including specialised 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
There are a number of reasons why you should validate your page.
Although you may be able to create a web page that appears to work on your favourite browser (whatever that may be), 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.
Coding your pages so that it is correct without errors will result in pages that are more likely to work across browsers and platforms (ie, 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.
When there are errors in a web page, browsers typically try to compensate in different ways. Some may ignore the broken elements while others make assumptions about what the web designer was trying to achieve. 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 those errors, resulting in certain parts of your web page (or perhaps even the entire page) not being indexed.
The safest 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.
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 hopefully make it clear. Let's take this sentence "Chris 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 what happens if you write a sentence that says "Chris ate a pie" when you meant that he ate a sandwich? Syntactically, the sentence is correct, since all the elements of the sentence, subject ("Chris"), verb ("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 (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 it's possible that you are using features of HTML and CSS that are only implemented in some browsers but not others.
If you have designed your site using a visual web editor, 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.
If you are using an editor like Microsoft Expression Web, Dreamweaver, BlueGriffon or KompoZer, you can usually assume that the code they produce on their own is valid. From my limited experience (mainly creating demo sites for the purpose of writing tutorials or reviews for thesitewizard.com), these four editors seem to create correct HTML and CSS code.
This means that 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 (such as if you have added a Youtube video to your page), it's possible that the code is the source of the error message.
Alternatively, if you have modified the code on the page manually, the error may have crept in there.
Having said that, sometimes the error is benign. For example, if you have 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.
Another way is to search the Internet for the solution. For example, 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 that talk about this particular error. This may not be as fantastic an idea as it first appears, since their solution may be too general to be helpful for your specific problem, unless the error message is the result of your pasting code from some popular source (like Youtube or something of that level of popularity).
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.
Finally, you can also ignore the problem. If you want to do this, you should test your web page in as many web browsers you can to make sure the error message does not diagnose a problem that causes visible issues. If you find that your site seems to work fine in spite of the error, you may decide to just ignore it and hope for the best.
Although this solution is not ideal, you may be forced to take it if you can't find an alternative. It's not ideal because the error may bite you later when you least expect it, for example, when there's a new version of some web browser that chokes on the bad code. It may also cause problems in a non-visible manner, such as in the way the search engines index your page.
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.
I always validate the template for my pages when I make a major design change. I try to validate my pages each time I make modifications, although I must admit that I sometimes forget to do so (with the occasional disastrous consequence; Murphy's Law doesn't spare webmasters).
I find that having an offline validator helps to make sure that I remember to validate: having to go online just to validate my pages tends to make me put off validation till later, with the result that it'll occasionally get overlooked. For those not familiar with the terminology I use, when I say "offline validator" I simply mean a validator that I can download and install in my own computer so that I can run it on my pages without having to go to the W3 Consortium's website. You can find offline validators on the free validators page I mentioned earlier.
The HTML Tidy validator (listed on that page) is available for numerous platforms (including Linux, Mac, Windows, etc) and has proven helpful to many webmasters the world over.
As I mentioned above, 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 are not familiar with HTML and CSS, there are still some ways you can deal with the errors that you discover from validating your page.
This article can be found at https://www.thesitewizard.com/webdesign/htmlvalidation.shtml
Copyright 2003-2018 by Christopher Heng. All rights reserved.
Get more free tips and articles like this,
on web design, promotion, revenue and scripting, from https://www.thesitewizard.com/.
Do you find this article useful? You can learn of new articles and scripts that are published on thesitewizard.com by subscribing to the RSS feed. Simply point your RSS feed reader or a browser that supports RSS feeds at https://www.thesitewizard.com/thesitewizard.xml. You can read more about how to subscribe to RSS site feeds from my RSS FAQ.
This article is copyrighted. Please do not reproduce or distribute this article in whole or part, in any form.
It will appear on your page as:
What is HTML and CSS Validation? Should You Validate Your Web Page?
