Home Page Check Accessibility, HTML, CSS, Broken Links & Spelling

Documentation > Ignoring issues

Parsing issues

There are certain types of issue that you will not be able to ignore using any mechanism we provide. These are a subset of the Parsing issues, and may include certain CSS parsing issues as well.

Although we try to keep the number of such issues to a minimum, many are impossible to ignore because, by definition, a parsing issue means that Total Validator cannot properly understand the HTML/CSS that is being used and so cannot deal with it properly. But this also applies to any browser, and so it is essential that you correct such parsing issues before publishing your pages, including those parsing issues which can be ignored using Total Validator.

Precedence

There are many ways of preventing issues from being reported using the Issues options. These range from the broad Ignore types options, to the more specific Ignore by and Ignore CSS by options.

These options are applied in order of precedence starting from the top to the bottom. So the Ignore types options are applied first, excluding the Except these issues. If an issue passes this test, then the Ignore these list is checked, and if required the Ignore by and Ignore CSS by options are used. Only if an issue passes all of these it is reported on.

However, if you can modify the pages, then even finer control is provided by adding special markup instructions to your pages. These allow you to ignore specific issues, or even entire types of test on specific pages, or specific parts of those pages, as described below.

HTML markup

Ignoring specific issues

If you wish to ignore specific issues from being reported on specific parts of a web page you can add a class attribute to an existing tag as follows:

<img class="-tv-ignore:E860,E800" src="img.gif" />

The class attribute's value must consist of the key word -tv-ignore: followed by a comma-separated list of the issues to ignore. The listed issues will not be reported on this element and any descendant elements. Note that depending on the HTML standard you are testing against, there may be restrictions on which elements you can use the class attribute with.

If you are already using a class attribute then simply add the -tv-ignore: class to the existing one:

<img class="myClass -tv-ignore:E860" src="img.gif" />

Alternatively, you could wrap the existing mark-up with a <div> or <span> instead:

<div class="-tv-ignore:E860"> <img class="myClass" src="img.gif" /> </div>

You can also nest the issues to ignore. In the following example issue, E860 will not be reported for any of the mark-up between (and including) the <div> tags, E800 will not be reported for the first set of <p> and <img> tags, but could be reported for the second set.

<div class="-tv-ignore:E860">
  <p class="-tv-ignore:E800">
    <img src="img.gif" />
  </p>
  <p>
    <img src="img.gif" />
  </p>
</div>

You can use this system to ignore whole sections of a page, or the whole page, (with HTML5 you can add a class attribute to the <html> tag). Or you could prevent single words or phrases from being spell checked as follows:

<p>Mary had a <span class="-tv-ignore:E31">lickle</span> lamb, its fleece
was <span class="-tv-ignore:E31">wite</span> as snow.<p>

If the issue you specify does not apply to your mark-up, there is no harm, it will simply be ignored. In the examples above you may have noticed that E860 and E800 are mutually exclusive as they apply to WCAG 1 and WCAG 2 respectively.

Note that when you specify an issue to ignore, the test is still performed, the issue is just not reported. This also occurs when using the Ignore these option. So, if you wished to ignore a E404 error on a broken link, an attempt would still be made to test the link first, slowing down the testing:

<a class="-tv-ignore:E404" href="a_bad_page.html">

It would be better not to test the link at all, and you can do this as described in the next section.

Ignoring all issues for a specific type of test

Depending on your requirements, it may be more efficient to prevent an entire type of testing being carried out on a section of mark-up. For this purpose, there are five special class attribute values you can use:

-tv-ignore-html
-tv-ignore-access
-tv-ignore-links
-tv-ignore-spellcheck
-tv-ignore-css

For example, the following prevents accessibility testing on the enclosed mark-up (including the <div> tags):

<div class="-tv-ignore-access">
  <p>
    <img src="img.gif" />
  </p>
</div>

Because the class attribute is a list of class names, you can specify more than one of these special values at a time and mix them with issue specific values:

