Ratgeber

Website mit KI erstellen: Vom ersten Prompt zur Live-Seite

Um mit KI eine Website zu erstellen, schreibst du auf, wofür die Seite da ist und welche Seiten sie braucht, beschreibst das einem KI-Website- oder App-Builder in ein paar einfachen Sätzen und lässt eine erste Version erzeugen, die du in einer Live-Vorschau siehst. Danach korrigierst du die Texte, prüfst alles auf dem Handy, ergänzt die SEO-Grundlagen und veröffentlichst die Seite auf einer Domain. Die meisten kleinen Websites – eine Firmenseite, ein Portfolio, eine Landingpage, ein einfacher Blog – gehen in einer einzigen Sitzung von der Idee bis online.

Was für eine Website baust du?

„Website“ umfasst sehr unterschiedliche Dinge, und die Art, die du wählst, bestimmt, was du anforderst:

Website-TypSeiten, die meist nötig sindBraucht eine Datenbank?
LandingpageEine lange Seite: Hero, Vorteile, Belege, FAQ, Call-to-ActionNur, wenn sie Anmeldungen sammelt
Website für kleine UnternehmenStart, Leistungen, Über uns, Kontakt, vielleicht PreiseNur für Formulare oder Buchungen
PortfolioStart, Arbeitsproben-Raster, Projektseiten, Über mich, KontaktSelten
Blog oder Content-SeiteStart, Artikelliste, Artikelseiten, KategorienOft, oder Markdown-Dateien
Website mit App-FunktionenEine der obigen plus Login, Buchungen, Bestellungen oder DashboardJa

Wenn deine in der letzten Zeile steht, baust du eigentlich eine Web-App mit Marketing-Vorderseite. Das ist in Ordnung – KI-App-Builder können beides –, aber plane den App-Teil getrennt; unser Guide App mit KI erstellen behandelt ihn.

KI-Website-Builder, Vorlagen und KI-App-Builder im Vergleich

Es gibt drei gängige Wege, und jeder passt zu jemand anderem.

  • Template-basierte Builder mit KI-Funktionen (Wix, Squarespace, Framer und ähnliche). Du startest mit einer fertig gestalteten Vorlage und bearbeitest sie visuell; die KI hilft beim Texten oder schlägt ein Layout vor. Sie sind gut, wenn du ein bewährtes Design, einen visuellen Editor und eingebaute Extras wie einen Blog oder ein Terminbuchungs-Widget willst.
  • KI-App-Builder (Mythex, Lovable, Bolt und andere). Du beschreibst die Seite im Chat, die KI schreibt den Code von Grund auf und führt ihn in einer Live-Vorschau aus. Sie sind gut, wenn du etwas Maßgeschneidertes willst, Änderungen lieber per Gespräch als per Drag-and-drop machst oder später App-Funktionen ergänzen möchtest.
  • Von Hand gebaute oder Agentur-Websites. Weiterhin die richtige Wahl für große Seiten mit komplexen Content-Abläufen, strengen Markenvorgaben oder rechtlicher Prüfung jeder Seite.

Einen direkten Vergleich konkreter Tools findest du in den besten KI-Website-Buildern.

Schritt 1: Die Website auf einer Seite planen

Bevor du ein Tool öffnest, beantworte diese fünf Fragen. Das dauert zehn Minuten und spart Stunden an Hin und Her:

  1. Wer ist der Besucher, und was soll er tun? „Hausbesitzer vor Ort, die für ein Angebot anrufen sollen“ ist ein Plan. „Alle“ nicht.
  2. Welche Seiten gibt es? Liste sie auf. Die meisten kleinen Websites brauchen vier oder fünf.
  3. Was steht auf jeder Seite? Ein bis zwei Zeilen je Seite: „Leistungen: drei Leistungen mit kurzer Beschreibung und Startpreis.“
  4. Was ist echt? Sammle deinen tatsächlichen Firmennamen, Leistungen, Preise, Adresse, Öffnungszeiten, Fotos und Kundenstimmen, die du verwenden darfst. Für alles, was du nicht lieferst, erfindet die KI Platzhalter.
  5. Wie soll es wirken? Zwei oder drei Wörter („ruhig, aufgeräumt, viel Weißraum“) oder der Link zu einer Seite, die dir gefällt.

