Scan a project, fix a finding, watch it clear

In this tutorial we will run our first accessibility scan with b8e, read the findings it reports, fix one of them, and re-run the scan to watch that finding disappear. By the end you will have seen the whole loop the CLI is built around — scan, fix, verify — on a real project.

You do not need to know anything about accessibility rules yet. We will take one finding and fix it together.

Before we start

You will need the b8e CLI on your PATH and a copy of the sample project. Clone the public starter project:

git clone https://github.com/Binclusive/a11y-starter
cd a11y-starter

Step 1 — Scan the project

Run a scan over the project and ask for readable output:

b8e scan .

b8e walks the source files and prints what it found. You will see a short report listing each file with a finding, and under it the rule that was flagged. One of those findings is on the hero image — it has no alternative text, so a screen-reader user would hear nothing where the image should be described. That is the finding we will fix.

Step 2 — Look closer at the finding

Ask for the machine-readable output so we can see the finding’s details:

b8e scan . --format json

Find the finding whose rule is about image alt text. It maps to WCAG success criterion 1.1.1, and it points at src/components/Hero.tsx. That is enough to fix it.

Step 3 — Fix the image

Open src/components/Hero.tsx. The hero image is missing its alt attribute:

<img src="/hero.png" />

Add an alt that describes the image:

<img src="/hero.png" alt="Starter product hero" />

Save the file.

Step 4 — Scan again and watch it clear

Run the same scan once more:

b8e scan .

The image-alt finding on Hero.tsx is gone. You changed one line, re-ran the scan, and confirmed the fix — the loop the rest of your accessibility work will follow.

What we did

We scanned a project, read its findings, fixed the missing image alt text, and verified the fix by re-scanning. That is the core b8e loop.

Next, browse the command reference to see every flag b8e scan accepts, or the rules catalog to see what else the scanner checks.