Website bauen mit Claude

Die Schritt-für-Schritt-Anleitung für Windows

Drei Wege, eine Seite online zu bringen — vom Einfachsten bis zum Professionellsten.

Im letzten Beitrag habe ich gezeigt, wann eine Claude-generierte Website Sinn macht und wann WordPress die bessere Wahl ist. Jetzt wird’s praktisch.

Du willst eine Landingpage, einen One-Pager oder eine kleine Firmenwebsite bauen — mit Claude, auf Windows, ohne Informatikstudium. Hier sind drei Wege, sortiert nach Einstiegshürde.

Weg 1: Der Einfachste — Claude.ai + FileZilla

Für wen: Du hast bereits Webhosting (z.B. bei Hetzner, All-Inkl, Strato, IONOS oder Mittwald) und kennst FileZilla. Kein GitHub nötig. Kein Terminal nötig. Kein Claude Code nötig.

Was du brauchst:

• Ein Claude Pro-Abo (ca. 18 €/Monat) — das reicht für diesen Weg
• FileZilla (kostenlos)
• Deine FTP-Zugangsdaten vom Hoster
• Einen Texteditor (Notepad++ oder VS Code — kostenlos)

Schritt 1: Briefing schreiben

Öffne claude.ai im Browser. Formuliere dein Briefing so konkret wie möglich:

Erstelle eine komplette Landingpage als einzelne HTML-Datei mit eingebettetem CSS und JavaScript. Kein externes Framework, kein React, kein Node.js — nur eine einzige index.html-Datei, die ich direkt auf einen Webserver legen kann.

