Why is CSS HTML Validator Better?

CSS HTML Validator Box

Below you will find a table and HTML examples that show CSS HTML Validator finding problems and issues that other syntax checkers and validators (such as the popular W3C HTML Validator) cannot find.

Also, don't forget that CSS HTML Validator protects your privacy because your documents are not uploaded to the web in order to check them.

Number of Problems Found in the Test Document
Validator/CheckerValidation Results
happy CSS HTML ValidatorGenerates 10 errors, 14 warnings*
unhappy W3C HTML ValidatorFinds NO problems, approves the test document as valid HTML,
and calls it "interoperable" (last tested 2017-12-26)

* The exact number of errors and warnings generated depend on the current settings of CSS HTML Validator. CSS HTML Validator has many features that allow a developer to customize the results based on his or her needs. Test Document

Validate the test document using the W3C HTML Validator and see how many problems it misses.

Even with all these issues, the W3C validator says that you may want to place an icon on your page to show your readers that you've taken the care to create an "interoperable" web page. We don't consider a page with so many problems "interoperable", and neither should you.

Why Do Other Validators Miss These Issues?

A DTD validator like the W3C validator and other validators claiming to be based on real SGML parsers, are technically incapable of finding certain problems because they are limited in the number of problems that they can check for. These validators are only concerned about strict adherence to what can only be described in the specification's DTD. Furthermore, DTD based validators consider many practical features supported by popular browsers to be invalid. They also consider bad attribute values that don't work in popular browsers to actually be valid (like width="really wide" for the "img" element). These methods of checking for problems do not reflect upon real-life situations.

Also, HTML5, the latest HTML standard, does not use DTD based validation at all. It takes a more practical approach like CSS HTML Validator has always done.

CSS HTML Validator is a "Real-Life" Validator

CSS HTML Validator is designed to be a "real-life" validator. As such, it is not limited to adhering to strict HTML specifications. Instead of generating errors for issues that are fine in the real-world, CSS HTML Validator understands them. Instead of not generating errors for bad attribute values, it reports them. CSS HTML Validator can find many more problems or potential problems than other syntax checkers and validators can find.

If you do wish to adhere to the standards as closely and strictly as possible, then CSS HTML Validator will help you do that as well, with its "standards compliant check" (choose 'Validate > Standards compliant check'). Also, CSS HTML Validator Standard (and above) include a DTD based validator for when you'd like to use one (choose 'Validate > Nsgmls message only').

In addition to all of the above, CSS HTML Validator also checks CSS, links, and spelling. It also checks for accessibility issues. If you're concerned about search engine rankings (and you probably are), then you'll be glad to know that CSS HTML Validator also generates messages that may help you increase your search engine rankings.

Examples

Below are examples of why CSS HTML Validator is a better way to check your web documents.

<title>Untitled</title>

In the above example, CSS HTML Validator generates a message about an inappropriate document title. All HTML documents should have titles and "Untitled" is not a good title. CSS HTML Validator also generates messages for missing titles. The W3C validator and many other validators and syntax checkers accept this bad title because it is technically valid. They also accept a blank or missing title.

p.notusedclass { color: red; }

In the above inline CSS example, CSS HTML Validator sees the CSS class name notusedclass, detects that this CSS class name was not actually used and generates a warning message. Warning messages for unused inline type selectors and IDs are also generated if CSS HTML Validator doesn't detect that they were used. These warnings will help you remove unused, forgotten, and/or obsolete inline CSS from your HTML/XHTML documents. (New 2018/v18)

Missing meta description tag used by some search engines

CSS HTML Validator generates a message about missing meta description tags and other useful meta tags. The meta description tag is used to briefly describe the web page and is often an important tag to have when you want your site listed on search engines. The W3C validator does not alert you to missing meta tags. If for some reason you don't want to be alerted to these missing tags, then you can easily disable these messages.

<style type="text/csss">...</style>

In the above example, CSS HTML Validator detects the incorrect (misspelled) type "text/csss". The W3C validator and others don't find this problem.

<body bgcolor="fffff">

In the above example, CSS HTML Validator detects the invalid color "fffff". Not only is the '#' character missing, but there are only 5 digits. The W3C validator and others don't find either of these problems.

<p style="color: greeen">...</p>

