Websites und Anwendungen entwickeln, die für Nutzer und ihre KI-Agents funktionieren

Funktionsweise von WebMCP

In nur drei Schritten können Sie KI-Agenten auf Ihrer Website genau mitteilen, was sie tun dürfen.
Schritt 1

Auf Ihrer Website werden die Aktionen deklariert, die ein Agent ausführen kann, z. B. WebMCP-Tools. Jedes Tool hat einen Namen, eine Beschreibung und ein 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);
  }
});
Schritt 2

Der Browser erfasst diese Tools und präsentiert sie dem WebMCP-fähigen Agenten des Nutzers zusammen mit der URL, dem Titel und dem Berechtigungsbereich des Ursprungs der Seite.

Ihre Website kommuniziert mit dem Browser, der die Übersetzung für den Agenten übernimmt.
Schritt 3

Der Agent sieht einen Vertrag, liefert strukturierte Argumente und Ihr Code erledigt den Rest. Der Nutzer wird über Berechtigungen und Bestätigungen auf dem Laufenden gehalten. Kein Rätselraten mehr.

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

Tools für Agents erstellen

Weitere Informationen zu den WebMCP-APIs und der Dokumentation
Entdecken Sie Möglichkeiten, Ihre Website durch Hinzufügen von WebMCP-Tools zu optimieren, damit Nutzer und Kundenservicemitarbeiter effizienter arbeiten können.
Definieren Sie WebMCP-Tools mit Standard-JavaScript, um standortspezifische Funktionen wie Formulareingabe und Websitenavigation auszuführen.
Sie können Ihre Standard-HTML-Formulare in WebMCP-Tools umwandeln, indem Sie Anmerkungen hinzufügen.
Testen Sie Ihre Tools, um zu bestätigen, dass Agenten verstehen, wann sie das Tool aufrufen müssen, wie sie es ausführen und welche Antworten akzeptabel sind.
Best Practices für die Verwendung von WebMCP-APIs
Hier erfahren Sie, wie Sie sichere Tools für Ihre Website erstellen.
WebMCP und MCP helfen zusammen, personalisierte Aufgaben im Namen von Nutzern zu erledigen.

Mit KI-Agenten entwickeln

Nutzen Sie die Modern Web Guidance mit Ihren bevorzugten KI-Coding-Agenten, um in Ihrem bevorzugten Workflow auf Web-Best Practices zuzugreifen.
npx modern-web-guidance@latest install
Mit Modern Web Guidance und Programmieragenten können Sie Erweiterungen schneller erstellen.

Sicherheitsaspekte für Agent-Entwickler

Agent-Entwickler müssen Schutzmaßnahmen gegen schädlichen Text aus nicht vertrauenswürdigen Inhalten entwickeln. Wir stellen einige Sicherheitstechniken vor, die für Agents mit WebMCP relevant sind.

KI-Unterstützung direkt im Browser Gemini fasst die wichtigsten Punkte für dich zusammen, erklärt Konzepte und gibt dir Antworten auf deine Fragen – alles basierend auf dem Inhalt deiner geöffneten Tabs.

Gemini ist in allen Google-Apps verfügbar und unterstützt dich bei deinen täglichen Aufgaben.

KI-Agenten

Hier erfahren Sie mehr über die Grundlagen und Definitionen der verschiedenen neuen Technologien, die oft als KI bezeichnet werden.
Als Webexperte ist es wichtig, dass wir neue Technologien durchdacht und verantwortungsvoll entwickeln.
Grundlagenwissen zu KI aufbauen, um Funktionen für Ihre Websites und Webanwendungen hinzuzufügen.