accesskeys

Markup:

        <a href="https://www.w3schools.com/html5" accesskey="h">HTML5</a>
<br>
<a href="https://www.w3schools.com/css3" accesskey="h">CSS3</a>
    

Description:

Ensures every accesskey attribute value is unique

Help:

accesskey attribute value must be unique

area-alt

Markup:

        <map name="primary">
    <area shape="circle" coords="75,75,75" href="left.html">
    <area shape="circle" coords="275,75,75" href="right.html">
</map>
    

Description:

Ensures <area> elements of image maps have alternate text

Help:

Active <area> elements must have alternate text

aria-allowed-attr

alert role
link role

Markup:

        <div role="alert" aria-activedescendant="selected_option">alert role</div>
<div role="link" aria-selected="true">link role</div>
    

Description:

Ensures ARIA attributes are allowed for an element's role

Help:

Elements must only use allowed ARIA attributes

aria-allowed-role

Markup:

        <button role="blablabla"></button>
    

Description:

Ensures role attribute has an appropriate value for the element

Help:

ARIA role must be appropriate for the element

aria-dpub-role-fallback

Markup:

        <button role="doc-backlink"></button>
    

Description:

Ensures unsupported DPUB roles are only used on elements with implicit fallback roles

Help:

Unsupported DPUB ARIA roles should be used on elements with implicit fallback roles

aria-hidden-body

NOT IMPLEMENTED

Markup:

        <span style="color: #800000;">NOT IMPLEMENTED</span>
    

Description:

Ensures aria-hidden='true' is not present on the document body.

Help:

aria-hidden='true' must not be present on the document body

aria-required-attr

There is no required 'aria-checked' attribute for element with checkbox role

Markup:

        <div role="checkbox">There is no required 'aria-checked' attribute for element with checkbox role</div>
    

Description:

Ensures elements with ARIA roles have all required ARIA attributes

Help:

Required ARIA attributes must be provided

aria-required-children

Element with list role attribute should contain element with listitem role

Markup:

        <div role="list">Element with list role attribute should contain element with listitem role</div>
    

Description:

Ensures elements with an ARIA role that require child roles contain them

Help:

Certain ARIA roles must contain particular children

aria-required-parent

Elements with role listitem should be contained in, or owned by, an element with the role list or group.

Markup:

        <div role="listitem">Elements with role listitem should be contained in, or owned by, an element with the role list or group.</div>
    

Description:

Ensures elements with an ARIA role that require parent roles are contained by them

Help:

Certain ARIA roles must be contained by particular parents

aria-roles

composite is abstract role used for the ontology. This role shouldn't be used in content

Markup:

        <div role="composite">composite is abstract role used for the ontology. This role shouldn't be used in content</div>
    

Description:

Ensures all elements with a role attribute use a valid value

Help:

ARIA roles used must conform to valid values

aria-valid-attr-value

aria-hidden attribute value should be only true, false or undefined

Markup:

        <div aria-hidden="rtue">aria-hidden attribute value should be only true, false or undefined</div>
    

Description:

Ensures all ARIA attributes have valid values

Help:

ARIA attributes must conform to valid values

aria-valid-attr

aria-my-property is not valid aria property

Markup:

        <div aria-my-property="true">aria-my-property is not valid aria property</div>
    

Description:

Ensures attributes that begin with aria- are valid ARIA attributes

Help:

ARIA attributes must conform to valid names

audio-caption

Markup:

        <audio controls="" src="https://mdn.github.io/learning-area/html/multimedia-and-embedding/video-and-audio-content/viper.mp3">
    <track kind>
</audio>
    

Description:

Ensures <audio> elements have captions

Help:

<audio> elements must have a captions track

autofill

Markup:

        <input type="hidden" autocomplete="on">
