Mit KI eine Webseite erstellen – Mein Praxistest

Mein neuer Test, eine Webseite mit künstlicher Intelligenz zu bauen.. und endlich bin ich überzeugt. Vorab: Das hier wird kein…

Zurück zur Übersicht

Mein neuer Test, eine Webseite mit künstlicher Intelligenz zu bauen.. und endlich bin ich überzeugt.

Vorab: Das hier wird kein riesiger Vergleichstest aller KI Website Werkzeuge, die es da draußen gibt. Ich habe mir einen sehr beliebten KI Website Baukasten angeschaut, ihn kurz ausprobiert und mich dann recht schnell für eine Lösung entschieden, die deutlich professioneller und flexibler ist.

Ich gebe es ganz offen zu: Das war nicht mein erster Versuch. Seit etwa eineinhalb Jahren probiere ich immer mal wieder aus, Webseiten mit künstlicher Intelligenz zu erstellen. Doch bisher hat mich das Ergebnis nie überzeugt. Ich habe es dann jedes Mal frustriert bleiben lassen. Aber gestern hat sich das Blatt gewendet. Und zwar so nachhaltig, dass ich mich jetzt wieder intensiver mit dem Thema beschäftige.

10 beliebte KI Website Builder unter der Lupe

Falls Sie als Unternehmer oder Selbstständiger bisher wenig mit Technik oder Webseiten am Hut haben, wirken diese Tools oft wie eine Erlösung. Einfach ein paar Fragen beantworten, ein paar Klicks – und schon steht die Webseite. So zumindest das Versprechen.

Hier ein Überblick über zehn populäre KI Website Builder, die im deutschsprachigen Raum häufig genutzt werden, doch vorab erwähnt, ich entscheide mich für eine andere Lösung:

Wix ADI (Wix Artificial Design Intelligence)

Erstellt automatisiert Webseiten anhand von ein paar Fragen zu Branche und Stil. Einfacher Einstieg, viele Vorlagen.
https://www.wix.com

Hostinger AI Website Builder

Schneller Baukasten mit KI Texten und Bildvorschlägen. Besonders attraktiv durch geringe Einstiegskosten.
https://www.hostinger.de/website-builder

Jimdo Website Baukasten mit KI Unterstützung

Ein deutscher Anbieter, sehr einsteigerfreundlich, mit automatisierten Textvorschlägen.
https://www.jimdo.com

IONOS AI Website Builder

Ein großer deutscher Hosting Anbieter mit integriertem KI Website Generator und persönlichen Support Möglichkeiten.
https://www.ionos.de

GoDaddy KI Website Baukasten

Bekannt für Domains und Hosting, bietet inzwischen auch KI Funktionen für Inhalte und Design.
https://www.godaddy.com

Durable AI Website Generator

Erstellt komplette Webseiten in wenigen Sekunden, inklusive Texten und Struktur. Sehr schnelle Ergebnisse.
https://durable.co

Framer AI

Ideal für moderne, hochwertige Designs. Wird oft von Kreativen und Startups genutzt.
https://www.framer.com

Webflow mit AI Funktionen

Professionelles Werkzeug mit vielen Design Freiheiten. Die KI hilft beim Schreiben und Strukturieren.
https://www.webflow.com

Predis.ai Website Creator

Ein KI Tool, das vor allem für Marketing Inhalte bekannt ist, inzwischen aber auch Webseiten erstellen kann.
https://www.predis.ai

Bookmark AiDA

Die KI AiDA baut Webseiten, die sich später selbst weiter optimieren sollen.
https://www.bookmark.com

Vergleich in Tabellenform

Nachfolgend eine kleine Übersichtstabelle, die Ihnen einen schnellen Eindruck gibt. Die Tabelle kann auf kleinen Bildschirmen seitlich gescrollt werden.





Name Alleinstellungsmerkmale Einschränkungen Preise (von bis)
Wix ADI
  • Schneller Start
  • Viele Vorlagen
  • Viele Apps
Begrenzte Design Freiheit ca. 10 bis 35 € monatlich
Hostinger AI
  • Sehr günstig
  • Schnell eingerichtet
  • KI Texte
Eher einfache Designs ca. 3 bis 15 € monatlich
Jimdo
  • Deutscher Support
  • Sehr einfach
  • Schnelle Umsetzung
