Eine Website in 3 Stunden

Mein neuestes Website-Projekt ist mehr aus Interesse entstanden und nicht aufgrund eines konkreten Auftrags. Bereits 2013 habe ich für die selbstständige Bilanzbuchhalterin Manuela Fodroczi eine simple Webseite gemacht – damals im Anschluss an einen HTML-Kurs als simple HTML-Seite (ohne CMS im Hintergrund).

Das alles sollte möglichst zeitschonend passieren. Es gab ja keinen konkreten Auftrag dafür. Doch ich hatte große Lust darauf, eine HTML-Website komplett von der KI programmieren zu lassen. Das war der Startschuss für ein besonderes 3-Stunden-Projekt.

Meine 10 Schritte bis zum Go Live

Erledigt habe ich all diese Schritte in weniger als 140 Minuten mit Claude, der KI von Anthropic.

1. Recherche: Was ist alles da? Was wissen wir? Dazu habe ich unter anderem die frühere Version der Website sowie einen Print-Flyer hochgeladen.
2. Entwicklung der Sitemap: Wie sieht die Struktur der neuen Seite? Den Vorschlag von Claude habe ich direkt übernommen.
3. Entwürfe: Wie könnte die Seite aussehen? Welche Elemente gibt es? Die ersten Vorschläge haben mich nicht überzeugt, mit Referenzseiten kam ich schneller zum Ergebnis.
4. Überarbeitung der Designs: Was müssen wir noch ändern? Der einzige Punkt, an dem ich selbst aktiv wurde: Ich habe Header- und Footer-Bereich auf Basis der ersten Entwürfe in Photoshop nachbearbeitet und diese Mockups hochgeladen.
5. Textierung: Was kommt wo hin? Wo fehlen Infos? Die Texte bin ich kurz überflogen und habe Änderungen direkt im Chat zurückgegeben.
6. Testing: Was funktioniert noch nicht? Was sieht nicht perfekt aus? Dabei ging’s vor allem um das Verhalten von Verlinkungen, Akkordeons, Schriftgrößen oder Abständen. Als menschlicher User (und jemand, der schon mehrere Seiten gemacht hat) habe ich einfach das bessere Gespür.
7. Überarbeitung durch Kundin: Gefällt dir die Seite? Was sagst du zu den Texten? Die Änderungen habe ich als Word-File bekommen und direkt in der KI hochgeladen.
8. Freigabe: Passt’s jetzt? Nach dem GO waren es nur mehr wenige Schritte.
9. GEO & SEO-Check: Haben wir an die technischen Basics gedacht? Müssen wir Weiterleitungen für die alten URLs einrichten? Mit einem Prompt und einer neuen HTML-Version war auch das erledigt.
10. Upload des HTML-Files samt Bildern via FTP: Hat’s funktioniert? Ja – die neue Seite ist online.

Meine drei wichtigsten Learnings bei diesem Web-Projekt mit der KI

1. Die Schnelligkeit, in der Claude erste brauchbare Ergebnisse lieferte, hat mich absolut überrascht. Die Seite hat von Beginn an funktioniert und hat keine Fehlermeldungen produziert.
2. Etwas überfordert war der KI-Agent jedoch mit dem Design. Vielleicht lag das aber auch daran, dass ich ziemlich konkrete Vorstellungen hatte, wie die Seite aussehen sollte und welches Feeling wir vermitteln wollten. Als ich die fertigen Mockups hochgeladen habe, hat Claude diese 1:1 in HTML nachgebaut (nächster „Wow“-Effekt).
3. Die technischen Basics waren einfach da: Von Alt-Tags bis zu Sprungmarken, von passenden Verlinkungen bis zum Einsatz von Schema.org-Types – Claude beherrscht sie alle.

Fazit: Für statische One-Pager kann ich diesen Weg absolut empfehlen – zeiteffizient mit einem super Ergebnis. Hätte ich die Seite selbst in HTML oder über ein WordPress-Template programmiert, hätte ich wohl deutlich mehr Überarbeitungen gebraucht. Wer ebenfalls eine schnelle, günstige One-Pager-Lösung braucht, kann sich jederzeit bei mir melden.

Das habe ich gemacht

• Prompting mit Claude inkl. Feedback-Schleifen
• Mockup des Seiten-Headers als Grundlage für das Design
• Abstimmung mit Kundin, textliche Änderungen und Freigabeprozess
• Go Live der neuen Version von www.fodro.at