<input type="password" autocomplete="name">
<input type="url" autocomplete="new-password">
<input autocomplete="street-address">
<input type="date" autocomplete="cc-exp">
<input type="tel" autocomplete="cc-exp-month">
<input type="password" autocomplete="bday">
<input type="email" autocomplete="url">
<input type="url" autocomplete="tel">
<input type="number" autocomplete="email">
<input type="search">
<input type="password">
<input type="url">
<input type="email">
<input type="tel">
<textarea autocomplete="blablabla">Textarea</textarea>
    

Description:

Ensures autofill attribute is validated

Help:

Every autofill attribute is fitted appropriate value

blink

Why would somebody use this?

Markup:

        <blink>Why would somebody use this?</blink>
    

Description:

Ensures <blink> elements are not used

Help:

<blink> elements are deprecated and must not be used

button-name

Markup:

        <button></button>
<span role="button"></span>
<input type="button">
<input type="submit">
<input type="reset">
    

Description:

Ensures buttons have discernible text

Help:

Buttons must have discernible text

bypass

NOT IMPLEMENTED

Markup:

        <span style="color: #800000;">NOT IMPLEMENTED</span>
<a href="blablabla"></a>
    

Description:

Ensures each page has at least one mechanism for a user to bypass navigation and jump straight to the content

Help:

Page must have means to bypass repeated blocks

checkboxgroup

Cats
Dogs
Birds

Markup:

        <div>
    <input type="checkbox" name="animal" value="Cat" />Cats
    <br />
    <input type="checkbox" name="animal" value="Dog" />Dogs
    <br />
    <input type="checkbox" name="animal" value="Bird" />Birds
    <br />
    <input type="submit" value="Submit now" />
</div>
    

Description:

Ensures related <input type="checkbox"> elements have a group and that that group designation is consistent

Help:

Checkbox inputs with the same name attribute value must be part of a group

color-contrast

Text with low contrast

Markup:

        <div style="height: 100px; background: aliceblue; color: #eaf2f9;">
    <h2>Text with low contrast</h2>
</div>
    

Description:

Ensures the contrast between foreground and background colors meets WCAG 2 AA contrast ratio thresholds

Help:

Elements must have sufficient color contrast

definition-list

Firefox
Mozilla Firefox
A free, open source, cross-platform, graphical web browser developed by the Mozilla Corporation and hundreds of volunteers.
Non valid <span> tag inside <dl> tag
Non valid: <dt> tag should precede <dd> tag
Firefox

Markup:

        <dl>
    <dt>Firefox</dt>
    <dt>Mozilla Firefox</dt>
    <dd>
        A free, open source, cross-platform, graphical web browser developed by the Mozilla Corporation and hundreds of volunteers.
    </dd>
    <span>Non valid &lt;span&gt; tag inside &lt;dl&gt; tag</span>
</dl>

<dl>
    <dd>
        Non valid: &lt;dt&gt; tag should precede &lt;dd&gt; tag
    </dd>
    <dt>Firefox</dt>
</dl>
    

Description:

Ensures <dl> elements are structured correctly

Help:

<dl> elements must only directly contain properly-ordered <dt> and <dd> groups, <script> or <template> elements

dlitem

Markup:

        <dt></dt>
<dd></dd>
<dd></dd>
    

Description:

Ensures <dt> and <dd> elements are contained by a <dl>

Help:

<dt> and <dd> elements must be contained by a <dl>

document-title

Empty <title> tag.

Markup:

        Empty &lt;title&gt; tag.
    

Description:

Ensures each HTML document contains a non-empty <title> element

Help:

Documents must have <title> element to aid in navigation

duplicate-id

Duplicate id item Duplicate id item 2

Markup:

        <span id="duplicate-id">Duplicate id item</span>
<span id="duplicate-id">Duplicate id item 2</span>
    

Description:

Ensures every id attribute value is unique

Help:

id attribute value must be unique

empty-heading

Markup:

        <h2></h2>
    

Description:

Ensures headings have discernible text

Help:

Headings must not be empty

