Ensure lists are marked up correctly

If you had the following HTML example, some screen readers would report that you have two list items, when you actually have four. This may display properly in your browser for visual users, but the reality is, this not semantic HTML and risks confusing screen reader users.

<ul>
    <div class="some_class">
        <li>Example 1</li>
    </div>
    <div class="some_other_class">
        <li>Example 2</li>
        <li>Example 3</li>
        <li>Example 4</li>
    </div>
</ul>

To fix this, you would need to remove the <div class="some_class"> and <div class="some_other_class> elements and ensure only <li> list items remain.

See Technique H88 for more information.