Skip to content
Accessibility Scanner

Automated accessibility report

accessibilityscanner.app

https://accessibilityscanner.app/demo.html
Tested against
WCAG 2.2 Level A & AA
Scanned
Jun 26, 2026 · 19:03
HTTP
200
Engine
axe-core 4.12.1
Took
11.4s

6 automated issues across 17 elements.

1

Critical

1 rule · 1 element

7

Serious

2 rules · 7 elements

9

Moderate

3 rules · 9 elements

0

Minor

0

Manual review

26

Passed

Failed WCAG success criteria

  • 1.1.1
  • 1.4.3
  • 2.4.4
  • 4.1.2

critical 1 rule

critical

image-alt

· 1 element Level A WCAG 1.1.1

Images must have alternative text

How to fix this
Show affected element

  • img

    <img src="/demo-beans.jpg">

    Fix any of the following: Element does not have an alt attribute aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute Element's default semantics were not overridden with role="none" or role="presentation"

serious 2 rules

serious

color-contrast

· 5 elements Level AA WCAG 1.4.3

Elements must meet minimum color contrast ratio thresholds

How to fix this
Show affected elements

  • div > .muted

    <p class="muted">Our roaster pulls the beans the moment the first crack settles, so every bag lands
      bright and sweet. We taste every lot before it ships and tell you exactly what is in the cup —
      no mystery blends, no filler.</p>

    Fix any of the following: Element has insufficient color contrast of 2.03 (foreground color: #b7afa1, background color: #faf7f1, font size: 12.2pt (16.32px), font weight: normal). Expected contrast ratio of 4.5:1

  • #subscribe > .muted

    <p class="muted">Pause or cancel anytime. Free shipping over $40.</p>

    Fix any of the following: Element has insufficient color contrast of 2.17 (foreground color: #b7afa1, background color: #ffffff, font size: 12.2pt (16.32px), font weight: normal). Expected contrast ratio of 4.5:1

  • button

    <button>Subscribe</button>

    Fix any of the following: Element has insufficient color contrast of 1.48 (foreground color: #a7c3bc, background color: #d9e8e4, font size: 12.0pt (16px), font weight: bold). Expected contrast ratio of 4.5:1

  • h1

    <h1>Coffee roasted the morning it ships.</h1>

    Element's background is a gradient. Measured at its lowest-contrast point the ratio is 1.37:1, below the required 3:1.

  • .hero > p

    <p>Single-origin beans from small farms, roasted in tiny batches by the harbor and sent straight to your door.</p>

    Element's background is a gradient. Measured at its lowest-contrast point the ratio is 1.28:1, below the required 4.5:1.

serious

link-name

· 2 elements Level A WCAG 2.4.4 WCAG 4.1.2

Links must have discernible text

How to fix this
Show affected elements

  • a[href="#"]:nth-child(1)

    <a href="#"><svg viewBox="0 0 24 24"><path d="M22 12a10 10 0 1 0-11.5 9.9v-7H8v-2.9h2.5V9.7c0-2.5 1.5-3.9 3.8-3.9 1.1 0 2.2.2 2.2.2v2.5h-1.2c-1.2 0-1.6.8-1.6 1.6v1.9H16l-.4 2.9h-2.3v7A10 10 0 0 0 22 12z"></path></svg></a>

    Fix all of the following: Element is in tab order and does not have accessible text Fix any of the following: Element does not have text that is visible to screen readers aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute

  • a[href="#"]:nth-child(2)

    <a href="#">

    Fix all of the following: Element is in tab order and does not have accessible text Fix any of the following: Element does not have text that is visible to screen readers aria-label attribute does not exist or is empty aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty Element has no title attribute

moderate 3 rules

moderate

heading-order

· 1 element

Heading levels should only increase by one

How to fix this
Show affected element

  • #beans

    <h3 id="beans" style="font-size:1.6rem; margin-top:10px;">This week at the roastery</h3>

    Fix any of the following: Heading order invalid

moderate

landmark-one-main

· 1 element

Document should have one main landmark

How to fix this
Show affected element

  • html

    <html lang="en">

    Fix all of the following: Document does not have a main landmark

moderate

region

· 7 elements

All page content should be contained by landmarks

How to fix this
Show affected elements

  • h1

    <h1>Coffee roasted the morning it ships.</h1>

    Fix any of the following: Some page content is not contained by landmarks

  • .hero > p

    <p>Single-origin beans from small farms, roasted in tiny batches by the harbor and sent straight to your door.</p>

    Fix any of the following: Some page content is not contained by landmarks

  • #beans

    <h3 id="beans" style="font-size:1.6rem; margin-top:10px;">This week at the roastery</h3>

    Fix any of the following: Some page content is not contained by landmarks

  • .grid

    <div class="grid">

    Fix any of the following: Some page content is not contained by landmarks

  • #subscribe > h3

    <h3>Get a bag every two weeks</h3>

    Fix any of the following: Some page content is not contained by landmarks

  • #subscribe > .muted

    <p class="muted">Pause or cancel anytime. Free shipping over $40.</p>

    Fix any of the following: Some page content is not contained by landmarks

  • input

    <input type="email" placeholder="[email protected]">

    Fix any of the following: Some page content is not contained by landmarks

Keep this report

We'll email you a copy. No account needed.

Watch for regressions

Re-scan on a schedule and get alerted the moment a new issue appears.

Set up monitoring

↻ scan another page