frame-title-unique

Markup:

        <iframe title="non-unique-title" src="http://example.com"></iframe>
<iframe title="non-unique-title" src="http://example.com"></iframe>
    

Description:

Ensures <iframe> and <frame> elements contain a unique title attribute

Help:

Frames must have a unique title attribute

frame-title

Markup:

        <iframe src="http://example.com"></iframe>
    

Description:

Ensures <iframe> and <frame> elements contain a non-empty title attribute

Help:

Frames must have title attribute

heading-order

First heading level

Third heading level

Markup:

        <h1>First heading level</h1>
<h3>Third heading level</h3>
    

Description:

Ensures the order of headings is semantically correct

Help:

Heading levels should only increase by one

hidden-content

hidden content hidden content

Markup:

        <span style="display: 'none';">hidden content</span>
<span style="visibility: 'hidden';">hidden content</span>
    

Description:

Informs users about hidden content.

Help:

Hidden content on the page cannot be analyzed

href-no-hash

Markup:

        <a href="#">Link with href attribute equal to hash symbol ('#')</a>
    

Description:

Ensures that href values are valid link references to promote only using anchors as links

Help:

Anchors must only be used as links with valid URLs or URL fragments

html-has-lang

Empty lang attributes of <html> tag.

Markup:

        Empty lang attributes of &lt;html&gt; tag.
    

Description:

Ensures every HTML document has a lang attribute

Help:

<html> element must have a lang attribute

html-lang-valid

NOT IMPLEMENTED

Markup:

        <span style="color: #800000;">NOT IMPLEMENTED</span>
    

Description:

Ensures the lang attribute of the <html> element has a valid value

Help:

<html> element must have a valid value for the lang attribute

image-alt

Markup:

        <img src="http://placehold.it/350x150">
<div role="img" style="background-image: url(http://placehold.it/350x150); width: 350px; height: 150px"></div>
    

Description:

Ensures <img> elements have alternate text or a role of none or presentation

Help:

Images must have alternate text

image-redundant-alt

TEXT

Markup:

        <div id="imageRedundantAltAriaLabel">TEXT</div>

<button>
    <img alt="Button">
</button>

<button>
    <img alt="Button"> Button
</button>

<button>
    <input type="image" alt="Button">
</button>

<button>
    <input type="image" alt="Button"> Button
</button>

<button title="text">Text</button>

<a href="#" aria-label="text" title="Text"></a>

<button aria-labelledby="imageRedundantAltAriaLabel" title="Text"></button>

<label for="imageRedundantAltLabelViolations">text</label>
<a href="#" id="imageRedundantAltLabelViolations" title="Text"></a>

<label>
    text
    <button title="Text"></button>
</label>
    

Description:

Ensure button and link text is not repeated as image alternative

Help:

Text of buttons and links should not be repeated in the image alternative

input-image-alt

Markup:

        <input id="image" type="image" width="100" height="30" src="https://raw.githubusercontent.com/mdn/learning-area/master/html/forms/image-type-example/login.png">
    

Description:

Ensures <input type="image"> elements have alternate text

Help:

Image buttons must have alternate text

label-in-name

Accessible name
Anchor Anchor Anchor Anchor Anchor

Markup:

        <div id="labelInNameDiv">Accessible name</div>

<label for="labelInNameInput1">Visible Label</label>
<input id="labelInNameInput1" aria-labelledby="labelInNameDiv">

<label for="labelInNameInput2">Visible Label</label>
<input id="ariaLabelInput2" aria-label="accessibleName">

<label for="labelInNameInput3">Visible Label</label>
<input id="labelInNameInput3" type="button" title="accessibleName">

<label>Visible Label
    <input aria-labelledby="labelInNameDiv">
</label>

<label>Visible Label
    <input aria-label="accessibleName">
</label>

<label>Visible Label
    <input type="button" title="accessibleName">
</label>

