WebMCP: how to make your website usable by AI agents

AI browsers are starting to click through the web on people's behalf. On most sites they fail — because a model reading raw HTML is guessing. WebMCP fixes that by letting your site hand agents real tools. Here's what it is, why it matters now, and how to add it in one line.

Last updated 9 June 2026 · ~6 min read

What is WebMCP?

WebMCP is a web standard that lets a page declare its own capabilities as structured tools an AI agent can invoke, through the browser API navigator.modelContext. It brings the idea behind the Model Context Protocol (MCP) — giving models well-defined tools instead of free-text guessing — directly into the web page, client-side.

Instead of an agent screen-scraping your markup and hoping the right button is the third <div> with an onclick, your site says: "Here is a search_site tool, here is add_to_cart, here is submit_form — call them with these arguments." The agent calls the tool; your existing page handler runs.

Why WebMCP matters in 2026

Three things happened close together:

• The standard landed. WebMCP was published as a W3C work item in February 2026 and shipped in Chrome 146 and Edge 147, with other agentic browsers adopting the same navigator.modelContext shape.
• Agentic browsers went mainstream. Browsers and assistants that act — not just chat — now navigate sites, fill forms, and complete checkouts for users.
• Agentic commerce became real. When an agent shops on a user's behalf, the store that an agent can actually use is the store that gets the sale. The one it can't use loses it silently.

Being agent-readable is becoming what mobile-friendly was in 2012: first a niche edge, then table stakes.

The problem: AI agents fail on normal websites

A model pointed at your raw HTML has to infer intent from a soup of divs, ARIA labels, and inline handlers. It mis-clicks, submits the wrong form, abandons multi-step flows, and burns tokens doing it. Your analytics just show a weird bounce. The agent — and the customer behind it — moves on to a competitor whose site it could drive.

How WebMCP works

At its core you register a tool: a name, a description, an input schema, and a handler that does the thing your site already does.

// Native WebMCP — registering one tool by hand
navigator.modelContext.registerTool({
  name: "search_site",
  description: "Search products on this store",
  inputSchema: { type: "object", properties: { q: { type: "string" } }, required: ["q"] },
  async execute({ q }) {
    location.href = "/search?q=" + encodeURIComponent(q);
    return { ok: true };
  }
});

That's one tool. A real site has search, filters, a cart, a booking form, a contact form, account actions — each needs a tool, an honest schema, and wiring to the live DOM. Multiply by every page and keep it in sync as the UI changes. That's the work WebMCP creates.

How to add WebMCP to your site

Option A — write it yourself

Use navigator.modelContext.registerTool (and provideContext for page-scoped tools) for every action, maintain the schemas, and feature-detect support so non-agentic browsers are unaffected. Full control; ongoing maintenance.

Option B — add Latch (one line)

Latch is an open-source client that auto-detects the actionable elements already on your page — your search box, "add to cart" buttons, and forms — and exposes them as WebMCP tools automatically. No server, no rewrite, no schema babysitting.

Latch feature-detects WebMCP, so it stays completely inert in browsers that don't support it — zero risk to your existing visitors.

Which tools should you expose?

Rule of thumb: expose the actions a human can already take and that move them toward your goal — buying, booking, signing up. Don't expose anything destructive without confirmation.

See which AI agents actually use your site

Once agents can use your site, the next question is which agents are visiting and what they're doing. Latch's optional analytics show tool calls, success rates, and a per-agent breakdown — privacy-safe (tool name, outcome, and page path only; never form contents or query strings). It's how you find out the agentic-traffic story your normal analytics can't tell.

FAQ

Make your site agent-ready in one line

The agentic web is arriving while most sites are still unusable to agents. Being first in your niche is a real, temporary edge.