Wenig Individualität ca. 9 bis 39 € monatlich
IONOS
  • Deutscher Support
  • Viele Services
  • Domain inklusive
Kann schnell teurer werden ca. 12 bis 60 € monatlich
GoDaddy
  • All in One Lösung
  • Schnell startklar
  • Marketing Tools
Begrenzte Design Freiheit ca. 10 bis 30 € monatlich
Durable
  • Erstellt Webseiten in Sekunden
  • KI Texte
  • Sehr einfache Bedienung
Wenig Feinschliff ca. 12 bis 39 € monatlich
Framer AI
  • Sehr moderne Designs
  • Ideal für Branding
  • Flexibel
Braucht Einarbeitung ca. 5 bis 35 € monatlich
Webflow AI
  • Professionell
  • Volle Kontrolle
  • CMS integriert
Anspruchsvoll für Anfänger ca. 16 bis 45 € monatlich
Predis.ai
  • Marketing Fokus
  • Content KI
  • Schnell
Weniger Design Fokus ca. 10 bis 30 € monatlich
Bookmark AiDA
  • Selbst optimierend
  • Schnelle Ergebnisse
  • Einfach
Begrenzte Individualität ca. 10 bis 30 € monatlich

Warum diese Baukästen nichts für mich sind

Ich sage es ganz direkt: Mich stören die Abo Modelle. Ich möchte nicht für jede Funktion extra zahlen oder eingeschränkt werden. Viele dieser Dienste kosten am Anfang nur ein paar Euro, aber sobald man mehr möchte oder wächst, wird es teurer. Und kündigt man das Abo, ist die Webseite weg. Das fühlt sich an wie Mietvertrag statt Eigentum.

Ich möchte meine eigene Webseite besitzen. Ich möchte selbst entscheiden, wo meine Daten liegen, welche Funktionen ich nutze und welche Erweiterungen ich einbaue – ohne irgendwann von Preisänderungen überrascht zu werden. Genau deshalb sind diese Lösungen für mich persönlich nichts.

Das Werkzeug, das mich wirklich überzeugt hat

Jetzt kommt der spannende Teil. Die Lösung, für die ich mich entschieden habe, ist nicht das typische Baukasten Prinzip. Ich habe mich für ein Werkzeug entschieden, das ursprünglich für Programmierer entwickelt wurde: Claude Code.

Das klingt im ersten Moment vielleicht abschreckend, aber bleiben Sie noch einen Augenblick bei mir. Trotz seines Namens geht es darum, eine komplette Webseite zu erstellen, ohne selbst programmieren zu müssen.

Was man dafür braucht

Um Claude Code zu nutzen, braucht man einen kostenpflichtigen Zugang zu Claude. Danach benötigt man noch Node.js auf dem Computer, weil Claude Code auf JavaScript basiert. Im nächsten Schritt installiert man es über das Terminal. Zum angenehmen Arbeiten empfehle ich einen Code Editor. Ich nutze Visual Studio Code, das man hier findet:
https://code.visualstudio.com

Dort gibt es eine Erweiterung direkt von Anthropic, die man mit wenigen Klicks installiert. Anschließend startet man Claude Code in Visual Studio Code, erstellt einen Ordner und lässt Claude die benötigten Dateien erzeugen. In meinem Test waren das nur eine index.html, eine style.css und ein Ordner mit Bildern.

Ganz ehrlich: Dieser Einstiegsprozess schreckt jeden ab, der nichts mit Technik am Hut hat. Für jemanden, der sich aber ein bisschen zutraut, sich da durchzuarbeiten, ist es mit etwas Anleitung absolut machbar.

Wie ich die ersten Webseiten mit Claude Code erstellt habe

Ich habe Claude Schritt für Schritt gesagt, was ich haben möchte. Mehr nicht. Ein Beispiel:

„Erstelle einen Kopfbereich mit zwei Zeilen über die gesamte Breite. Oben links Telefonnummer und E Mail mit passenden Icons, oben rechts Social Media Icons. Darunter eine zweite Zeile mit Navigation.“

Oder:

