Dein KI-Webseitenentwurf steht. Wie wird daraus eine fertige Website?

1. Erst klären: Was hat dir die KI eigentlich geliefert?

„Ich habe eine Website“ kann sehr Unterschiedliches bedeuten. Ein Bild zeigt eine Gestaltungsidee. Eine interaktive Vorschau kann nur innerhalb eines bestimmten Dienstes funktionieren. Ein ZIP-Download enthält möglicherweise fertige Seiten – oder Quellcode, aus dem erst noch eine Website gebaut werden muss.

Bitte um das vollständige Projekt, eine Start- und Build-Anleitung, die verwendeten Versionen sowie eine Liste externer Dienste und benötigter Umgebungsvariablen. Zugangsschlüssel gehören nicht in öffentliche Dateien. Ein Ordner mit fertigen Ausgabedateien ist außerdem kein vollständiger Ersatz für den bearbeitbaren Quellcode.

2. Entscheiden, wie du die Website später pflegst

Die wichtigste Frage lautet: Wer ändert nach dem Start Texte, Bilder, Öffnungszeiten und neue Projekte? Dateien haben nicht automatisch eine Bearbeitungsoberfläche. Wenn du einen Text ändern möchtest, kann bei einer rein statischen Umsetzung eine Codeänderung mit neuem Build und Upload nötig sein.

Ein CMS lässt sich nachträglich ergänzen, aber nicht immer mit einem Klick. Inhalte müssen strukturiert, Layouts in Vorlagen überführt und Formulare sowie Medien angebunden werden. Eine grafisch fertige Seite spart diese Arbeit nicht automatisch. Mehr zur Auswahl: Kirby, WordPress oder individuelle Entwicklung.

3. Inhalte und Funktionen aus der Demo holen

Ersetze Platzhalter durch echte Leistungen, Bilder, Ansprechpartner und nachvollziehbare Aussagen. Erfundenen Bewertungen, Siegeln oder Kundenzahlen aus einer KI-Demo solltest du keine Bühne geben. Prüfe Bild- und Schriftlizenzen und ob dein Unternehmen im Entwurf überhaupt erkennbar wird.

Klicke jeden Button: Führt er auf eine echte Zielseite? Sendet das Formular wirklich? Gibt es verständliche Erfolgs- und Fehlermeldungen? Eine Terminbuchung, ein Shop oder ein Kundenlogin braucht reale Systeme im Hintergrund. Eine hübsche Oberfläche ist dafür nur ein Teil der Umsetzung.

4. Mobiloptimierung und Barrierefreiheit testen

Teste die Seite auf echten Smartphones, mit schmalen Browserfenstern und mit langen Inhalten. Menüs dürfen nichts verdecken, Bilder brauchen sinnvolle Ausschnitte, Bedienelemente genügend Platz. Ladezeiten über Mobilfunk und unerwartete Layoutsprünge gehören ebenfalls zur Prüfung.

Für Zugänglichkeit sind unter anderem semantische Überschriften, ausreichende Kontraste, sichtbarer Tastaturfokus, verständliche Formularbeschriftungen und passende Textalternativen wichtig. Prüfe Tastaturbedienung, Vergrößerung und mindestens stichprobenartig einen Screenreader. Die WCAG-Kriterien bieten dafür eine technische Orientierung. Ein automatischer Test allein belegt keine vollständige Barrierefreiheit.

Ob das BFSG auf dein Angebot anwendbar ist, muss separat geklärt werden. Es betrifft unter anderem bestimmte Dienstleistungen für Verbraucher; nicht jede Firmenwebsite fällt automatisch darunter. Für Kleinstunternehmen bestehen bei Dienstleistungen Ausnahmen. Orientierung bieten die Leitlinien zum BFSG. Zugänglichkeit ist auch unabhängig von einer gesetzlichen Verpflichtung sinnvoll.

5. SEO vor dem Start einbauen

Plane die Seiten entlang echter Fragen deiner Zielgruppe. Jede wichtige Leistung braucht einen verständlichen Inhalt und eine erreichbare Adresse. Prüfe individuelle Seitentitel, Beschreibungen, Überschriften, interne Links, Bildgrößen und gegebenenfalls strukturierte Daten, die zum sichtbaren Inhalt passen.

Technisch müssen wichtige Seiten aufrufbar und für Suchmaschinen zugänglich sein. Entferne versehentlich übernommene noindex-Anweisungen, prüfe Canonicals, Sitemap und robots.txt. Bei einem Relaunch brauchst du passende Weiterleitungen alter Adressen. Eine Sitemap garantiert keine Aufnahme in den Index.

6. Datenschutz und Pflichtangaben passend zur Technik klären

Erstelle eine Liste aller Datenflüsse: Hosting-Protokolle, Kontaktformular, E-Mail-Versand, Karten, Videos, Schriften, Statistik, Buchung und Chatbot. Kläre Rechtsgrundlagen, Informationspflichten, Speicherfristen, Empfänger, erforderliche Verträge und gegebenenfalls Drittlandtransfers. Eine kopierte Datenschutzerklärung kennt deine tatsächlichen Dienste nicht.

Nicht jede Website braucht einen Cookie-Banner. Bei Speicherung oder Zugriff auf Informationen im Endgerät ist § 25 TDDDG zu prüfen; die Verarbeitung personenbezogener Daten ist zusätzlich nach der DSGVO zu bewerten. „Keine Cookies“ heißt deshalb nicht „kein Datenschutz“. Prüfe außerdem die für dein Angebot nötigen Anbieterinformationen und weitere branchenspezifische Pflichtangaben. Vertiefung: Datenschutz auf der Website.

Hinweis: Ich bin keine Rechtsanwältin. Diese Punkte sind eine allgemeine Orientierung und keine Rechtsberatung. Für verbindliche Rechtstexte und die Bewertung deines konkreten Angebots nutze qualifizierte rechtliche Unterstützung.

So sieht der Schritt zur umgesetzten Website aus

Beispiele aus meinen Webdesign-Projekten zeigen, wie Gestaltung, Inhalte und technische Umsetzung zusammenspielen. Welche Lösung dein KI-Entwurf braucht, hängt von seinen Dateien und deinen Anforderungen ab.

7. Hosting passend zu den Dateien wählen

Für fertige statische HTML-Seiten genügt häufig statisches Hosting. Ein PHP-CMS benötigt eine passende PHP-Umgebung und je nach System eine Datenbank. Ein Projekt mit serverseitigem JavaScript benötigt eine unterstützte Laufzeit oder eine geeignete Hosting-Plattform. Ein statischer Export kann Serverfunktionen nicht einfach mitnehmen; Formulare brauchen dann zum Beispiel einen separat betriebenen Endpunkt.

Erst wenn die Architektur klar ist, lässt sich ein Hosting-Paket sinnvoll auswählen. Zur Einrichtung gehören Domain, DNS, HTTPS-Zertifikat, bevorzugte Domainvariante und Weiterleitungen. Plane E-Mail getrennt mit: Ein Website-Umzug darf bestehende Postfächer und die dafür nötigen DNS-Einträge nicht versehentlich abschalten. Die Grundlagen erklärt Domain und Hosting verständlich erklärt.

8. Sicherheit und laufende Kosten einplanen

Lass generierten Code auf riskante Abhängigkeiten, öffentlich sichtbare Schlüssel und ungeschützte Schnittstellen prüfen. Formulare brauchen serverseitige Validierung und Missbrauchsschutz. Administrationszugänge benötigen passende Rechte und starke Anmeldung. HTTPS schützt die Übertragung, behebt aber keine Fehler in einer Anwendung.

Vereinbare Updates, Backups, Wiederherstellung und Verantwortlichkeiten. Auch statische Websites können externe Dienste und aktualisierungsbedürftige Build-Abhängigkeiten haben. Budgetiere neben Domain und Hosting gegebenenfalls CMS-Lizenz, Plugins, Formularversand, Buchungsdienst, Wartung und Support. Kläre, was bei Kündigung exportierbar bleibt.

9. Veröffentlichen, übergeben und weiterpflegen

Wenn du Unterstützung suchst, schick am besten den Vorschau-Link, die vorhandenen Dateien, deine gewünschte Seitenstruktur und eine Liste der Funktionen mit. Sag dazu, was du später selbst ändern möchtest. Damit lässt sich beurteilen, ob der Entwurf weiterverwendet werden kann oder eine saubere Neuimplementierung wirtschaftlicher ist.