Designing for Discovery: Why AI and Accessibility Are Now UX Priorities

As web designers, we’ve been taught to prioritize human-centered design. But the web’s newest users aren’t people at all – they’re intelligent agents. 

Whether it’s a voice assistant navigating your site, an AI model summarizing your product pages, or an autonomous agent booking a trip on behalf of a user, digital experiences are no longer built just for humans. They’re also being parsed, interpreted, and acted upon by AI.

This shift is introducing a new layer to UX: AX, or Agent Experience.

What Is Agent Experience (AX)? 

Agent Experience is the practice of designing websites that are legible, navigable, and actionable for AI agents, not just visually appealing to human users. 

Think of agentic AI as a new kind of user. These models can set goals, make decisions, and perform multi-step tasks on someone’s behalf. But unlike a human clicking through your interface, they need structure and signals to make sense of what’s in front of them.

If your site isn’t built to be interpreted by an agent, it may as well be invisible.

Examples of Agentic AI in the Wild: 

• Travel bots that browse and book trips across multiple websites
• AI shopping assistants that assemble outfits or make product recommendations
• Healthcare agents that pre-fill patient forms or schedule appointments
• Custom GPTs designed to navigate your site like a high-speed user

These agents rely on machine-readable patterns, not just visual cues. And they’re gaining traction quickly. 

Designing for Both: The Intersection of AX and Accessibility 

Here’s where it gets interesting: designing for AI often overlaps with designing for accessibility.

Why? Because both AI agents and accessibility tools (like screen readers) rely on structure, clarity, and metadata, not visuals. Semantic HTML, clear hierarchies, alt text, and ARIA attributes serve both audiences.

When you build a website that’s accessible, you’re also helping AI understand it. And vice versa. 

Best Practices for Designing for AX (and AI-Driven UX)

Let’s break down the fundamentals of building AI- and accessibility-ready experiences.

1. Use Semantic HTML, Not Just <div>s

Tags like<header>, <main>, <article>, and <nav> tell machines what each section of the page is for. A <div> is just a container; while semantic tags give meaning.

Think of it this way:

• <div> = “this exists”
• <article> = “this is a self-contained piece of content”

That meaning matters for both screen readers and AI agents trying to understand your layout.

2. Add ARIA Attributes and Good Alt Text

ARIA roles, labels, and landmark tags help communicate purpose, especially when native HTML falls short. 

Alt text shouldn’t just describe what’s visible, it should communicate what’s important. AI models use this metadata to build context.

3. Embrace Structured Files Like llms.txt 

Just like robots.txt tells crawlers what pages to access, the emerging llms.txt proposal helps large language models (LLMs) understand which content to ingest and how.

A well done llms.txt file can clarify:

• Which pages are AI-friendly
• What formats you want indexed
• Which areas should be excluded or labeled for special treatment

Please note that not all LLMs follow llms.txt guidelines currently. Implementing this strategy signals your intent, and helps future-proof your content as these standards evolve and become more concrete.

4. Prioritize Heading Hierarchy

H1, H2, H3, and beyond aren’t just visual. They provide a logical outline of your content. Proper heading structure improves navigation for assistive tools and helps LLMs summarize or extract information accurately.

Avoid skipping levels (e.g., going from H1 to H4) and make sure each page has one clear <h1>.

5. Avoid Critical Content Hidden in JavaScript

Some AI agents (and screen readers) still struggle with heavy JavaScript. While frameworks like React or Vue are commonplace, make sure your most important content (headings, body copy, key CTAs) is rendered in the HTML, not loaded later via JS.

6. Implement Schema Markup

Add structured data using schema.org formats (Product, Article, FAQ, etc.) to describe your content in a way machines can quickly parse. This not only improves SEO but helps LLMs and bots answer user queries more accurately using your site’s data.

Future-Proofing Your Website: Why This Matters Now

Google’s Search Generative Experience (SGE) is already using generative AI to summarize content directly in search results. OpenAI’s GPTBot and similar crawlers are indexing the web for use in large-scale language models. And new regulations (like the EU’s AI Act) are starting to take shape around transparency and data handling.

In this new environment:

• Sites without structure may not show up in AI summaries
• Content without metadata may be misrepresented
• Features without fallback text may become dead ends for users who rely on assistive tech or AI interfaces

Designing for AI and accessibility isn’t just good practice – it’s becoming essential for visibility, usability, and equity.

UX That Goes Beyond the Screen

User experience doesn’t stop at the screen anymore. Whether it’s a screen reader or an autonomous agent, your site is being experienced in new ways that don’t rely on visuals or clicks.

By adopting best practices that serve both humans and machines, you’re not just checking accessibility boxes. You’re building resilient, discoverable, and inclusive digital experiences that are ready for the next generation of users.

Callum Griffith

While freelancing as a graphic and web designer, Callum was asked to not only design but also build a website. That led him to discover Webflow, and sparked the launch of Composite. As one of the earliest experts on the platform, he quickly built a reputation for delivering high-impact Webflow sites, eventually growing a tight-knit team focused on fusing strategic UX with visual excellence. composite.global