<label for="labelInNameAnchor1">Visible Label</label>
<a id="labelInNameAnchor1" aria-labelledby="labelInNameDiv" href="#">Anchor</a>

<label for="labelInNameAnchor2">Visible Label</label>
<a id="labelInNameAnchor2" aria-label="accessibleName">Anchor</a>

<label for="labelInNameAnchor3">Visible Label</label>
<a id="labelInNameAnchor3">Anchor</a>

<label>Visible Label
    <a aria-labelledby="labelInNameDiv" href="#">Anchor</a>
</label>

<label>Visible Label
    <a aria-label="accessibleName">Anchor</a>
</label>

<label>Visible Label
    <a>Anchor</a>
</label>

<a aria-labelledby="labelInNameDiv" href="#">Anchor</a>

<a aria-label="accessibleName">Anchor</a>

    

Description:

For user interface components with labels that include text or images of text, the name contains the text that is presented visually.

Help:

Accessible name matches or starts with visible label

label-title-only

Title
anotherTitle
Don't have both attribute "title" and "aria-describedby" on HTMLInputElement

Markup:

        <form action="#">
    <div id="labelTitleOnlyLabel">Title</div>
    <div id="describedLabelTitleOnlyLabel">anotherTitle</div>

    <input title="title"
           aria-describedby="labelTitleOnlyLabel"
           aria-label="anotherTitle">Don't have both attribute "title" and "aria-describedby" on HTMLInputElement

    <input title="title"
           aria-describedby="labelTitleOnlyLabel"
           aria-label="Title">

    <textarea aria-labelledby="labelTitleOnlyLabel"
              aria-describedby="labelTitleOnlyLabel"></textarea>

    <input aria-describedby="labelTitleOnlyLabel"
           aria-label="Title">

    <label>title
        <select aria-describedby="labelTitleOnlyLabel"></select>
    </label>

    <textarea title="title"
              aria-labelledby="labelTitleOnlyLabel"></textarea>

    <input title="title"
           aria-label="Title">

    <label>title
        <input title="title">
    </label>
</form>
    

Description:

Ensures that every form element is not solely labeled using the title or aria-describedby attributes

Help:

Form elements should have a visible label

label



Markup:

        <form action="/action_page.php">
    <label for="male">Male</label>
    <input type="radio" name="gender" id="male" value="male">
    <br>
    <input type="radio" name="gender" id="female" value="female">
    <br>
    <label for="other">Other</label>
    <input type="radio" name="gender" id="other" value="other">
</form>
    

Description:

Ensures every form element has a label

Help:

Form elements must have labels

layout-table

Left block Right block
presentation table

Markup:

        <table role="presentation">
    <tr>
        <th>Left block</th>
        <th>Right block</th>
    </tr>
</table>

<table role="presentation">
    <caption>presentation table</caption>
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>

<table role="presentation" summary="presentation table">
    <tr>
        <td></td>
        <td></td>
    </tr>
</table>
    

Description:

Ensures presentational <table> elements do not use <th>, <caption> elements or the summary attribute

Help:

Layout tables must not use data table elements

link-in-text-block

Markup:

        <p>
    <span style="color: black">Text</span>
    <a style="text-decoration: none; color: black" href="#">Link with contract ratio to surrounding text below 3:1</a>
    <span style="color: black">Text</span>
</p>
    

Description:

Links can be distinguished without relying on color

Help:

Links must be distinguished from surrounding text in a way that does not rely on color

link-name

Markup:

        <a href="https://nekitozzz.github.io/staticTestPage/index.htm"></a>
    

Description:

Ensures links have discernible text

Help:

Links must have discernible text

list

  • List element
  • Not list element

Markup:

        <ul>
    <li>List element</li>
    <div>Not list element</div>
</ul>
    

Description:

Ensures that lists are structured correctly

Help:

<ul> and <ol> must only directly contain <li>, <script> or <template> elements

