Website & Conversion · Von der Idee zur Live-Seite
Eine Website mit Claude bauen — und welche Skills du brauchst
Eine Website mit KI zu bauen ist heute real. Aber der Unterschied zwischen „sieht nach Baukasten aus" und „sieht aus wie eine Agentur-Seite" liegt in zwei Dingen: der richtigen Reihenfolge und den richtigen Skills, die Claude beim Bauen befolgt.
12 Min Lesezeit
Vor zwei Jahren brauchte eine gute Website ein Team: Designer, Entwickler, Texter, Wochen an Zeit. Heute kann eine einzelne Person mit Claude Code eine professionelle Seite bauen — in Tagen. Das ist keine Übertreibung, das ist die neue Realität.
Aber es gibt einen Haken, den kaum jemand ausspricht: Ohne die richtige Anleitung produziert jede KI dieselben Muster. Überall gleiche Karten, Farbverlauf-Überschriften, Standard-Schriften — der unverkennbare „KI-Look". Der Unterschied zwischen einer Seite, die nach Baukasten aussieht, und einer, die aussieht wie von einer Agentur, liegt in zwei Dingen: der Reihenfolge und den Skills.
Die Reihenfolge, die funktioniert
Der häufigste Anfängerfehler ist, sofort „bau mir eine Website" zu sagen. Die KI baut dann irgendetwas Hübsches — das aber nichts verkauft, weil das Ziel fehlt. Gute Websites entstehen in einer klaren Reihenfolge.
- 1Ziel klären: Für wen ist die Seite, was soll sie auslösen (Anfrage, Termin, Kauf)? Ohne Ziel kein gutes Design — nur hübsche Deko.
- 2Struktur vor Optik: erst die Abschnitte und ihre Reihenfolge (Hero, Nutzen, Beweis, Handlung), dann das Aussehen. Die Struktur ist das Skelett, das Design die Haut.
- 3Bauen lassen: Claude Code setzt die Seite um — du beschreibst, es baut, ihr verfeinert gemeinsam in Runden.
- 4Prüfen & live: Ladezeit, Handy-Ansicht, Rechtstexte — dann veröffentlichen.
Design ist nicht, wie es aussieht. Design ist, ob es das Ziel erreicht.
Die Skills, die den Unterschied machen
Damit die Seite nicht nach „KI-Standard" aussieht, braucht Claude Design-Regeln — als Skills hinterlegt. Ein Skill ist eine einmal geschriebene Anleitung, die die KI automatisch befolgt. Genau diese Regeln zwingen zu bewussten, geschmackssicheren Entscheidungen statt zur Schablone.
Ein Anti-Slop-Skill
Verbietet die typischen KI-Design-Tells: überall gleiche Karten, Farbverlauf-Text, Neon-Glühen, dieselben drei Standard-Schriften, generische Symbole. Ohne diese Regel greift jede KI zu denselben Mustern — und alle Seiten sehen gleich aus.
Ein Typografie- & Farb-Skill
Sorgt für harmonische Schrift-Paarungen, genau einen Akzent, getönte Neutrale statt reinem Schwarz und Weiß. Farbe und Schrift entscheiden über 80 % des ersten Eindrucks — hier trennt sich billig von hochwertig.
Ein Motion- & UX-Skill
Dezente, hochwertige Animationen (nur ruhige Bewegungen, kein Zappeln), dazu die unsichtbaren Grundlagen: Touch-Flächen groß genug fürs Handy, sichtbare Fokus-Zustände, mobile-first. Das merkt niemand bewusst — aber alle spüren es.
Warum das zählt
Diese Skills sind der Grund, warum zwei Menschen mit demselben Werkzeug völlig unterschiedliche Ergebnisse bekommen. Der eine sagt „bau eine Website" und bekommt Standard. Der andere hat Design-Skills hinterlegt und bekommt eine Seite mit Handschrift. Das ist der Unterschied zwischen „von KI gebaut" und „unverwechselbar".
Mockups: so entsteht das Aussehen heute
Früher wurde jedes Design mühsam in einem Extra-Programm gezeichnet, bevor eine Zeile Code entstand. Heute geht das schneller: KI-gestützte Mockup-Werkzeuge (etwa Google Stitch) liefern in Minuten Design-Entwürfe für Desktop und Handy, die als Ausgangspunkt dienen. Du siehst früh, wohin es geht, und sparst Wochen.
Der Ablauf: grobe Richtung als Mockup, Feedback-Runde, dann setzt Claude Code das umgesetzte Design direkt in die echte, funktionierende Seite um. Kein Bruch zwischen „Design" und „Umsetzung" mehr.
Was du realistisch erwarten kannst
Sei ehrlich mit dir: Eine schnelle, saubere, mobil-optimierte Seite mit klarer Struktur und gutem Text — absolut machbar, in Tagen. Ein individuelles Kunstwerk mit aufwändigen Spezial-Animationen — möglich, aber mit deutlich mehr Feinschliff.
Für die allermeisten Unternehmen ist das Erste genau das, was verkauft. Die perfekte Seite, die nie fertig wird, bringt null Anfragen. Die gute Seite, die diese Woche live geht, bringt welche. Bau die gute Seite.
Die KI baut die Seite. Die Skills entscheiden, ob sie gut wird. Du entscheidest, ob sie live geht.
Der ehrliche erste Schritt
Wenn du noch nie mit Claude Code gearbeitet hast, starte nicht mit deiner Hauptwebsite. Bau eine einfache Landingpage für ein einzelnes Angebot — überschaubar, mit klarem Ziel. Daran lernst du die Reihenfolge und den Umgang, und hast am Ende etwas Nützliches in der Hand. Von dort ist die große Seite nur noch eine Frage des Umfangs, nicht des Prinzips.
Weiterführende Links
- Claude Code herunterladen — das Werkzeug zum Bauen
- Anleitung: Claude Code für Einsteiger — falls du ganz neu bist
- Anleitung: Eigene Skills für Claude bauen — so hinterlegst du Design-Regeln
- Anleitung: Die Website, die verkauft — die 7 Prinzipien fürs Ergebnis
Gelesen ist gut. Gebaut ist besser.
Den kompletten Weg — von der ersten Zeile bis zur Live-Seite mit eigener Domain und den passenden Design-Skills — gehst du in der Business Dezigner Academy mit uns.
- Der komplette Weg: 3 Stufen, 15 Lektionen — kostenlos
- Die Vorlagen daraus zum Mitnehmen
- Die Community
Schon dabei? Hier einloggen.