Viele Jahre lief meine Website auf WordPress. Ich kenne das System in- und auswendig. Trotzdem bin ich umgezogen.
Der wichtigste Grund war Zeit. Auch, wenn es KI-Automatisierungen gibt: WordPress bedeutet viel händische Arbeit. Abstände nachjustieren, auf dem Handy prüfen, wieder zurück. Für jede kleine Automatisierung kam ein weiteres Plugin dazu, mit eigenen Einstellungen und eigenen Updates. Diese Stunden wollte ich lieber in meine Kundenprojekte stecken.
Dazu kam der PageSpeed. Als SEO-Beraterin predige ich schnelle Seiten. Meine eigene sollte da vorne mitspielen. Er war gut, aber eben nicht sehr gut!
Und ich wollte mehr Freiheit. Eine Seite, die sich leicht pflegen lässt. Und in der ich umsetzen kann, was mir einfällt, statt mich nach einem Theme zu richten.
Deshalb habe ich mich entschieden, meine neue Website mit Claude Code zu bauen. Denn ich habe gerade ein Kundenprojekt umgesetzt und dort ist genau das passiert: Der PageSpeed ist in allen Bereichen von 60 auf 100 gestiegen, und neue Seiten lassen sich flexibel erstellen. Meine eigene Seite ist seit Oktober online.
Die eigentliche Arbeit beginnt vorher
Viele denken, mit KI drückt man auf einen Knopf, und die Website ist fertig. Bei mir stand am Anfang eine Menge Vorarbeit. Genau das ist die eigentliche Arbeit bei jeder Website. Je besser die Vorarbeit, desto besser die Website. Für die Vorarbeit bin ich folgendermaßen vorgegangen.
Design und Designvorlagen
Bevor eine Zeile Code entstand, ging es ums Aussehen. Ich habe aus meinem Design, das ich ja schon hatte, einen CI Guide erstellen lassen. Dabei sollte das Design übernommen werden. Ich mag mein Design. Wenn du noch gar kein Design hast, musst du hier starten.
Meinen CI Guide habe ich so gut wie möglich angepasst, damit keine Fehler reinkommen. Das zieht sich später durch alle Seiten. Allein für die Farben habe ich sechs Varianten nebeneinandergelegt, bevor ich mich entschieden habe. Am Ende stand ein Design-System mit 88 Bausteinen, aus denen sich jede Seite zusammensetzt.
Die Business DNA
Sie war meine größte Hilfe. Darin steht, wer ich bin, was ich anbiete und viele weitere Infos über mich als Freelancerin. Auch mein Tonfall, meine Farben und viele Kleinigkeiten sind dort festgehalten. Claude liest sie bei jeder Seite mit.
Arbeitsdateien für Claude
Dann habe ich Arbeitsanweisungen als .md-Dateien angelegt. Das sind einfache Textdateien, die Claude zu Beginn jeder Sitzung liest. Sie müssen alles enthalten, was Claude für die Arbeit braucht: den Ablauf, Schreibregeln, Design-Regeln und wie Seiten angelegt werden. Was dort fehlt, weiß Claude nicht, und dann rät es.
Dazu gehören auch SEO-Angaben, die ich gleich im Vorfeld definiere, und trotzdem ist ein Check im Nachhinein weiterhin wichtig.
Seite für Seite
Erst danach ging es ans Bauen. Claude hat das Design Seite für Seite umgesetzt, ich habe jede Seite angesehen und korrigiert. Für das reine Bauen brauchte Claude nicht lange. Korrekturen und Anpassungen sind trotzdem immer noch nötig.
Alles ins Git
Am Ende ging der komplette Code in ein privates GitHub-Repository. Dort liegt jede Version. Geht etwas schief, ist der alte Stand mit einem Schritt zurück. Backups mache ich auf drei Weisen. Aber das ist wohl eine andere Geschichte.
Erst auf eine geschützte Seite
Online ging die neue Website zuerst unter einer geschützten Adresse. Nur ich kam mit Passwort hinein. So konnte ich in Ruhe auf Handy und Desktop prüfen, während die alte Seite noch lief.
Server verbinden und live schalten
Zum Schluss habe ich den Server verbunden und die Seite auf meine Domain geschaltet. Das Kontaktformular wurde abgesichert, sodass alle Mails ankommen. Von den alten WordPress-Adressen führen Weiterleitungen auf die neuen Seiten. Sicherheits-Header und HSTS sorgen dafür, dass die Seite nur verschlüsselt ausgeliefert wird.
Auch das Rechtliche gehört dazu: Impressum und Datenschutzerklärung passend zur neuen Technik.
Fehler und was ich daraus gelernt habe
Claude arbeitet schnell und fleißig. Fehlt eine Information, füllt es die Lücke mit der wahrscheinlichsten Lösung. Das ist oft gut. Manchmal ist es genau daneben.
Man muss auch hier an alles denken und darauf achten, was Claude machen soll. Man muss vielleicht noch mehr als früher wissen, was wichtig ist.
Wenn ich das nicht gemacht hätte, wären folgende Punkte einfach passiert:
- Ein langweiliges Design: Den ersten Entwurf von Claude habe ich mit einem einzigen Wort kommentiert: „Langweilig.“ Erst danach wurde die Seite so, wie sie heute aussieht.
- Falsche URL-Strukturen: Es wurden für den Blog Slugs definiert. Die hat Claude zwischendurch einfach ignoriert. Wenn ich das nicht gesehen hätte, hätte ich alles weiterleiten müssen.
- Fünf Buttons in einem Blickfeld: Das wäre einfach zu viel. Macht Claude aber gerne mal. Heute hat jeder Button eine Aufgabe, und pro Bereich gibt es einen Hauptbutton.
- Häkchen-Listen auf jeder Seite: Es gab Seiten mit ausschließlich Listen, nach Listen. Claude neigt zur Wiederholung beim Design. Geht wahrscheinlich auch den einfachsten Weg.
- Hexagone überall: Das Sechseck aus meinem Logo tauchte plötzlich auf jeder Fläche auf.
- Texte voller Dreierlisten: KI liebt drei Punkte. Ich habe Claude beigebracht, wie ich schreibe, mit festen Regeln in der Business DNA.
- Ach, und so viele Kleinigkeiten.
Wie Claude und ich ein gutes Team wurden
Die Antwort ist unspektakulär. Claude hat das Handwerk erledigt und das Tempo gebracht. Ich habe Nein gesagt, sobald mir etwas nicht gefiel.
Ein Beispiel ist mein Button. Auf der alten Seite war er lachsfarben. Das war nie meine Farbe. Also haben Claude und ich ausprobiert: Brauntöne, Blautöne, alles nebeneinandergelegt und verglichen. Braun sah irgendwie traurig aus. Am Ende ist es Mint geworden, die Farbe aus meinem Logo.
Und manches geht mit Claude schlicht leichter. Fehler musste ich früher lange suchen. Jetzt ist es ein Dialog.
Auch die Details machen mir Freude. Kleine Spielereien sind in Nullkommanichts online. Meine Fehlerseite heißt „Gestrandet“ und zeigt eine Flaschenpost. Und in meiner robots.txt steht mein Logo aus Textzeichen, mit einem Gruß an die Crawler.
Und eine Website mit ChatGPT erstellen?
Ehrlich gesagt: Für meine Website habe ich nur Claude genutzt. ChatGPT habe ich dafür nicht getestet. Ein paar Unterschiede lassen sich trotzdem klar benennen.
Entscheidend ist weniger das Modell. Entscheidend ist, wo die KI arbeitet. Im normalen Chat schreibt ChatGPT dir Code, den du selbst in Dateien kopierst und hochlädst. Für eine einzelne Landingpage reicht das. Für eine Website mit vielen Seiten wird es schnell unübersichtlich.
Claude Code und Codex von OpenAI arbeiten dagegen direkt in deinem Projektordner. Sie legen Dateien an, ändern sie und testen sie. Das spart viel Kopierarbeit.
Die größere Rolle spielt ohnehin, was du der KI mitgibst. Mit einer klaren Business DNA und festen Regeln wird das Ergebnis mit beiden Werkzeugen besser.
Wird eine KI-Website bei Google gefunden?
Ja, wenn du es einbaust. Auf WordPress übernimmt ein Plugin wie Yoast vieles im Hintergrund. Bei einer selbst gebauten Seite gibt es dieses Plugin nicht. Title, Meta-Description und strukturierte Daten legst du für jede Seite selbst fest, oder du gibst Claude klare Regeln dafür.
Bei mir gehört das zum festen Ablauf für jede neue Seite. Ein eigenes Prüfskript nimmt mir dabei viel Arbeit ab. Die SEO prüfe ich trotzdem selbst, Seite für Seite. Claude setzt um, was du vorgibst. Ob Keyword, Title und Inhalt zusammenpassen, beurteilt am Ende jemand mit SEO-Erfahrung.
Ein Vorteil kommt von selbst: Die Seite ist schlank und lädt schnell. Und weil sie KI-Crawler ausdrücklich erlaubt, können auch ChatGPT und Co. meine Inhalte lesen.
Für wen lohnt sich eine Website mit Claude?
Für Selbstständige und kleine Unternehmen, die eine schnelle, schlanke Seite wollen und Inhalte häufig ändern. Updates und Plugins fallen weg, die Seite lädt schnell, und die Gestaltung ist frei.
WordPress ist weniger flexibel. Es reicht dir, wenn du nicht viel ändern musst und mit wenigen Seiten und wenigen Plugins auskommst. Für Shopseiten eignet sich Claude aktuell nur bedingt, die Umsetzung ist deutlich komplizierter.
Unterschätze das Bauen nicht. Lass es lieber machen, statt mittendrin abzubrechen. Du verbringst deine Zeit lieber mit deinem Business als mit Technik und Design? Dann melde dich bei mir.
Häufige Fragen
Kann ChatGPT eine komplette Website programmieren?
Den Code schreibt ChatGPT. Du musst prüfen. ChatGPT bereitet das Hochladen nach deinen Vorgaben vor. Am Ende entscheidest aber du über den Livegang.
Brauche ich Programmierkenntnisse, um eine Website mit Claude zu erstellen?
Für eine einfache Seite nicht. Hilfreich ist ein Grundverständnis davon, wie Websites online gehen. Sonst hängst du beim Hosting fest.
Wie flexibel ist eine KI-Website bei späteren Änderungen?
Sehr flexibel. Du beschreibst Claude die Änderung, Claude passt den Code oder Text nach deinen Wünschen an. Ein Editor zum Klicken wie bei WordPress fehlt allerdings.
Brauche ich bei einer KI-Website ein Impressum und eine Datenschutzerklärung?
Ja, genau wie bei jeder anderen Website.
Quiz: WordPress oder KI-Website?
Hilfreiches Material
- WordPress-Sicherheit: Mein ultimativer Rundum-Check: Für alle, die bei WordPress bleiben. Mit Selbst-Check in acht Punkten.
- Logbuch, mein Newsletter: Neue Artikel und Erfahrungen aus meinen Projekten direkt ins Postfach.