„Erstelle drei Blöcke nebeneinander mit Hintergrundbildern. Fährt man mit der Maus darüber, erscheint eine Überschrift, die von unten nach oben sichtbar wird. Der Hintergrund wird beim Überfahren leicht abgedunkelt.“

Ich habe jedes Element als eigenen Auftrag beschrieben, Claude hat es umgesetzt. Zum Schluss habe ich gesagt, dass die Webseite bitte auf dem Handy und Tablet gut funktionieren soll. Auch das wurde umgesetzt. Texte habe ich von der KI schreiben lassen, das Design war erstmal zweitrangig. Mir ging es um die Funktionsweise. Und die hat mich überzeugt.

Das ist, was dabei rausgekommen ist. Wie gesagt, schauen Sie nicht so sehr auf das Design, sondern darauf, dass das Ganze nur 10 Minuten gedauert hat. Bitte anklicken zum Öffnen.

Im zweiten Test habe ich Claude gebeten, einen kleinen Onepager Webseite für ein Luxushotel zu erstellen. Ich habe nur eine Beispielseite als Vorlage erwähnt (ein eigenes Projekt, welches gerade in der Enstehung ist) und Claude den Ordner zugewiesen. Das Ergebnis war erstaunlich nah dran, obwohl ich kaum Anweisungen gegeben habe. Danach nur ein paar Änderungen durchgegeben, Bild eingefügt – fertig.

Hier gehts zur PDF, die ich als Vorlage verwendet habe. Hier zur generierten Seite (5 Minuten Arbeit inkl. nachträgliches Einfügen von Fotos.

Was mit Claude Code noch möglich ist

Webseiten sind nur der Anfang. Claude Code kann noch sehr viel mehr. Hier ein paar Beispiele:

• Einfache Buchungssysteme direkt in die Webseite integrieren
• Blogs erstellen, die sich automatisch mit relevanten Artikeln füllen
• Funktionen für Kundenbereiche entwickeln
• Newsletter Systeme oder kleine Mitgliederbereiche integrieren
• Online Shops erstellen und erweitern
• Formulare entwickeln, die Daten verarbeiten und speichern
• Datenbanken anlegen und darüber dynamische Inhalte ausgeben
• komplette Web Apps erstellen, nicht nur Webseiten

Ich habe manus.ai noch nicht getestet, aber es scheint ebenfalls eine Lösung zu sein, die sich eher an technisch versierte Nutzer richtet.

Mein Fazit

Für Anfänger ist Claude Code zu aufwendig. Die ersten Schritte sind ungewohnt und es dauert, bis man sich orientiert hat. Aber hat man die Struktur und Denkweise einmal verstanden, kann man in wenigen Minuten komplette Landingpages oder sogar mehrseitige Webseiten erstellen. Claude erstellt keine eigenen Bilder. Diese müsste man entweder selbst aufnehmen, über eine Bild KI erzeugen oder kaufen. Das Einfügen funktioniert allerdings fast automatisch.

Wer keine Technik Erfahrung hat, sollte mit einem klassischen Baukasten starten. Dort ist die Verbindung zwischen Domain und Webseite wesentlich einfacher, es gibt Vorlagen, Hilfen und man ist schnell online. Aber man zahlt meist deutlich mehr und muss sich auf Abo Modelle einlassen.

Für Profis, Entwickler oder technisch interessierte Menschen ist Claude Code eine wahre Freude. Auch manus.ai scheint eine spannende Lösung zu sein. Wer sich nicht davor scheut, einmal durch die Installation über die Kommandozeile zu gehen, wird mit einer Freiheit belohnt, die derzeit kaum ein Baukasten bieten kann.

Carsten Dülfer

Webdesign, KI, GEO

Was ist White-Label Webdesign?

Duis lobortis massa imperdiet quam. Cras risus ipsum, faucibus ut, ullamcorper id, varius ac, leo. In auctor lobortis lacus. Donec venenatis vulputate lorem. Morbi nec metus.

Nam at tortor in tellus interdum sagittis. Donec pede justo, fringilla vel, aliquet nec, vulputate eget, arcu. Lorem ipsum dolor sit amet, consectetuer adipiscing elit. In auctor lobortis lacus. Phasellus gravida semper nisi.

Fusce fermentum odio nec arcu. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Fusce fermentum. Nulla sit amet est. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum.