DEV Community

a11ySolutions
a11ySolutions

Posted on

Your Website Has an Index. AI Agents Can't Navigate Without It.

Try finding one specific fact in a 400-page book with no index. You'll get there eventually, page by page. You'll also waste time, get tired, and maybe give up before you find it.

With an index, the experience changes completely: check the table of contents, jump to the right chapter, done.

Web pages have their own index. It's called the accessibility tree, and it's the structure both screen readers and AI agents use to navigate a site. Neither of them sees your rendered layout. They see the tree.

The tree is built from code decisions
Every part of the tree maps to something you write:

Headings give the page a table of contents. A logical h1 to h3 hierarchy tells the user, or the agent, what's on the page and in what order.

Labels explain what controls do. A button that reads "Submit" in context means nothing out of context. aria-label="Submit booking request" carries the meaning with it.

Alt text is the only description of an image that exists in the tree. Empty alt on a meaningful image means the image doesn't exist for anyone reading the tree.

Link text says where an action leads. "Click here" is a dead end when you can't see the surrounding layout.

What happens when the tree is broken

Here's the part that gets oversimplified. A broken tree doesn't always mean the agent fails outright. Often it means the agent brute-forces its way through, and that's worth understanding.

Without headings, the agent can't jump to the right section. It has to process the entire page to orient itself.

Without labels, it can't know what a control does. It has to guess and act. Sometimes it catches the mistake and retries; sometimes it never realizes it clicked the wrong thing. Research on web agents documents both behaviors: grounding errors where agents fail to identify the intended element, and agents getting stuck in loops without recovering.

Without semantic buttons and real links (looking at you, div with an onclick), it can't reliably identify what's interactive at all.

Sometimes the agent still completes the task. But every extra step adds latency, adds compute, and adds error surface: the wrong button, the wrong field, the task that silently ends up half done. Finding the information is not the same as completing the task. And completing it late, with errors, or halfway isn't completing it either.

Exactly like the book with no index. You might find the page. You arrived late, tired, and with no guarantee you read the right one.

The usual suspects

The tree almost never breaks for exotic reasons. It breaks on the basics:

Divs styled to look like buttons, with no role and no keyboard handling. Pages with no heading hierarchy, just styled text. Meaningful images with empty or missing alt attributes. Links with no href, wired entirely through JavaScript click handlers. Custom form controls that never expose their state.

Each one is a small decision at code review time. Together they decide whether your site is navigable by anything that isn't a sighted human with a mouse.

This is not a new standard

Nobody needs "AI readiness" guidelines. The spec already exists: semantic HTML, proper heading structure, real labels, real buttons, real links, keyboard operability. It's WCAG, applied to a new class of user.

Which means teams that already treat accessibility as core engineering practice didn't prepare for AI agents. They built for humans correctly, and the agents inherited the benefit.

Top comments (0)