How to make your website ready for AI agents

In short

• Start with one task. Pick the most important job customers do on your website, such as requesting a quote, and do that first.
• Most of it is ordinary good engineering. Real form elements, clear labels, and buttons that say what they do help agents, screen readers, and busy people alike.
• Custom pickers are the most common trap. Calendars, variant pickers, and dropdowns built from scratch often lack a state the agent can read.
• CAPTCHAs stop agents, and that is often the point. Consider where they sit, and make sure the agent can stop cleanly and hand the task back to the user.
• Test with fictitious data. Lighthouse gives an indication, but you only know whether an agent gets the job done by letting it try.

How an agent uses a website

An AI agent that uses the browser does roughly what a person does: it reads the page, finds fields and buttons, types text, chooses options, and clicks on. Some agents look at screenshots, while others read the structure of the page, the so-called accessibility tree. Most do a bit of both.

The difference from a person is that the agent cannot guess from context. A person sees that a date in the calendar is “selected” because it has a different colour. An agent reading the structure sees no difference if colour is the only thing that changes. Many of the obstacles are therefore the same as for people who use screen readers.

Choose one task first

It is tempting to “make the whole website agent-ready”. It is better to choose one specific job and follow it from start to finish:

• Tradesperson: request a quote for a specific job
• Clinic or salon: book an available appointment
• Online shop: find a product in the right size and add it to the basket
• Lawyer or adviser: send an enquiry about a specific area

Write the task down the way a customer would say it to the agent, such as “request a quote for a new bathroom, about six square metres”. That is the one to test.

The checklist

1. Use real form elements

Standard HTML elements such as <input>, <select>, <textarea>, checkboxes, and radio buttons have built-in behaviour that agents understand. Custom components that look like a dropdown but are really a collection of <div>s do not, without extra work.

If you use a component library, choose one built for accessibility that provides the right roles and states.

2. Give every field a visible label

Every field needs a <label> that says what to enter. Placeholder text disappears as soon as you start typing and is not enough. If there are format requirements, such as phone number or postcode, state them by the field.

3. Expose the selected state in a readable way

Calendars, time slots, sizes, and colours are the most common places agents get stuck. The selection must show in the structure, not just in the colour: use radio buttons or attributes such as aria-pressed, aria-selected, and aria-checked, and update them when the user chooses.

4. Let buttons say what they do

“Send request”, “Choose time”, and “Add to basket” are clearer than “Next”, “OK”, or an arrow. Icon buttons need a name with aria-label.

5. Write error messages as text by the field

A red border does not tell the agent what is wrong. Write the error as text, link it to the field (for example with aria-describedby), and say how to fix it.

6. Think through CAPTCHAs and bot protection

CAPTCHAs and other bot protection are designed to stop automated visits, and agents are often stopped. Keeping them may be the right call. The question is where they sit: a check at the very end, just before submission, lets the agent do most of the work and leaves the final step to the user. A check that appears before the form is even shown stops everything.

If your form uses a hidden honeypot, a field only bots fill in, check that agents cannot see it. We found that our own honeypot showed up as an ordinary field for agents. Read how we fixed it.

7. Keep the page still

Cookie banners, chat windows, and newsletter pop-ups that cover the form or push content down make the agent click the wrong thing or look for something that is hidden. Show them in a way that does not cover the task.

8. Keep prices, terms, and opening hours as text

Information that only exists in images or PDFs is harder to use for agents and people alike. If prices are in a table on the page, the agent can compare and answer the user.

9. Do not require sign-in before it is necessary

If customers need an account before they can see prices or available times, most agents stop there. Let customers get as far as possible before signing in, and offer ordering without an account where you can.

10. Confirm clearly that the task is complete

After submission, the page should say clearly what happened: “Your request has been sent. We will reply within two working days.” The agent then knows the job is done and can pass that on.

11. Lay the foundation

Structured data about your business, an up-to-date sitemap, and an llms.txt file make it easier for agents and AI assistants to find the right page. It does not solve the points above, but it is little work.

How to test

1. Run a quick check. Our free check looks at robots.txt, llms.txt, structured data, form labels, and CAPTCHA on the home page.
2. Run Lighthouse. The Agentic Browsing category checks, among other things, the accessibility tree and layout stability. We have explained what each audit means.
3. Try it yourself with an agent tool. Give the agent the task you wrote down, with fictitious data, and ask it to stop before submitting. Watch where it hesitates, guesses, or gives up.
4. Test on mobile and with the keyboard. What you find with a keyboard and screen reader is often what stops agents too.
5. Repeat after changes. A new booking system or form solution can change the result completely.

Would you rather we ran the test?

An agent test is part of Foretrukket (in Norwegian), our AI-visibility service for Norwegian businesses. It helps them get recommended when customers ask ChatGPT and Google.