So veröffentlichst du ein Claude-Artifact als echte Website
Claude hat dir in einem Artifact eine schöne Website gebaut. Du klickst auf „Publish“ und bekommst einen Link auf claude.site in der Oberfläche von Anthropic. Für eine Demo ist das super, aber es ist nicht deine Website. So bringst du deine von Claude erzeugte Seite als echte Website mit eigener Adresse online.
Claude ist wirklich hervorragend darin, Webseiten zu bauen. Bitte um eine Landingpage, ein Portfolio oder einen One-Pager, und es rendert ein vollständiges Artifact, das du live im Chat ansehen kannst. Der erzeugte Code ist eigenständig: HTML, CSS und JavaScript in einer Datei. Genau das perfekte Format für sofortiges Hosting.
Das Problem ist der letzte Schritt. Der eingebaute Publish-Button von Claude erzeugt einen Link auf der Domain von Anthropic, in deren Oberfläche. Du kannst ihn nicht auf eine eigene Adresse legen, hast keine volle Kontrolle, und man sieht klar eine „Claude-Demo“ statt einer echten Website. Wenn du etwas willst, das du wirklich nutzt, für ein Unternehmen, ein Portfolio oder ein Projekt, muss das HTML auf echtes Hosting. Die gute Nachricht: Das dauert etwa eine Minute.
Zuerst das HTML aus Claude holen
Claude bietet mehrere Wege, den Rohcode aus einem Artifact zu holen. Jeder davon funktioniert:
- Kopieren-Button: Klicke im Artifact-Bereich rechts auf das Kopieren-Symbol (obere Ecke), um den ganzen Code in die Zwischenablage zu kopieren.
- Download-Button: Suche das Download-Symbol (Pfeil nach unten); Claude speichert das Artifact als
.html-Datei in deinen Downloads. - Einfach fragen: Schreib „Zeig mir das vollständige HTML dieses Artifacts“, und Claude fügt den kompletten Code in den Chat ein. Alles markieren, kopieren.
Tipp: Bitte um eine einzelne HTML-Datei
Hat Claude dein Artifact in React gebaut, bitte: „Gib mir das als eine eigenständige HTML-Datei mit allem CSS und JavaScript eingebettet.“ Eine einzelne HTML-Datei lässt sich am leichtesten hosten: Nichts muss gebaut oder zusammengesetzt werden, also funktioniert sie nach dem Einfügen sofort.
Schritt für Schritt: vom Claude-Artifact zur Live-Website
HTML des Artifacts kopieren
Nutze den Kopieren- oder Download-Button im Artifact-Bereich von Claude, wie oben beschrieben. Achte darauf, dass du die komplette Seite hast: Sie sollte mit <!DOCTYPE html> beginnen und mit </html> enden.
Kostenloses Konto anlegen
Lege ein kostenloses Hostilo-Konto an. Das dauert etwa eine Minute, ohne Kreditkarte. Wähle einen Namen für deine Website; daraus wird deine öffentliche Adresse, z. B. dein-name.hostilo.page.
Einfügen, speichern, live
Öffne den Editor, füge das HTML deines Artifacts ein und klicke auf Speichern. Deine Website ist sofort unter deiner Adresse live, mit kostenlosem HTTPS-Zertifikat. Keine claude.site-Hülle, keine Anthropic-Oberfläche: nur deine Seite im offenen Web.
Claude „Publish“ vs. echtes Hosting: Was ist der Unterschied?
| Claude „Publish“ | Echtes Hosting | |
|---|---|---|
| Adresse | claude.site/... (Domain von Anthropic) | Dein eigener Name / deine Domain |
| Wirkt wie | Eine Claude-Demo | Eine echte Website |
| Eigene Domain | Nein | Ja (in Bezahltarifen) |
| Kontaktformulare, Statistiken | Nein | Ja |
| Volle Kontrolle | Eingeschränkt | Ja, sie gehört dir |
Um einem Kollegen schnell eine Demo zu zeigen, reicht Publish in Claude. Für alles, was eine echte Website sein soll, etwas für die Visitenkarte oder für einen Kunden, brauchst du richtiges Hosting mit eigener Adresse.
Später bearbeiten und aktualisieren
Dein Artifact ist eine einzige eigenständige Datei, deshalb sind Änderungen einfach. Du willst etwas ändern? Zwei Wege: Code direkt im Hostilo-Editor bearbeiten und speichern, oder zurück zu Claude, um die Änderung bitten, die neue Version kopieren und über die alte einfügen. In beiden Fällen ist die Website sofort aktualisiert. Viele iterieren einfach in Claude und fügen neu ein; das ist die schnellste Schleife.
Bonus: Lass Claude (oder deinen KI-Agenten) veröffentlichen
Wenn du Claude regelmäßig nutzt, kannst du das Kopieren ganz weglassen: Füge https://hostilo.app/mcp als eigenen Connector hinzu, melde dich an und bitte Claude: „veröffentliche das als meine-seite“ (Anleitung in der Dokumentation). Nutzt du Cursor oder Windsurf, gibt es einen weiteren Weg ohne Handarbeit. Hostilo hat eine API für KI-Agenten, sodass dein Assistent Websites in deinem Namen veröffentlicht und aktualisiert: API-Schlüssel erzeugen, dem Agenten geben, und er deployt direkt. Du fasst das Dashboard nie an. Für die meisten reicht Kopieren und Einfügen, aber wer in KI-Coding-Tools lebt, schließt damit den Kreis komplett.
Bereit, deine KI-Website online zu stellen?
Füge deinen Code aus ChatGPT oder Claude ein, klicke auf Speichern und erhalte in Sekunden einen Live-Link mit HTTPS. Kostenlos starten, ohne Kreditkarte.
Website kostenlos veröffentlichen