Schritt 2: Den ersten Prompt schreiben

Ein guter erster Prompt beschreibt das Unternehmen und die Seiten, nicht den Code:

Erstelle eine Website für Harbor Physio, eine Physiotherapiepraxis in einer kleinen Küstenstadt. Seiten: Start (Hero mit Button „Termin zur Untersuchung buchen“, drei Gründe für uns, kurzer Bereich mit Kundenstimmen), Leistungen (Sportverletzungen, Rückenschmerzen, Reha nach Operationen – jeweils mit einem Absatz und der Sitzungsdauer), Über uns (die zwei Physiotherapeuten, mit Platzhaltern für Fotos) und Kontakt (Adresse, Öffnungszeiten, Telefon und ein Kontaktformular). Ruhiger, aufgeräumter Look mit sanftem Blau als Akzent. Mobile-first. Verwende glaubwürdig klingende Texte, kein Lorem ipsum, und erfinde keine Bewertungen oder Auszeichnungen.

Der letzte Satz ist wichtig. KI-Tools füllen leere Flächen gern mit erfundenen Kundenstimmen, Bannern wie „10.000 Kunden vertrauen uns“ oder falschen Auszeichnungen. Sag ihr, dass sie das lassen soll, und prüfe es trotzdem.

Wenn du schon ein Logo, Markenfarben oder einen Screenshot einer Seite hast, die dir gefällt, hänge ihn an. Weitere Muster findest du unter Prompts für KI-App-Builder schreiben.

Schritt 3: Wie ein Besucher prüfen

Wenn die erste Version erscheint, fang nicht mit Schriftarten an. Geh sie so durch, wie es dein Besucher tun würde:

  • Verstehst du innerhalb von fünf Sekunden, was das Unternehmen macht?
  • Ist der Hauptbutton offensichtlich, und führt er irgendwohin?
  • Existiert jede Seite im Menü und ist richtig verlinkt?
  • Wechsle auf die Handy-Ansicht. Die meisten Besucher kommen mit dem Handy, und dort fallen gequetschter Text und riesige Bilder auf.

Ändere dann immer nur eine Sache. „Mach die Hero-Überschrift kürzer und setze die Telefonnummer in den Header“ liefert ein besseres Ergebnis als „mach es besser“. Geht eine Änderung schief, geh zu einer früheren Version zurück, statt dich herauszureden.

Schritt 4: Platzhalter durch echte Inhalte ersetzen

Der erste Entwurf enthält Platzhalterbilder und allgemeine Sätze. Arbeite Seite für Seite:

  • Texte. Füge deine echten Leistungsbeschreibungen, Preise und Zeiten ein. Lass die KI sie straffen, aber die Fakten bleiben deine.
  • Bilder. Lade wenn möglich eigene Fotos hoch. Stockfotos gehen als Hintergrund, echte Fotos deiner Arbeit, deines Teams oder deiner Räume schaffen mehr Vertrauen.
  • Belege. Verwende nur Kundenstimmen, Logos und Zahlen, die du belegen kannst.
  • Rechtstexte. Wenn du über ein Formular personenbezogene Daten erhebst, brauchst du meist eine Datenschutzerklärung. Lass dir von der KI eine Seite erstellen und prüfe sie anhand der Regeln, die dort gelten, wo du tätig bist – eine generierte Erklärung ist ein Ausgangspunkt, keine Rechtsberatung.

Schritt 5: Formulare, Buchungen und andere „App“-Teile

Ein Kontaktformular braucht ein Ziel für die Einsendungen. Die Optionen, vom einfachsten zum aufwendigsten:

