HTML Accessible HTML Checklist for Advanced Reviewers

A webpage should make sense even when someone cannot see its colors, pictures, or layout.

What You Need to Know

Advanced reviews look beyond obvious labels. Check names computed from multiple sources, complex table relationships, dynamic errors, focus recovery, embedded content, and behavior at zoom or high contrast.

Try the Example

Take a look at the example. We’ll explain the important lines right below it.

<main>
    <h1>Registration</h1>
    <form action="/register" method="post">
        <fieldset>
            <legend>Contact details</legend>
            <label for="email">Email</label>
            <input id="email" name="email" type="email" required>
        </fieldset>
        <button type="submit">Register</button>
    </form>
</main>

Let’s Read the Code

<main>: The main element marks the primary page content.
<h1>: A top-level heading explains what the page is about.
for: For connects a label or output with a control by ID.
id: An id uniquely identifies an element on this page.

What the example shows: Advanced checks include accessible name calculation, dynamic error updates, focus restoration, mobile reflow, and changes after JavaScript runs.

What Happens in the Browser?

Try this with Tab and Shift+Tab. If you can, inspect the accessibility tree too; appearance alone does not tell the whole story.

Try a different way of reading. Read only the headings and labels, or navigate through links without looking at the rest of the page. If the page still makes sense, the underlying HTML is probably doing an important part of its job.

Your Turn

Build a test matrix for keyboard, screen-reader, touch, 200% zoom, and form errors.

Common Beginner Mistakes

Judging the page only by how it looks, without checking its meaning and keyboard behavior.
Do not let a technically correct ARIA tree hide a confusing task flow.

Key Takeaways

Advanced reviews look beyond obvious labels.
<main>: The main element marks the primary page content.
A meaningful HTML element is usually a stronger starting point than adding an ARIA role to a generic div. Also check what happens using only the keyboard.