---
title: 'WebMCP: Unsere Website gibt KI-Agenten Werkzeuge, statt sie klicken zu lassen'
description: 'Was ist WebMCP? Wir haben es auf visales.de eingebaut: vier Werkzeuge
für KI-Agenten, Test in 10 Minuten, Stand in Chrome und Safari, Grenzen beim Datenschutz.'
slug: webmcp-agents-md-ausfuehrbar
date: '2026-11-01T15:00:00.000Z'
author: Gerhard Schröder
tags:
- ki
- skillcms
primary_tag: ki
excerpt: Mit WebMCP bietet eine Website dem KI-Agenten im Browser fertige Werkzeuge
an. Wir haben vier eingebaut. Was das bringt, wie du es testest und warum es auf
dem Mac in Safari nicht läuft.
canonical: https://visales.de/webmcp-agents-md-ausfuehrbar.html
---
1. **WebMCP lässt eine Website dem KI-Agenten im Browser fertige Werkzeuge anbieten. Der Agent ruft sie direkt auf, statt Seiten zu lesen und Knöpfe zu suchen.**
2. **visales.de bietet seit dem 30. Oktober vier solche Werkzeuge an: Fachartikel suchen, Preisrahmen nennen, Projekt qualifizieren, Kontakt vorbereiten. Absenden kann nur der Mensch.**
3. **WebMCP ist ein Entwurf, kein Standard. Nur Chrome kann es, und das im Test. Apple lehnt es für Safari ab, dort funktioniert unsere Seite wie bisher.**
## Anton, Franz und ein KI-Agent auf unserer Website
**Montag, 8:40 Uhr. Anton, Vertriebsleiter, steht mit dem Kaffeebecher in Franz' Büro. „Der Konfigurator. Ich will bis Freitag wissen, was so etwas kostet und wer das kann.“**
**Franz öffnet Chrome und tippt in den KI-Assistenten: „Finde einen Anbieter für einen 3D-Produktkonfigurator für Industrieventile. Preisrahmen, Ablauf, und bereite eine Anfrage vor.“**
Bisher hätte der Agent jetzt so gearbeitet wie ein Mensch mit sehr wenig Geduld: Startseite laden, Menü suchen, Leistungsseite lesen, irgendwo einen Preis vermuten, ein Kontaktformular finden und raten, welches Feld wofür ist.
Auf visales.de läuft es anders. Die Seite sagt dem Agenten gleich beim Laden: Hier gibt es vier Werkzeuge. Der Agent ruft `leistung_und_preisrahmen` auf und bekommt den Rahmen für Konfiguratoren, mit dem Hinweis „Rahmen, kein Angebot“. Dann `projekt_qualifizieren`: Welche Angaben fehlen noch? Datenformat, Variantenzahl, Zeitrahmen. Franz beantwortet zwei Fragen. Zum Schluss `kontakt_vorbereiten`. Auf dem Bildschirm öffnet sich ein Fenster mit der fertigen Anfrage.
**„Und jetzt?“, fragt Anton.**
**„Jetzt schicke ich sie ab. Das darf der Agent nämlich nicht.“**
**Anton nickt langsam. „Kann unsere Website das auch?“**
Gute Frage. Genau darum geht es in diesem Artikel. *(Anton und Franz sind erfunden. Die vier Werkzeuge gibt es wirklich.)*
*Bild: Testlauf auf visales.de: Diese Anfrage hat ein KI-Modell vorbereitet, das bei uns lokal auf einem Mac mini läuft. Abgeschickt hat es nichts, das bleibt beim Menschen.*
## Was ist WebMCP, und was ist der Unterschied zu MCP?
**MCP** verbindet einen KI-Agenten mit Programmen und Servern, etwa mit deinem Kalender oder einer Datenbank. **WebMCP** lässt eine Website im Browser dem Agenten des Besuchers Werkzeuge anbieten. Die Website beschreibt selbst, was man auf ihr tun kann, mit Namen, Beschreibung und erlaubten Eingaben.
Das Bild dazu: Statt durch den Laden zu laufen und Regale zu lesen, steht der Agent an der Theke und gibt einen Bestellzettel ab.
Technik: So meldet eine Website ein Werkzeug an
Die Seite prüft per JavaScript, ob der Browser WebMCP kann (`document.modelContext`). Nur dann meldet sie ihre Werkzeuge mit `registerTool` an. Jedes Werkzeug hat einen Namen, eine Beschreibung für den Agenten, ein Schema für die Eingaben und eine Funktion, die im Browser läuft.
Unser kleinstes Werkzeug, so wie es auf visales.de läuft:
```js
const mc = document.modelContext || navigator.modelContext;
if (mc) {
mc.registerTool({
name: "leistung_und_preisrahmen",
description: "Nennt Preisrahmen aus dem UCP-Profil von viSales. Rahmen, kein Angebot.",
inputSchema: {
type: "object",
properties: {
leistung: { type: "string", description: "Optional: WebAR, Produktkonfigurator oder Digital Twin" }
}
},
annotations: { readOnlyHint: true },
async execute() {
const ucp = await (await fetch("/.well-known/ucp")).json();
const rahmen = ucp.ucp.capabilities["com.visales.inquiry.contact"][0].config.pricing_ranges;
return { hinweis: "Rahmen, kein Angebot; Individualpreise nur per Anfrage.", rahmen };
}
});
}
```
Drei Dinge daran sind wichtig:
1. **Ohne WebMCP passiert nichts.** Keine Netzanfrage, kein Fehler. Safari und Firefox sehen die Seite wie immer.
2. **`readOnlyHint`** sagt dem Agenten: Dieses Werkzeug liest nur, es ändert nichts.
3. **Die Preise stehen an einer Stelle,** im UCP-Profil unter `/.well-known/ucp`. Das Werkzeug liest sie dort, statt sie doppelt zu pflegen.
### WebMCP testen in 10 Minuten
1. Chrome öffnen, `chrome://flags/#enable-webmcp-testing` aufrufen, auf „Enabled“ stellen, Chrome neu starten.
2. https://visales.de/lokale-ki-im-browser.html öffnen.
3. Die Entwicklerwerkzeuge öffnen (Konsole) und eingeben: `(await document.modelContext.getTools()).map(t => t.name)`. Du siehst die vier Namen.
4. Ein Werkzeug aufrufen: `const t = (await document.modelContext.getTools()).find(t => t.name === "leistung_und_preisrahmen"); await document.modelContext.executeTool(t, {})`.
5. Für `kontakt_vorbereiten` öffnet sich das Fenster mit der Anfrage. Abgeschickt wird nichts.
Getestet in Chrome 156 mit Testschalter: Ein lokales Sprachmodell (Qwen3-14B) hat auf unserer Seite selbst den Preisrahmen abgefragt, das Projekt qualifiziert und die Anfrage vorbereitet. Abgeschickt hat es nichts.
## WebMCP-Beispiel: vier Werkzeuge für KI-Agenten
1. **`fachartikel_suchen`:** sucht in unseren Fachartikeln und gibt Abschnitte mit Titel und Link zurück. Ohne deine Zustimmung per Stichwort, nach Zustimmung in der [Demo zur lokalen KI](/lokale-ki-im-browser.html) auch nach Bedeutung.
2. **`leistung_und_preisrahmen`:** nennt Leistungen und Preisrahmen. Ein Rahmen, kein Angebot.
3. **`projekt_qualifizieren`:** sagt, welche Angaben für eine Einschätzung noch fehlen.
4. **`kontakt_vorbereiten`:** zeigt eine fertige Anfrage an. **Absenden kann nur der Mensch.** Der Agent bekommt zurück: „Contact requires human approval.“
Dieselben vier Namen stehen in unserer [agents.md](/agents.md). Die Datei sagt seit Mai, was ein Agent bei uns darf. Mit WebMCP wird daraus etwas, das er auch tun kann.
Unsere Schritte: Wie visales.de WebMCP-fähig wurde
1. **Januar 2026: Text statt Bildwand.** Beim Relaunch haben wir bewusst viele Texte auf die Website gestellt, damit Menschen und KI verstehen, was wir tun. ([Warum unsere neue Website bewusst viele Texte enthält](/1-warum-unsere-neue-website-bewusst-viele-texte-enthalt-und-was-ki-damit-zu-tun-hat.html))
2. **Februar 2026: llms.txt.** Sprachmodelle bekommen bewusst Zugriff auf unsere Inhalte, mit einer Übersicht, die sie direkt lesen können. ([Was deine Website KI-Sprachmodellen sagt](/was-deine-website-ki-sprachmodellen-sagt-und-warum-das-kunftig-wichtig-wird.html), [Website der Zukunft: drei Türen](/website-zukunft-ki-agent-2d-openusd.html))
3. **Mai 2026: Regeln für Agenten.** `agents.md` sagt, was ein Agent bei uns darf. Das UCP-Profil unter `/.well-known/ucp` beschreibt Leistungen und Preisrahmen maschinenlesbar. ([agents.md: Was B2B-Websites vom Shopify-KI-Shopping lernen können](/agents-md-b2b-website-shopify-ki-shopping.html))
4. **Juni 2026: Grounding Pages und Schema.org.** Nach dem Wechsel auf unser eigenes CMS legen Grounding Pages fest, wer wir sind und was unsere Begriffe bedeuten. Strukturierte Daten nach Schema.org stehen auf jeder Seite. ([Nach dem Relaunch: viSales.de mit neuen Funktionen](/relaunch-2026-grounding.html))
5. **Oktober 2026: Suche in den Browser.** Die lokale KI durchsucht unsere Fachartikel auf deinem Gerät. Auf diese Suche greift heute das Werkzeug `fachartikel_suchen` zurück. ([Lokale KI im Browser](/lokale-ki-im-browser.html))
6. **30. Oktober 2026: Werkzeuge anmelden.** Vier Werkzeuge, nur wenn der Browser WebMCP kann. Keine neuen Daten, keine neue Datenbank: Die Werkzeuge lesen, was schon da war. Getestet in Chrome 156 mit Testschalter, auch mit einem lokalen KI-Modell, das die Werkzeuge selbst gewählt hat. Dazu Safari auf Mac, iPad und iPhone: Seite unverändert, keine Fehler. Die Werkzeuge stehen jetzt auch in `agents.md` und `llms.txt`.
Die eigentliche Arbeit war also nicht der Code für WebMCP. Es waren die Monate davor, in denen wir aufgeschrieben haben, was unsere Website ist, was sie kostet und was ein Agent darf.
## Grenzen von WebMCP: nur Chrome, kein Safari
| WebMCP in Chrome, Safari und Firefox | Stand: Oktober 2026 |
|---|---|
| Chrome | im Test ab Version 149, mit Testschalter oder Origin Trial |
| Safari | abgelehnt (Apple, Juni 2026) |
| Firefox | neutral, noch keine Umsetzung |
| Status | Entwurf einer W3C Community Group, kein Standard |
Bei uns arbeiten alle am Mac. Auf dem Mac in Safari passiert mit WebMCP: nichts. Die Seite funktioniert dort wie gewohnt, nur die Werkzeuge gibt es nicht. Wir versprechen also nichts, was auf dem Mac nicht geht.
### Datenschutz bei WebMCP
Die zweite Grenze ist der Datenschutz. Die Werkzeuge rechnen im Browser, unser Server sieht keine Frage. Den Agenten betreibt aber meist ein Cloud-Anbieter, zum Beispiel Google bei Gemini in Chrome. Was ein Werkzeug zurückgibt, liest dieser Agent. Die lokale Suche schützt deine Frage also vor uns, nicht vor deinem eigenen Assistenten.
## Ausblick: Was wäre, wenn jede Website Werkzeuge für KI-Agenten hätte?
Stell dir vor, jede Lieferanten-Website hätte so eine Theke. Dann würde Franz' Agent nicht mehr zehn Websites lesen und raten. Er würde zehn Werkzeuge aufrufen und Antworten bekommen, die der Anbieter selbst formuliert hat. Wer keine Werkzeuge anbietet, wird weiter gelesen, interpretiert und falsch zusammengefasst.
Und wenn der Konfigurator selbst ein Werkzeug wäre? Der Agent stellt Maße und Varianten ein, der Mensch sieht das Ergebnis im 3D-Modell und bestätigt. Die Entscheidung bleibt beim Menschen, die Fleißarbeit nicht. Genau daran arbeiten wir mit unserem 3D-Konfigurator [USDconfig](/usdconfig.html). Im nächsten Artikel zeige ich, wie gut KI-Systeme USDconfig heute schon lesen können und was wir dafür geändert haben. Wer ihn nicht verpassen will: [Newsletter abonnieren](/newsletter.html) oder mir auf [LinkedIn](https://www.linkedin.com/in/gerhardschroeder/) folgen.
Und wenn Safari nachzieht? Dann ist WebMCP auf einen Schlag auf jedem iPhone. Ob das kommt, weiß heute niemand. Darum bauen wir es als Zusatz: Wer es kann, bekommt mehr. Wer es nicht kann, verliert nichts.
Für deine Website heißt das, in dieser Reihenfolge: zuerst die Basics mit strukturierten Daten nach Schema.org und Grounding Pages, dann `llms.txt`, dann `agents.md`, dann Werkzeuge. Wer die Basics hat, braucht für den Rest wenig Code. Wie weit deine Website ist, schauen wir uns gern mit dir an: [Website und KI-Sichtbarkeit](/website-ki-sichtbarkeit.html) oder direkt in einer [Beratung](/beratung.html#ki).
**PS:** Das größte Problem ist, dass es im schnell wachsenden Markt rund um Web und KI keinen gemeinsamen Standard gibt. Die Anforderungen sind einfach zu verschieden. agents.md ist für E-Commerce gedacht, WebMCP passt gut zum Anfragen stellen. Grounding Pages und Schema.org geben Suchmaschinen und KI die Grundlagen über ein Unternehmen an die Hand. Das ist schnelllebig und kompliziert. Wir helfen, es einfach und wirksam umzusetzen, und testen alles zuerst bei uns selbst. Auch Werkzeuge wie ein KI-Modell im Browser, das Fragen zu unseren Fachthemen beantwortet.
Weiterlesen: fünf Artikel zum Thema
WebMCP ist der letzte Schritt einer Reihe. Diese fünf Artikel zeigen die Schritte davor und wie du deine eigene Website prüfst.
1. [agents.md: Was B2B-Websites vom Shopify-KI-Shopping lernen können](/agents-md-b2b-website-shopify-ki-shopping.html): Ein Einkäufer sucht abends per KI-Chat ein Spezialteil. Was ein Agent auf einer B2B-Website lesen, qualifizieren und anfragen darf, und wo der Mensch freigeben muss.
2. [Lokale KI im Browser: Frag unsere Fachartikel, ohne dass deine Frage das Gerät verlässt](/lokale-ki-im-browser.html): Eine KI läuft nur in deinem Browser und antwortet aus unseren Fachartikeln. Auf diese Suche greift das Werkzeug `fachartikel_suchen` zurück.
3. [Was Deine Website KI-Sprachmodellen sagt und warum das künftig wichtig wird](/was-deine-website-ki-sprachmodellen-sagt-und-warum-das-kunftig-wichtig-wird.html): Warum wir Sprachmodellen per llms.txt bewusst Zugriff auf unsere Inhalte geben, und was das mit der robots.txt zu tun hat.
4. [Website der Zukunft: Wenn Browser, KI-Agenten & Spatial-OpenUSD parallele Zugänge werden](/website-zukunft-ki-agent-2d-openusd.html): Browser, KI-Agenten und 3D-Umgebungen mit OpenUSD als parallele Zugänge zur selben Website. Eine Einordnung für Entscheider.
5. [KI-Bereitschaft deiner Website in 5 Minuten prüfen mit claude-rank: Skill-Abo #9](/skill-abo-9-claude-rank.html): Ein Befehl in Claude Code zeigt, ob GPTBot, ClaudeBot und PerplexityBot deine Website lesen dürfen, und legt fehlende Dateien wie llms.txt an.