listitem

  • List item wrapped outside of <ul> or <ol> parent elements
  • Markup:

            <li>List item wrapped outside of &lt;ul&gt; or &lt;ol&gt; parent elements</li>
        

    Description:

    Ensures <li> elements are used semantically

    Help:

    <li> elements must be contained in a <ul> or <ol>

    marquee

    <marquee> elements shouldn't be used

    Markup:

            <marquee>&lt;marquee&gt; elements shouldn't be used</marquee>
        

    Description:

    Ensures <marquee> elements are not used

    Help:

    <marquee> elements are deprecated and must not be used

    meta-refresh

    NOT IMPLEMENTED (should be inside the <head> element)

    Markup:

            <span style="color: #800000;">NOT IMPLEMENTED (should be inside the &lt;head&gt; element)</span>
        

    Description:

    Ensures <meta http-equiv="refresh"> is not used

    Help:

    Timed refresh must not exist

    meta-viewport-large

    NOT IMPLEMENTED (should be inside the <head> element)

    Markup:

            <span style="color: #800000;">NOT IMPLEMENTED (should be inside the &lt;head&gt; element)</span>
        

    Description:

    Ensures <meta name="viewport"> can scale a significant amount

    Help:

    Users should be able to zoom and scale the text up to 500%

    meta-viewport

    NOT IMPLEMENTED (should be inside the <head> element)

    Markup:

            <span style="color: #800000;">NOT IMPLEMENTED (should be inside the &lt;head&gt; element)</span>
        

    Description:

    Ensures <meta name="viewport"> does not disable text scaling and zooming

    Help:

    Zooming and scaling must not be disabled

    non-text-contrast

    Anchor Anchor Anchor Anchor Input Input Input Input

    Markup:

            <a href="#" style="border: 1px solid red; outline: 1px solid #F2F0E6">Anchor</a>
    <a href="#" style="border: 1px solid #F2F0E6; outline: 1px solid #E0FFFF">Anchor</a>
    <a href="#" style="border: 1px solid #F2F0E6">Anchor</a>
    <a href="#" style="outline: 1px solid #E0FFFF">Anchor</a>
    
    <button style="border: 1px solid red; outline: 1px solid #F2F0E6">Button</button>
    <button style="border: 1px solid #F2F0E6; outline: 1px solid #E0FFFF">Button</button>
    <button style="border: 1px solid #F2F0E6">Button</button>
    <button style="outline: 1px solid #E0FFFF">Button</button>
    
    <input type="text" style="border: 1px solid red; outline: 1px solid #F2F0E6"> Input
    <input type="text" style="border: 1px solid #F2F0E6; outline: 1px solid #E0FFFF"> Input
    <input type="text" style="border: 1px solid #F2F0E6"> Input
    <input type="text" style="outline: 1px solid #E0FFFF"> Input
    
    <textarea style="border: 1px solid red; outline: 1px solid #F2F0E6">TEXTAREA</textarea>
    <textarea style="border: 1px solid #F2F0E6; outline: 1px solid #E0FFFF">TEXTAREA</textarea>
    <textarea style="border: 1px solid #F2F0E6">TEXTAREA</textarea>
    <textarea style="outline: 1px solid #E0FFFF">TEXTAREA</textarea>
    
    <select style="border: 1px solid red; outline: 1px solid #F2F0E6"><option>option</option></select>
    <select style="border: 1px solid #F2F0E6; outline: 1px solid #E0FFFF"><option>option</option></select>
    <select style="border: 1px solid #F2F0E6"><option>option</option></select>
    <select style="outline: 1px solid #E0FFFF"><option>option</option></select>
    
        

    Description:

    A visual presentation must have a contrast ratio of at least 3:1 against adjacent color(s)

    Help:

    User Interface Components and Graphical Objects must have a contrast ratio of at least 3:1 against adjacent color(s)

    object-alt

    Markup:

            <object width="100" height="100" style="background: green"></object>
        

    Description:

    Ensures <object> elements have alternate text

    Help:

    <object> elements must have alternate text

    radiogroup

    Markup:

            <input type="radio" id="male" name="sex">
    <label for="contactChoice2">Male</label>
    <input type="radio" id="female" name="sex">
    <label for="contactChoice2">Female</label>
        

    Description:

    Ensures related <input type="radio"> elements have a group and that the group designation is consistent

    Help:

    Radio inputs with the same name attribute value must be part of a group

    reflow

    Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text Some text

    Markup:

            <div style="width: 500px; overflow: scroll">
        <div style="width: 1000px">
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
            Some text Some text Some text Some text Some text Some text Some text Some text Some text
        </div> 
    </div> 
        

    Description:

    Content should be presented without requiring horizontal scrolling

    Help:

    Horizontal scrolling shouldn't be used if screen is wider than 320px

    region

    Not all content on this page contained within a landmark region

    Markup:

            <span>Not all content on this page contained within a landmark region</span>
        

    Description:

    Ensures all content is contained within a landmark region

    Help:

    Content should be contained in a landmark region

    scope-attr-valid

    scope attribute in html5 should be used only on <th> element 2

    Markup:

            <table>
        <tr>
            <td scope="row">scope attribute in html5 should be used only on &lt;th&gt; element</td>
            <td>2</td>
        </tr>
    </table>
        

    Description:

    Ensures the scope attribute is used correctly on tables

    Help:

    scope attribute should be used correctly

    server-side-image-map

    Markup:

            <img ismap src="picture.jpeg">
        

    Description:

    Ensures that server-side image maps are not used

    Help:

    Server-side image maps must not be used

    skip-link

    Header
    Main
    Header
    SkipLink
    Main
    Header
    SkipLink
    Main
    Header
    SkipLink
    Main
    Header
    SkipLink
    Main

    Markup:

            <div class="fakeBodyElm">
        <header>Header</header>
        <nav>Navigation</nav>
        <main>Main</main>
    </div>
    
    <div class="fakeBodyElm">
            <header>Header</header>
            <a>SkipLink</a>
            <nav>Navigation</nav>
            <main>Main</main>
        </div>
    
    <div class="fakeBodyElm">
        <header>Header</header>
        <a href="http://example.com/">SkipLink</a>
        <nav>Navigation</nav>
        <main>Main</main>
    </div>
    
    <div class="fakeBodyElm">
        <header>Header</header>
        <a href="#">SkipLink</a>
        <nav>Navigation</nav>
        <main>Main</main>
    </div>
    
    <div class="fakeBodyElm">
        <header>Header</header>
        <a href="#lostContent">SkipLink</a>
        <nav>Navigation</nav>
        <main>Main</main>
    </div>
        

    Description:

    Ensures the first link on the page is a skip link

    Help:

    The page should have a skip link as its first link

    tabindex

    Markup:

            <input type="text" tabindex=3>
        

    Description:

    Ensures tabindex attribute values are not greater than 0

    Help:

    Elements should not have tabindex greater than zero

    table-duplicate-name

    Concerts
    Date Event Venue
    12 Feb Waltz with Strauss Main Hall
    Concerts
    Date Event Venue

    Markup:

            <table summary="Concerts">
        <caption>Concerts</caption>
        <tr>
            <th>Date</th>
            <th>Event</th>
            <th>Venue</th>
        </tr>
        <tr>
            <td>12 Feb</td>
            <td>Waltz with Strauss</td>
            <td>Main Hall</td>
        </tr>
    </table>
    
    <figure>
        <figcaption>Concerts</figcaption>
        <table summary="Concerts">
            <tr>
                <th>Date</th>
                <th>Event</th>
                <th>Venue</th>
            </tr>
        </table>
    </figure>
        

    Description:

    Ensure that tables do not have the same summary and caption

    Help:

    The <caption> element should not contain the same text as the summary attribute

    table-fake-caption

    colspan attribute instead of caption
    Cell 2 Cell 3

    Markup:

            <table width="200" border="1" align="center" cellpadding="4" cellspacing="0">
        <tr>
            <td colspan="2" bgcolor="#FBF0DB">colspan attribute instead of caption</td>
        </tr>
        <tr>
            <td>Cell 2</td>
            <td>Cell 3</td>
        </tr>
    </table>
        

    Description:

    Ensure that tables with a caption use the <caption> element.

    Help:

    Data or header cells should not be used to give caption to a data table.

    target-size

    Anchor

    Markup:

            <button type="button" style="width: 40px;">Button</button>
    <input type="button" style="width: 40px;">
    <div><a href="blablalbla">Anchor</a></div>
    <div><img src="blablalbla" style="width: 40px;"></div>
        

    Description:

    Target size must be acceptable

    Help:

    The size of the target for pointer inputs is at least 44 by 44 CSS pixels

    td-has-header

    Header of 1st row Header of 2nd row Header of 3nd row
    Cell 1 Cell 2 Cell 3 Cell 4
    Cell 1 Cell 2 Cell 3 Cell 4
    Cell 1 Cell 2 Cell 3 Cell 4
    Cell 1 Cell 2 Cell 3

    Markup:

            <table width="200" border="1" align="center" cellpadding="4" cellspacing="0">
        <tr>
            <th>Header of 1st row</th>
            <th>Header of 2nd row</th>
            <th>Header of 3nd row</th>
        </tr>
        <tr>
            <td>Cell 1</td>
            <td>Cell 2</td>
            <td>Cell 3</td>
            <td>Cell 4</td>
        </tr>
        <tr>
            <td>Cell 1</td>
            <td>Cell 2</td>
            <td>Cell 3</td>
            <td>Cell 4</td>
        </tr>
        <tr>
            <td>Cell 1</td>
            <td>Cell 2</td>
            <td>Cell 3</td>
            <td>Cell 4</td>
        </tr>
        <tr>
            <td>Cell 1</td>
            <td>Cell 2</td>
            <td>Cell 3</td>
        </tr>
    </table>
        

    Description:

    Ensure that each non-empty data cell in a large table has one or more table headers

    Help:

    All non-empty td element in table larger than 3 by 3 must have an associated table header

    td-headers-attr

    hello
    goodbye

    Markup:

            <table>
        <tr>
            <th>
                <span id="hi">hello</span>
            </th>
        </tr>
        <tr>
            <td headers="hi">goodbye</td>
        </tr>
    </table>
        

    Description:

    Ensure that each cell in a table using the headers refers to another cell in that table

    Help:

    All cells in a table element that use the headers attribute must only refer to other cells of that same table

    th-has-data-cells

    Text
    Text2

    Markup:

            <table>
        <tr>
            <th>Text</th>
        </tr>
        <tr>
            <th>Text2</th>
        </tr>
    </table>
        

    Description:

    Ensure that each table header in a data table refers to data cells

    Help:

    All th element and elements with role=columnheader/rowheader must data cells which it describes

    valid-lang

    nonvalid lang attribute

    Markup:

            <span lang="nonvalid">nonvalid lang attribute</span>
        

    Description:

    Ensures lang attributes have valid values

    Help:

    lang attribute must have a valid value

    video-caption

    Markup:

            <video width="320" height="240" controls>
        <source src="https://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4">
        <track kind="descriptions">
    </video>
        

    Description:

    Ensures <video> elements have captions

    Help:

    <video> elements must have captions

    video-description

    Markup:

            <video width="320" height="240" controls>
        <source src="https://www.quirksmode.org/html5/videos/big_buck_bunny.mp4" type="video/mp4">
        <track kind="captions">
    </video>
        

    Description:

    Ensures <video> elements have audio descriptions

    Help:

    <video> elements must have an audio description track