OptionSo funktioniert esNachteil
Mailto-Link oder TelefonnummerDas E-Mail-Programm des Besuchers öffnet sichKein Einrichtungsaufwand, aber keine Übersicht über Anfragen
Formular mit Speicherung in einer DatenbankEinsendungen werden gespeichert und auf einer privaten Seite angezeigtDu musst die Liste im Blick behalten
Formular, das dir eine E-Mail schicktNutzt einen E-Mail-Anbieter wie Resend oder PostmarkBraucht einen API-Schlüssel und eine verifizierte Absenderdomain
Eingebettetes Drittanbieter-ToolEin Buchungs- oder Newsletter-Widget eines anderen DienstesSchnell, aber Look und Daten liegen woanders

Wenn du echte Buchungen oder Zahlungen brauchst, siehe Buchungs-App bauen und Zahlungen in deine App einbauen.

Schritt 6: SEO-Grundlagen, bevor du die Seite teilst

Eine KI kann eine wunderschöne Seite schreiben, die Suchmaschinen kaum verstehen. Verlange vor dem Launch:

  • Einen eindeutigen Titel und eine Meta-Beschreibung auf jeder Seite
  • Eine klare Hauptüberschrift pro Seite, mit sinnvollen Unterüberschriften
  • Aussagekräftige Alt-Texte bei Bildern
  • Open-Graph-Tags, damit Links in sozialen Netzwerken oder Nachrichten richtig aussehen
  • Eine Sitemap und eine robots-Datei

Ein technischer Punkt ist wissenswert. Viele KI-Builder erzeugen Single-Page-Apps, bei denen der Browser die Seite mit JavaScript aufbaut. Suchmaschinen können sie indexieren, aber statisches oder serverseitig gerendertes HTML ist für Seiten, die ranken sollen, verlässlicher. Wenn Suchtraffic wichtig ist, bitte um eine statische Website oder ein Framework, das Seiten auf dem Server rendert. Unser Guide zu SEO für KI-gebaute Websites geht tiefer.

Schritt 7: Veröffentlichen und eine Domain verbinden

Beim Veröffentlichen wird aus der Vorschau eine öffentliche Website. Die meisten Builder geben dir zuerst eine kostenlose Subdomain, die zum Testen und Teilen mit Freunden reicht. Für ein Unternehmen verbindest du deine eigene Domain: Entweder kaufst du eine über den Builder, oder du richtest eine bereits vorhandene Domain per DNS-Eintrag auf die Seite. Eigene Domain verbinden führt dich durch den DNS-Teil.

Richte nach dem Launch ein kostenloses Google-Search-Console-Konto ein, um zu sehen, ob deine Seiten indexiert werden.

Häufige Fehler

  • Alles auf einmal verlangen. Zwölf Seiten, ein Blog, ein Shop und ein Mitgliederbereich in einem Prompt ergeben von allem eine oberflächliche Version. Baue zuerst die Kernseiten.
  • Platzhaltertext veröffentlichen. Suche vor dem Livegang auf jeder Seite nach „Lorem“, „Ihr Unternehmen“ und erfundenen Zahlen.
  • Mobile ignorieren. Prüfe jede Seite in Handybreite, nicht nur die Startseite.
  • Den Call-to-Action vage lassen. Jede Seite sollte den nächsten Schritt klar machen: anrufen, buchen, kaufen oder Kontakt aufnehmen.
  • Vergessen, wer die Seite pflegt. Wenn jemand anderes sie wöchentlich bearbeitet, muss er das können – entweder per Chat im selben Builder oder mit einem Tool mit visuellem Editor.

Was es kostet

Eine einfache, mit KI gebaute Website kostet meist weit weniger als eine gestaltete und programmierte. Diese laufenden Kosten solltest du einplanen:

  • Der Builder. Die meisten haben einen Gratis-Tarif zum Ausprobieren und einen Bezahltarif für eigene Domains und mehr Nutzung.
  • Hosting. Manchmal im Tarif enthalten, manchmal nutzungsabhängig.
  • Ein Domainname. Eine jährliche Registrierungsgebühr, die vom Namen und der Endung abhängt.
  • Extras. Ein E-Mail-Anbieter für Formularbenachrichtigungen oder kostenpflichtige Tools für Buchungen oder Newsletter.

Wann ein Website-Baukasten die bessere Wahl ist

