Ontwikkel websites en applicaties die werken voor gebruikers én hun AI-agenten. Bouw websites en applicaties die werken voor gebruikers én hun AI-agenten.
Aan de slag Doe mee aan de oorspronkelijke proef

Hoe WebMCP werkt

In slechts drie stappen vertelt uw website makelaars precies wat ze kunnen doen.
Stap 1

Uw site definieert de acties die een agent kan uitvoeren als WebMCP-tools. Elke tool heeft een naam, een beschrijving en een JSON-schema.

// Imperative API
document.modelContext.registerTool({
  name: "bookSlot",
  title: "Book a consultation slot",
  description: "Reserve a 30-minute consultation.",
  inputSchema: {
    type: "object",
    properties: {
      date:  { type: "string", format: "date" },
      time:  { type: "string" },
      name:  { type: "string" },
      email: { type: "string", format: "email" }
    },
    required: ["date", "time", "name", "email"]
  },
  annotations: { readOnlyHint: false },
  execute: async (input, client) => {
    return await api.book(input);
  }
});
Stap 2

De browser verzamelt en presenteert deze tools aan de WebMCP-compatibele agent van de gebruiker, samen met de URL, titel en het machtigingsbereik van de oorsprong van de pagina.

Uw website communiceert met de browser, die de informatie vervolgens vertaalt voor de agent.
Stap 3

De agent ziet een contract, levert gestructureerde argumenten aan en jouw code doet de rest. De gebruiker blijft betrokken voor toestemming en bevestiging. Het is sneller en betrouwbaarder dan een handmatige activering. 

// the agent's view
{
  "tool": "bookSlot",
  "arguments": {
    "date": "2026-07-31",
    "time": "14:00",
    "name": "Jerry Jones",
    "email": "jerry.jones@example.com"
  }
}

Ontwikkel tools voor agenten

Duik dieper in de WebMCP API's en documentatie.
Aan de slag
Ontdek de mogelijkheden om uw site efficiënter te maken voor gebruikers en agenten door WebMCP-tools toe te voegen.
Lees het document
Definieer WebMCP-tools met standaard JavaScript om sitespecifieke functies uit te voeren, zoals formulierinvoer en sitenavigatie.
Lees het document
Transformeer uw standaard HTML-formulieren in WebMCP-tools door annotaties toe te voegen.
Lees het document
Test uw tools om te bevestigen dat medewerkers begrijpen wanneer ze de tool moeten aanroepen, hoe ze deze moeten uitvoeren en welke antwoorden acceptabel zijn.
Lees het document
Leer de beste werkwijzen voor het gebruik van WebMCP API's.
Lees het document
Leer hoe je veilige tools voor je website bouwt.
Lees het document
WebMCP en MCP helpen agenten samen om gepersonaliseerde taken namens menselijke gebruikers uit te voeren.
Lees het document

Bouw met AI-agenten

Gebruik Modern Web Guidance met je favoriete AI-codeertools, zodat je in je eigen workflow toegang hebt tot de beste webpraktijken. 
npx modern-web-guidance@latest install
Lees de documenten
Gebruik Modern Web Guidance om sneller extensies te bouwen, met behulp van codeeragents.
Lees het document

Veiligheidsaspecten voor projectontwikkelaars

Agentontwikkelaars moeten bescherming inbouwen tegen kwaadaardige tekst afkomstig van onbetrouwbare bronnen. We bespreken enkele beveiligingstechnieken die relevant zijn voor agents die WebMCP gebruiken.
Lees onze richtlijnen.

AI-ondersteuning, direct in je browser. Krijg belangrijke inzichten, verduidelijk concepten en vind antwoorden op basis van de context van je geopende tabbladen.

Gemini werkt samen met al je Google-apps om je te helpen de dag door te komen.

Ontdek Gemini in Chrome

Introductie van AI-agenten

web.dev
Begrijp de basisprincipes en definities van de verschillende opkomende technologieën, vaak AI genoemd.
Lees het document
web.dev
Als internetprofessionals is het van cruciaal belang dat we nieuwe technologie doordacht en op verantwoorde wijze ontwikkelen.
Lees het document
web.dev
Verwerf een basiskennis over AI om functionaliteiten toe te voegen aan uw websites en webapplicaties.
Volg de cursus