Unternehmen: [Dein Firmenname], [Branche], [Ort]
Ziel der Seite: [z.B. Kontaktanfragen generieren]
Zielgruppe: [z.B. Hausbesitzer in Ostholstein]
Abschnitte: [z.B. Hero mit Slogan, Leistungen, Über uns, Kontaktformular, Footer mit Impressum-Link]
Farben: [z.B. Dunkelblau #1a365d und Weiß]
Stil: [z.B. seriös, aufgeräumt, nicht verspielt]
Kontaktdaten: [Telefon, E-Mail, Adresse]

Das Kontaktformular soll per mailto: funktionieren (kein Backend nötig). Seite muss mobilfähig (responsive) sein. Bitte deutschsprachig.

Wichtig: Sag Claude explizit „eine einzige HTML-Datei“. Sonst generiert Claude gerne React-Projekte mit Build-Prozess — das willst du nicht, wenn du per FTP deployen willst.

Schritt 2: Code herunterladen

Claude zeigt dir die Seite als Artifact mit Live-Vorschau. Prüfe:

• Sieht das vernünftig aus?
• Stimmen die Texte?
• Funktioniert die mobile Ansicht? (Rechtsklick → Untersuchen → Mobilansicht im Browser)

Wenn ja: Klicke auf den Download-Button im Artifact. Du bekommst eine index.html-Datei.

Wenn nein: Sag Claude, was nicht passt. „Mach die Überschrift größer.“ „Tausche die Farbe des Headers.“ „Füge noch einen Abschnitt Referenzen ein.“ Iterate, bis es passt.

Schritt 3: Lokal testen

Doppelklicke die heruntergeladene index.html — sie öffnet sich im Browser. Was du siehst, ist das, was deine Besucher sehen werden. Teste:

• Links funktionieren?
• Bilder laden? (Falls du eigene Bilder eingebaut hast)
• Kontaktformular öffnet das Mailprogramm?
• Text fehlerfrei?

Schritt 4: Impressum und Datenschutz ergänzen

Nicht vergessen. Lass Claude auf Nachfrage eine Impressum- und eine Datenschutzseite generieren (als separate HTML-Dateien oder als Abschnitt auf der Seite). Prüfe die Texte selbst oder lass sie von einem Dienstleister wie eRecht24 oder IT-Recht Kanzlei generieren — Claude-Texte sind ein Ausgangspunkt, keine Rechtsberatung.

Schritt 5: Per FileZilla hochladen

1. Öffne FileZilla
2. Verbinde dich mit deinem Hoster (Server, Benutzername, Passwort, Port 21 oder SFTP Port 22)
3. Navigiere auf dem Server zum richtigen Verzeichnis (oft /htdocs/, /html/ oder /public_html/ — bei einer Subdomain z.B. /landingpage.deinedomain.de/)
4. Ziehe deine index.html (und ggf. impressum.html, datenschutz.html, Bilder) in das Verzeichnis
5. Fertig. Deine Seite ist online.

Update? Ändere die Datei lokal (oder lass Claude sie anpassen), lade sie erneut hoch. Überschreibt die alte Version.

Vorteile dieses Wegs

• Null Infrastruktur-Aufbau — du nutzt, was du schon hast
• Kein GitHub, kein Vercel, kein Terminal
• Eine Datei, ein Upload, fertig
• Du verstehst, was da liegt: eine HTML-Datei auf deinem Server

Nachteile

• Jede Änderung braucht einen neuen Claude-Dialog + FTP-Upload
• Kein CMS — kein Dashboard zum Bearbeiten
• Für komplexere Seiten (mehrere Unterseiten, Blog) wird es unhandlich
• Kontaktformulare mit mailto: wirken unprofessionell — für echte Formulare brauchst du einen Dienst wie Formspree oder einen PHP-Mailer auf dem Server

Weg 2: Der Profi-Weg — Claude Code auf Windows

Für wen: Du willst mehr als eine einzelne HTML-Datei. Mehrere Seiten, ein Framework, automatisches Deployment. Du scheust dich nicht vor der Kommandozeile.

Was du brauchst:

• Claude Pro- oder Max-Abo (Claude Code ist ab Pro verfügbar)
• Git für Windows (kostenlos, von git-scm.com)
• Einen GitHub-Account (kostenlos)
• Optional: VS Code (kostenlos)

Installation Claude Code auf Windows

1. Git für Windows installieren — lade es von git-scm.com herunter. Standard-Einstellungen beibehalten, wichtig: „Add Git to PATH“ muss aktiviert bleiben (ist es standardmäßig)
2. PowerShell öffnen — Rechtsklick auf Start → „Terminal“ oder „Windows PowerShell“. Kein Admin-Recht nötig.
3. Installationsbefehl ausführen:

irm https://claude.ai/install.ps1 | iex

4. Terminal schließen und neu öffnen — damit der PATH aktualisiert wird
5. Prüfen:

claude --version

6. Anmelden — beim ersten Start von claude öffnet sich der Browser zur Authentifizierung

Website bauen

1. Projektordner erstellen und hineinwechseln:

mkdir C:\Projekte\meine-website
cd C:\Projekte\meine-website

2. Claude Code starten:

claude

3. Briefing eingeben — ähnlich wie bei Weg 1, aber jetzt kannst du mehr verlangen:

Erstelle eine statische Website für mein Unternehmen [Name]. Verwende einfaches HTML und CSS, kein Framework. Strukturiere die Seite in mehrere Dateien: index.html, leistungen.html, ueber-uns.html, kontakt.html, impressum.html, datenschutz.html. Gemeinsames CSS in einer style.css. Die Seite muss responsive sein und ohne Build-Schritt direkt auf einen Webserver kopiert werden können.

Oder — wenn du dir mehr zutraust:

Erstelle eine Website mit Astro als Static Site Generator. Ziel: maximale Ladegeschwindigkeit, saubere Struktur, einfach zu erweitern.

4. Claude baut — erstellt alle Dateien in deinem Projektordner. Du kannst den Fortschritt im Terminal verfolgen.
5. Lokal testen — Claude startet auf Nachfrage einen lokalen Entwicklungsserver:

Starte einen lokalen Webserver, damit ich die Seite im Browser testen kann.

Deployment: Zwei Optionen

Option A: Per FileZilla (wie Weg 1)

Die fertigen Dateien liegen im Projektordner. Kopiere sie per FTP auf deinen Server. Fertig.

Bei Astro oder einem anderen Static Site Generator musst du vorher einmal bauen:

npm run build

Die fertige Seite liegt dann im dist/-Ordner — den Inhalt per FTP hochladen.

Option B: Per GitHub + Vercel/Netlify (automatisches Deployment)

1. Sag Claude:

Initialisiere ein Git-Repository, erstelle ein GitHub-Repository namens „meine-website“ und pushe den Code.

2. Claude führt die Git-Befehle aus (mit deiner Genehmigung)
3. Gehe zu vercel.com, melde dich mit deinem GitHub-Account an
4. Importiere das Repository — Vercel erkennt die Konfiguration automatisch
5. Jedes Mal, wenn du Änderungen pushst, wird die Seite automatisch neu deployed

Weg 3: Der WordPress-Weg — Claude Cowork + LocalWP

Für wen: Du nutzt schon LocalWP (oder WordPress Studio) und willst eine vollwertige WordPress-Seite — aber schneller als von Hand.

Dieser Weg ist relativ neu: Automattic (die Firma hinter WordPress.com) hat im Februar 2026 ein Cowork-Plugin veröffentlicht, das Claude direkt mit WordPress verbindet.

Was du brauchst:

• Claude Max-Abo (Cowork braucht Max oder mindestens Pro)
• Claude Desktop App (aktuellste Version)
• LocalWP oder WordPress Studio (kostenlos)
• Optional: WP-CLI

Variante A: Das Automattic-Plugin (experimentell)

1. WordPress Studio installieren (von developer.wordpress.com/studio/) — oder du nutzt dein bestehendes LocalWP
2. Claude Desktop aktualisieren und Cowork öffnen
3. Plugin installieren: In Cowork → Plugins → „Add to marketplace from GitHub“ → URL eingeben:

https://github.com/Automattic/wordpress-agent-skills

4. Befehl ausführen: /create-site und beschreiben, was du willst:

Eine Website für mein Beratungsunternehmen. Seriöses Design, dunkelblau, Seiten: Startseite, Leistungen, Über mich, Kontakt. Zielgruppe: Geschäftsführer kleiner Unternehmen.

Claude erstellt ein komplettes WordPress Block-Theme und deployed es in deine lokale WordPress-Installation.

Achtung: Das ist ein Developer Preview — es funktioniert nicht immer sauber. Aber die Richtung stimmt.

Variante B: Claude als Content-Helfer für dein bestehendes WordPress

Der pragmatischere Weg, wenn du LocalWP schon nutzt: Verwende Claude nicht zum Bauen der Seite selbst, sondern als Turbo für den Content.

1. Seite in LocalWP aufsetzen — Theme auswählen, Grundstruktur anlegen (Seiten, Menü)
2. Claude für Texte nutzen — lass Claude in claude.ai die Texte für jede Seite generieren. Konkretes Briefing pro Seite:

Schreibe den Text für die Startseite meiner Website. Unternehmen: [Name], Branche: [X], Zielgruppe: [Y]. Tonalität: sachlich, direkt, norddeutsch trocken. Der Text soll in WordPress-Gutenberg-Blöcke passen: Hero-Überschrift, Einleitungstext, drei Leistungsboxen, Testimonial-Bereich, CTA.

3. Texte in WordPress einfügen — Copy/Paste in den Gutenberg-Editor
4. Live schalten — per LocalWP-Connect, per Hosting-Migration oder per Export/Import

Welchen Weg nehmen?

Kriterium	Weg 1: Claude.ai + FileZilla	Weg 2: Claude Code	Weg 3: Cowork + LocalWP
Technische Hürde	Niedrig	Mittel	Mittel
Ergebnis	Einzelne Landingpage	Statische Website (mehrere Seiten)	Vollwertige WordPress-Seite
Content-Pflege danach	Per Claude + FTP	Per Claude Code + FTP/Git	Per WordPress-Dashboard
Kosten	~18 €/Monat (Claude Pro) + bestehendes Hosting	~18 €/Monat + Hosting	~18–90 €/Monat + Hosting
Für wen ideal	Schnelle Landingpage, wenig Änderungen	Entwickler, die statisch bleiben wollen	Langfristige Website mit CMS

Meine Empfehlung für KMU

Starte mit Weg 1, wenn du einfach schnell etwas online haben willst. Eine saubere Landingpage per claude.ai generieren, per FileZilla hochladen — das dauert keine Stunde und du brauchst null neue Tools.

Wechsle auf Weg 3, wenn du merkst, dass du regelmäßig Inhalte ändern willst. WordPress ist und bleibt das richtige Werkzeug, wenn du deine Website selbst pflegen willst — ohne bei jeder Textänderung einen KI-Dialog zu starten.

Weg 2 ist der Weg für Leute, die gerne im Terminal arbeiten und die volle Kontrolle über den Code wollen. Für die meisten KMU-Inhaber ist er Overkill.

Und egal welchen Weg du nimmst: Struktur vor KI. Erst klären, was die Seite tun soll. Dann bauen.

Du willst eine Website, bist dir aber nicht sicher, welcher Weg für dich passt? Meld dich — ich helfe dir bei der Einordnung, bevor du anfängst. [Kontakt aufnehmen →]

PS: WordPress 7.0 und MCP — warum sich WordPress gerade neu erfindet

Während du diese Anleitung liest, passiert im Hintergrund etwas Größeres: WordPress 7.0 (geplant für April 2026) bringt native Unterstützung für das Model Context Protocol (MCP) mit — den Standard, über den KI-Tools wie Claude mit externen Systemen kommunizieren.

Was heißt das konkret? Du kannst Claude direkt mit deiner WordPress-Seite verbinden. Nicht über Copy/Paste, nicht über Export/Import — sondern live. Claude kann dann:

• Beiträge erstellen, bearbeiten und veröffentlichen
• Seiten und Custom Post Types verwalten
• Kategorien und Tags pflegen
• Plugin-Einstellungen auslesen
• WooCommerce-Bestellungen abfragen

Die Grundlage dafür ist die Abilities API (eingeführt in WordPress 6.9) und der MCP Adapter — ein offizielles Paket der WordPress-Community. Für WordPress.com-Seiten funktioniert das bereits heute über OAuth 2.1. Für selbst gehostete Seiten (also die meisten KMU-Installationen) läuft die Authentifizierung aktuell über Application Passwords oder JWT-Tokens.

Das ist der eigentliche Grund, warum ich für die meisten KMU weiterhin WordPress empfehle: WordPress steht nicht still. Es wird gerade zum KI-fähigsten CMS überhaupt. Die Kombination aus einem bewährten CMS, das du selbst pflegen kannst, und einer KI-Schnittstelle, über die Claude dir bei der Content-Erstellung hilft — das ist stärker als jede rein statische Seite.