In the above example, CSS HTML Validator detects the invalid color "greeen". This is because CSS HTML Validator also checks CSS! The W3C HTML Validator and others don't. If you want your CSS checked using the W3C tools, then you'll also have to run your document through the W3C CSS Validator. With CSS HTML Validator, you just need to perform one action to check both HTML and CSS, saving you time and effort (by the way, link checking is automatic too!).

<p style="font-family: ariel, sans-serif"></p>

In the above example, CSS HTML Validator detects the misspelled font-family name "ariel" which should be "arial". This is because CSS HTML Validator also checks font-family names. The W3C HTML Validator and others don't.

<p onclick="function('string value);">test</p>

In the above example, there's a missing close quote for "string value". CSS HTML Validator attempts to detect mismatched and missing quotes, parenthesis, and brackets in JavaScript event attribute values (like the value for onclick), and generates appropriate error messages. The W3C HTML Validator and others don't check for this.

img src="somepic.jpg" alt="description">

In the above example, CSS HTML Validator generates a message about the '>' character which brings the problem of the missing '<' character to attention. The W3C validator lets this pass too.

<img src="somepic.jpg" alt="description" width="50text">

In the above example, CSS HTML Validator generates an error for the width value because of "text" in the value. The W3C validator and other validators accept this as valid HTML!

<a href= "http://domain.com/images\image.jpg"> ... </a>

In the above example, CSS HTML Validator detects the problem of backslash in the href value where a forward slash should be instead. Because Windows platforms use the backslash character instead of the forward slash, this type of error can easily occur if one is not careful. The W3C validator and others miss this.

<a href="htp://www.domain.com/">...</a>

In the above example, CSS HTML Validator detects the problem of a mistyped "http". The W3C validator and others miss this one.

<a href="user@domain.com" >user@domain.com</a>

In the above example, CSS HTML Validator finds the missing "mailto:" in the href value.

<a href="mailto:user@domain.comm" >user@domain.com</a>

In the above example, CSS HTML Validator detects the problem of a mistyped email address. Note that the software cannot find all incorrectly typed email addresses but it does perform several syntax checks on email addresses.

<p>He said &quot;I'll be there!&quot</p>

One of the above character references (the last one) does not have a terminating semicolon, which may cause problems. Our validator reports this, but the W3C validator doesn't mention it at all.

<a href="#chapter5">...</a>

In the above example, CSS HTML Validator detects (if missing) the missing anchor/internal link "chapter5". The W3C validator and others miss this one too.

<a href="http://www.domain.com/" target="_new">...</a>

In the above example, CSS HTML Validator detects the invalid target "_new" and recommends the valid target "_blank". Again, other validators and syntax checkers miss this one too.

<a href="http://www.domain.com/ ">...</a>

In the above example, CSS HTML Validator detects the trailing space in the value for the "href" attribute. This is a potential cause of browser problems. Again, other validators and syntax checkers don't say anything about this issue. Leading spaces are also detected and reported.

<a name="atagid" id="atagid2">...</a>

In the above example, CSS HTML Validator detects that the attribute values for the "name" and "id" attributes are not equivalent when they must be for correct HTML. Again, other validators and syntax checkers miss this one too, including the W3C validator.

<table><tr><td>...</table>

Because CSS HTML Validator wants your HTML to render as quickly and reliably as possible, it enforces better style by letting you know when "td" and "tr" tags are not closed. Even though omitting these end tags is technically allowable in HTML 4.01, it is not recommended because it may cause rendering problems in some browsers (and it can also reduce source readability and increase sloppiness). Other validators like the W3C HTML Validator don't care about the missing end tags. They don't consider or care how your HTML might render in a real browser, but your users do!

<!-- Comment -- >

CSS HTML Validator finds the space in the "-- >" part of the comment and reports that this could cause browser parsing problems. But because this is technically valid, the W3C validator doesn't detect this potential problem. CSS HTML Validator makes you aware of "little" things like this that can cause problems in real-world browsers.

<label for="inputField" accesskey="E" />

The above piece of XHTML 1.0 was taken from an older version of the W3C home page. According to the W3C's own XHTML Recommendation (4.3) (new window), all elements other than those declared in the HTML 4 DTD as EMPTY must have an end tag (this is for backward compatibility). That means that "label" must have an end tag but it doesn't. Instead, the empty element shorthand is used. The W3C's own validator doesn't catch this but CSS HTML Validator does and generates an error message.

And More...

This is just a small sample of the many problems that CSS HTML Validator Standard (and above) can find in HTML documents. Download a free trial version to see for yourself how CSS HTML Validator can help you create better web documents.