Sei ehrlich, was du brauchst. Wenn du eine klassische Visitenkarten-Website, einen visuellen Editor für einen technisch weniger versierten Kollegen, einen eingebauten Blog mit Zeitplanung oder einen Onlineshop willst, bei dem Lager und Versand erledigt sind, kann dir ein Template-Baukasten oder eine spezialisierte Plattform wie Shopify besser dienen als jeder KI-generierte Code. KI-App-Builder ziehen vorbei, wenn die Seite ungewöhnlich ist, sich oft ändert oder die Eingangstür zu etwas ist, das sich wie eine App verhält.

Mit Mythex bauen

Mythex ist ein KI-App-Builder, und Websites gehören zu dem, was Leute damit am häufigsten bauen. Du beschreibst die Seite, Mythex baut sie in einer Live-Vorschau (auch in Handygröße), und du veröffentlichst unter einer Adresse yourname.mythex.app; in Pro kannst du in Mythex eine Domain kaufen oder eine eigene verbinden. Wenn Suchrankings wichtig sind, kannst du statt der Standard-React-App eine einfache statische Website anfordern – siehe die Dokumentation zu statischen Websites und SEO für deine veröffentlichte App.

Mythex ist kein CMS: Es gibt keinen separaten Editor-Login für ein Marketing-Team, Änderungen machst du also per Chat mit dem Builder oder durch Bearbeiten des Codes. Um die leere Seite zu überspringen, starte mit einer der Website-Vorlagen oder Portfolio-Vorlagen; jede öffnet ein neues Projekt mit ausgefülltem Start-Prompt.

Fragen

Kann KI eine ganze Website für mich bauen?

Ja. Ein KI-Website- oder App-Builder kann aus einer schriftlichen Beschreibung eine komplette mehrseitige Website erzeugen, einschließlich Layout, Texten, Bildern und Kontaktformular. Die Fakten zu deinem Unternehmen musst du trotzdem liefern, und du solltest jede Seite prüfen, bevor du veröffentlichst.

Ist eine mit KI gebaute Website gut für SEO?

Sie kann es sein, aber nicht automatisch. Jede Seite braucht einen eindeutigen Titel und eine Beschreibung, echte Überschriften und echte Inhalte sowie eine Seite, die für Suchmaschinen gut darstellbar ist; verlange das ausdrücklich und prüfe es vor dem Launch.

Muss ich HTML können, um mit KI eine Website zu bauen?

Nein. Du beschreibst in einfacher Sprache, was du willst, und die KI schreibt den Code. Ein paar Begriffe – Seite, Abschnitt, Formular, Domain – machen deine Anfragen klarer, aber HTML musst du nie selbst schreiben.

Sollte ich eine Vorlage oder einen KI-Website-Builder nutzen?

Nimm einen Template-Baukasten, wenn du ein bewährtes Design und einen visuellen Editor willst, den andere später bedienen können. Nimm einen KI-Builder, wenn du schnell etwas Maßgeschneidertes brauchst oder eine Website, die auch App-Funktionen wie Buchungen, Logins oder eine Datenbank braucht.

Mythex · Pricing · Alles mit KI bauen · Vorlagen für Websites und Apps · Mythex im Vergleich · Glossar zum App-Bau mit KI · Kostenlose Tools für den App-Bau mit KI · English

English አማርኛ العربية Български বাংলা Bosanski Català Čeština Dansk Ελληνικά Español Español (España) Eesti فارسی Suomi Français Français (Canada) ગુજરાતી हिन्दी Hrvatski Magyar Հայերեն Bahasa Indonesia Íslenska Italiano 日本語 ქართული Қазақ тілі ಕನ್ನಡ 한국어 Lietuvių Latviešu Македонски മലയാളം Монгол मराठी Bahasa Melayu မြန်မာ Norsk bokmål Nederlands ਪੰਜਾਬੀ Polski Português (Brasil) Português (Portugal) Română Русский Slovenčina Slovenščina Soomaali Shqip Srpski Svenska Kiswahili தமிழ் తెలుగు ไทย Tagalog Türkçe Українська اردو Tiếng Việt 简体中文 繁體中文(香港) 繁體中文(台灣)