<div class="myClass -tv-ignore-links -tv-ignore:E860,E800 -tv-ignore-access">
  <img src="img.gif" />
  <a href="a_bad_page.html">
</div>

Note that the special values such as -tv-ignore-access, take precedence over any individual issue exclusions like E860.

As mentioned in the previous section, using -tv-ignore-links will prevent any of the enclosed links from being tested. Also, if a link appears in more than one place, you must put the ignore request at the first place Total Validator will find the link, or on all instances of the link, otherwise Total Validator will test the first one it finds.

Ignoring the markup

With each new release of Total Validator tests are updated and bugs fixed, so the markup may become outdated. Also, it may not be clear whether the markup is really working or not. So there are occasions where you may wish to ignore the -tv- markup you've added to pages. For this you can use the Ignore -tv- markup option to ignore all the markup on the page, including any CSS markup described in the next section.

CSS

As described above you can use the class attribute to ignore CSS issues with any CSS used in style attributes or <style> tags. Alternatively, there is a system specifically for use with CSS in style sheets, which can also be used within <style> tags, as described below:

Using at-rules to ignore issues in CSS

If you wish to ignore specific issues from being reported on a specific part of your style sheet you can add special at-rules as follows:

@-tv-ignore start E777,W776;

h1 { -moz-color: firefox; }
h2 { -moz-color: thunderbird; }

@-tv-ignore end E777,W776;

In this case the issues E777 and W776 will not be reported for any of the statements that are enclosed by the start and end rules. As with HTML you can also ignore all CSS or Links issues, as well as specific ones. The general form of the at-rule is as follows:

@-tv-ignore [ start | end ] [[ all-css | all-links ] || [ Exxx [,Exxx]* ]];

This is completely safe to add to your style sheet because all user agents, such as browsers, will completely ignore any rules they do not recognise.

You can use these rules as many times as you wish, you can nest them, and start/end the exclusion of individual issues:

@-tv-ignore start all-css W776;

h1 { -moz-color: firefox; }

@-tv-ignore end all-css;

h2 { -moz-color: firefox; }

@-tv-ignore end W776;

In the example above, the h1 declaration will not report any issues because start all-css prevents any CSS testing. The end all-css at-rule allows CSS testing again, but the W776 restriction is still in force, and so the h2 declaration does not reports a W776 issue.

The start at-rules apply until there is a corresponding end rule, so if you forget to specify the end rule then the rule will apply to the end of the style sheet. If you use them within style elements, they will also apply across different style elements. But the rules are never inherited by any imported style sheets, and if you try to end something you have not started, it will be silently ignored.

Using a property to ignore issues in CSS

In addition to using an at-rule to ignore issues as described above, there is a corresponding property that you can use:

h1 {
  color: red;
  -tv-ignore: start E777,W776;
  -moz-color: firefox;
  -tv-ignore: end W776;
  -moz-color: firefox;
  -tv-ignore: end E777;
}
h2 { -moz-color: firefox; }

Just as with the at-rule exclusions defined using this property apply from the start to the end. They are not restricted to the block in which they are defined, but apply to all statements between the start and end.

The general form of this property is almost identical to the at-rule and operates in the same way:

-tv-ignore [ start | end ] [[ all-css | all-links ] || [ Exxx [,Exxx]* ]];

You can mix the property with the at-rule if you wish. Here is a complex example of this:

1  @-tv-ignore start E777,W776;
2  h1 {
3    -moz-color: firefox;
4    -tv-ignore: end E777;
5    -moz-color: firefox;
6    -tv-ignore: end W776;
7    -tv-ignore: start E725;
8  }
9  @import "test.css";
10 h2 { -moz-color:fred; }

No issues are reported for the -moz-color property on line 3, due to the at-rule on line 1. Only W776 is reported for the -moz-color on line 5 because of the end property on line 4. The end properties on lines 4 and 6, mean that both E777 and W776 are reported on line 10. Finally, the property on line 7 prevents E725 on line 9.