WebMCP: zo maak je je website klaar voor AI agents

·5 min read
WebMCP — WebMCP: zo maak je je website klaar voor AI agents

AI agents die je website bezoeken, scrapen nu pixels van je scherm. Ze maken screenshots, sturen die naar een vision model, en hopen dat ze de juiste knop vinden. Verplaatst de knop 5 pixels? Agent stuk. Google heeft daar vorige week een oplossing voor gelanceerd: WebMCP.

Wat is WebMCP precies?

WebMCP staat voor Web Model Context Protocol. Het is een voorgestelde webstandaard van Google en Microsoft die websites een manier geeft om gestructureerde tools aan te bieden aan AI agents. In plaats van dat een agent je pagina als een plaatje bekijkt, vertelt je website precies wat de agent kan doen.

Het protocol draait op een nieuwe browser-API: navigator.modelContext. Via die API deelt je website een gestructureerde lijst van beschikbare acties. Denk aan boekVlucht(bestemming, datum) of maakTicket(categorie, beschrijving). De AI roept die functies direct aan, zonder te hoeven gokken waar welke knop zit.

WebMCP is beschikbaar als early preview in Chrome 146 Canary. Het is ontwikkeld door engineers van Google en Microsoft en wordt geïncubeerd via de W3C Web Machine Learning community group.

Waarom is screen scraping zo'n probleem?

De huidige aanpak van AI agents op het web is duur en fragiel. Volgens VentureBeat zijn er twee dominante methoden, en beide werken slecht:

  • Screenshot-gebaseerd: de agent maakt een screenshot, stuurt het naar een vision model (zoals Claude of Gemini), en probeert te achterhalen waar knoppen zitten. Dat kost duizenden tokens per interactie.
  • DOM parsing: de agent leest de HTML-structuur, maar breekt zodra de layout verandert. Een redesign of A/B-test kan je hele agent-integratie kapotmaken.

Beide methodes verbranden compute en geven onbetrouwbare resultaten. Voor bedrijven die AI agents willen bouwen voor productie is dat een serieus probleem.

Hoe werkt WebMCP? Twee integratiepaden

Google's officiële documentatie beschrijft twee manieren om je website agent-ready te maken.

De declaratieve aanpak (HTML)

Dit is de eenvoudigste methode. Je voegt nieuwe attributen toe aan je bestaande HTML-formulieren:

  • Gebruik toolname en tooldescription attributen in je HTML-tags
  • Chrome leest deze attributen automatisch en maakt er een gestructureerd schema van
  • Als een AI het formulier invult, triggert het een SubmitEvent.agentInvoked event

Het voordeel: je backend weet of een mens of een machine het verzoek doet. Dat opent de deur voor aparte flows per type gebruiker.

De imperatieve aanpak (JavaScript)

Voor complexere interacties die dynamische logica vereisen, biedt WebMCP een JavaScript-API. Volgens MarkTechPost werkt dit met de navigator.modelContext API waar je programmatisch tools registreert met parameters en return-types.

Dit pad is krachtiger maar vereist meer werk. Het is ideaal voor single-page applications of complexe configurators waar HTML-formulieren niet volstaan.

Welke concrete toepassingen zijn er nu al?

Search Engine Land noemt drie use cases die Google deelt:

  1. Reizen: agents kunnen zoeken, filteren en boekingen afhandelen via gestructureerde data. Geen miskliks meer op de verkeerde vlucht.
  2. Klantenservice: agents vullen automatisch alle technische details in bij het aanmaken van supporttickets. Minder heen-en-weer, snellere oplossing.
  3. E-commerce: agents navigeren door productcatalogi, configureren opties en doorlopen de checkout met precisie.

Het verschil met de huidige situatie is groot. Nu falen agents regelmatig bij complexe checkout-flows of dynamische filters. Met WebMCP wordt elke stap een gedefinieerde functie-aanroep.

Wat is het verschil met MCP van Anthropic?

Dit is een logische vraag, want we schreven eerder over MCP als het protocol dat AI aan je tools koppelt. Het korte antwoord: ze vullen elkaar aan.

  • MCP (Anthropic): verbindt AI agents met backend-services. Denk aan databases, API's, CRM-systemen. Draait server-side via JSON-RPC.
  • WebMCP (Google/Microsoft): verbindt AI agents met browser-interfaces. Draait client-side via postMessage communicatie in Chrome.

Volgens VentureBeat kan een reisbedrijf MCP gebruiken voor directe API-integraties met platforms als ChatGPT of Claude, en tegelijkertijd WebMCP implementeren op de consumentenwebsite zodat browser-agents de boekingsflow kunnen doorlopen. Twee standaarden, geen conflict.

Waarom is dit relevant voor Nederlandse bedrijven?

WebMCP raakt direct aan hoe bedrijven hun digitale kanalen inrichten. Als je een webshop, booking-platform of SaaS-product hebt, wordt je website straks niet alleen bezocht door mensen, maar ook door hun AI agents.

Drie redenen om hier nu al over na te denken:

  • Concurrentievoordeel: de eerste bedrijven die hun website agent-ready maken, worden makkelijker gevonden en gebruikt door AI-gestuurde shopping assistants en boekingstools.
  • Lagere kosten: als je nu al AI agents aanbiedt aan klanten (via chatbots of assistants), vervangt WebMCP dure screen scraping door goedkope, betrouwbare functie-aanroepen.
  • Toekomstbestendig: WebMCP wordt een W3C-standaard. Dat betekent dat het niet bij Chrome blijft. Andere browsers zullen volgen.

Hoe kun je vandaag al beginnen?

WebMCP is nog een early preview, maar je kunt nu al voorbereidingen treffen:

  1. Inventariseer je formulieren: welke acties op je website zouden waardevol zijn voor een AI agent? Boekingen, zoekfilters, contactformulieren, productconfigurators.
  2. Structureer je data: zorg dat je formulieren duidelijke veldnamen en validatie hebben. Dat maakt de overstap naar WebMCP-attributen eenvoudiger.
  3. Volg de W3C-groep: de webmachinelearning community group op GitHub is de plek waar de standaard zich ontwikkelt.
  4. Test in Chrome Canary: als developer kun je nu al experimenteren met de navigator.modelContext API in Chrome 146 Canary.
  5. Denk in tool contracts: begin met nadenken over welke "tools" je website aanbiedt. Niet pagina's, niet knoppen, maar functies met input en output.

De verschuiving is helder. Net zoals agentic workflows bij GitHub de manier veranderen waarop developers code deployen, verandert WebMCP hoe gebruikers websites benaderen. De bedrijven die daar het eerst op inspelen, zijn straks het makkelijkst vindbaar voor de volgende generatie AI-gedreven gebruikers.