Website-Relaunch per Vibe Coding: Warum wir Webflow und WordPress über Bord geworfen haben

Pünktlich zum vierten Quartal ist sie da: die neue wiro.design. Jedes Jahr gestalten wir unseren Auftritt neu, aber diesmal haben wir nicht nur das Design überarbeitet, sondern das ganze Fundament. Wir haben sämtliche Baukästen über Bord geworfen: kein Webflow, kein WordPress mit zwanzig Plugins. Die Seite ist zu 100 Prozent per Vibe Coding entstanden, ohne eine einzige Zeile Code von Hand. Inklusive Blog, der sich täglich selbst füllt, und LinkedIn-Posts, die automatisch rausgehen.

Wir haben wiro.design per Vibe Coding neu gebaut: KI-Assistenten schreiben den Code, wir geben Richtung, Design und Inhalte vor und prüfen jedes Ergebnis. Herausgekommen ist eine schnelle, statische Website mit eigener Content-Datenbank, eingebauter KI-Sichtbarkeit und automatisiertem Blog plus LinkedIn. Für unseren Fall laufen die Hosting-Kosten nahezu bei null, während Webflow oder verwaltetes WordPress jeden Monat Gebühren kosten würden.

Was ist Vibe Coding und wie haben wir es eingesetzt?

Den Begriff Vibe Coding hat Andrej Karpathy im Februar 2025 geprägt. Gemeint ist: Du beschreibst einer KI, was du willst, lässt den Code schreiben, probierst das Ergebnis aus und verbesserst im Gespräch. In der reinen Lehre schaut man sich den Code dabei gar nicht mehr an.

Bei uns hat die KI tatsächlich den gesamten Code geschrieben, mit KI-Coding-Assistenten wie Claude. Blind vertraut haben wir ihr trotzdem nicht. Die Entscheidungen blieben bei uns: Architektur, Design, Texte, Datenschutz und jede Freigabe. Jede Änderung wurde getestet, bevor sie live ging. Vibe Coding ist für uns kein Autopilot, sondern ein sehr schneller Entwickler, der eine klare Führung braucht.

Warum nicht Webflow oder WordPress?

Beide Systeme sind gut, Webflow nutzen wir selbst für andere Projekte. Für unsere eigene Seite hatten wir aber drei Anforderungen, die mit einem Baukasten teuer oder umständlich geworden wären.

Erstens Inhalte aus einer Datenbank, die eine Automation befüllen kann. Unser Blog bekommt jeden Tag neue Fachbeiträge auf Deutsch und Englisch, jeweils mit eigenem Titelbild und passendem LinkedIn-Post. Dafür brauchen wir direkten Zugriff auf die Inhalte, ohne Umwege über Editor-Oberflächen.

Zweitens volle Kontrolle über alles, was Suchmaschinen und KI-Systeme lesen. Strukturierte Daten, Antwort-Absätze, Sprachversionen, eine llms.txt für KI-Assistenten und eine automatische Meldung neuer Seiten an Bing und Co. wollten wir genau so umsetzen, wie wir sie für richtig halten.

Drittens die Kosten. Und hier wird es für uns zum No-Brainer.

Der Kostenvergleich: warum es für uns ein No-Brainer war

Wir kennen die Webflow-Rechnung aus eigener Erfahrung, denn wir betreiben dort selbst eine Website. Allein für eine Seite zahlen wir den CMS-Plan und zusätzlich den verpflichtenden Workspace-Plan. Für eine zweite Sprache kommen weitere Kosten für die Lokalisierung dazu, und je nach Anforderung noch Plugins und externe Dienste, die Webflow nicht von Haus aus mitbringt. Bei WordPress sieht es ähnlich aus: Verwaltetes Hosting in Deutschland beginnt zum Beispiel bei Raidboxes bei 18 Euro im Monat, der Starter-Tarif für kleine und mittlere Seiten liegt bei 24 Euro zuzüglich Mehrwertsteuer. Premium-Themes, Plugins und Wartung kommen fast immer noch obendrauf.

Unsere neue Seite läuft auf Cloudflare Workers. Im kostenlosen Tarif sind Anfragen an statische Dateien laut Cloudflare kostenlos und unbegrenzt, für Server-Funktionen wie unser Kontaktformular gibt es 100.000 Anfragen pro Tag gratis. Die Inhalte liegen bei Supabase im kostenlosen Tarif mit 500 MB Datenbank. Die Benachrichtigungen bei neuen Anfragen verschickt Resend, kostenlos bis 3.000 E-Mails im Monat. Laufende Hosting-Kosten außer der Domain: null.

Ehrlich gesagt gehört zur Rechnung auch, was nicht auf der Hosting-Rechnung steht. Wir nutzen KI-Werkzeuge für Code, Bilder und Texte, die wir ohnehin täglich für unsere Arbeit einsetzen. Und es braucht jemanden, der technisch versteht, was die KI baut. Für eine Agentur mit genau diesem Profil ist die Rechnung eindeutig. Für ein Team, das ohne technische Begleitung Seiten im visuellen Editor pflegen will, kann Webflow weiterhin die bessere Wahl sein.

Von der Idee bis zum Launch: so lief der Prozess

1. Positionierung und Marke. wiró hat sich vom Designstudio zur Performance-Marketing-Agentur entwickelt. Das Corporate Design mit dem Auge als Logo blieb, dazu kam unser Maskottchen Imp: ein kleines schwarzes Wesen, das im Grunde ein einziges großes Auge ist.

2. Technik festlegen. Wir haben uns für Astro als Grundgerüst entschieden, das daraus eine statische, sehr schnelle Website baut. Supabase ist die Datenbank für Leistungen, FAQ und Blog in beiden Sprachen, Cloudflare das Hosting inklusive Kontaktformular. Bei jeder Veröffentlichung wird die Seite neu gebaut und ist nach wenigen Minuten live.

3. Design und Animation. Der Einstieg ist eine Scroll-Animation: Imp fliegt in einem UFO durch die Wolken herein. Die Bilder dafür stammen aus einem KI-Video, das beim Scrollen Bild für Bild abgespielt wird. Dazu schwebende 3D-Inseln für jede Leistung.

4. Inhalte und KI-Sichtbarkeit. Acht Leistungsseiten, FAQ und Glossar, alles auf Deutsch und Englisch. Jede Leistungsseite beginnt mit einer kurzen, zitierfähigen Antwort, so wie wir es auch für GEO und AEO bei Kunden empfehlen. Dazu strukturierte Daten auf allen Seiten, KI-Crawler ausdrücklich erlaubt und eine llms.txt.

5. Launch-Audit. Vor der Ankündigung haben wir alle Seiten kritisch geprüft: Statuscodes, Links, Metadaten, Mobilansicht, Rechtstexte, Formular und Tracking. In unserer Messung am Desktop erschien der erste Inhalt nach rund 0,35 Sekunden.

6. Das Content-System. Jeden Tag entstehen sechs Fachbeiträge und News auf Deutsch und Englisch, jeweils mit eigenem Imp-Titelbild, das vor der Veröffentlichung geprüft wird, und einem eigenen LinkedIn-Post auf unserer Unternehmensseite. Neue Seiten werden automatisch an Suchmaschinen gemeldet. Mehr dazu, wie solche Abläufe funktionieren, findest du bei AI Automation.

Learnings und Schwierigkeiten

KI-Video ist stark für Stimmung, schwach für Konsistenz. Im Intro veränderte sich das UFO von Bild zu Bild leicht, und kleine orange Punkte tauchten auf und verschwanden. Statt endlos neu zu generieren, haben wir die bewährte Intro-Animation behalten und planen die Szene als nächsten Schritt als echte 3D-Animation. Learning: Für generative Korrekturen vorher ein festes Budget setzen und lieber einen sauberen Workaround wählen als Credits zu verbrennen.

Automationen brauchen Überwachung. Als ein Nutzungslimit erreicht war, liefen geplante Veröffentlichungen ins Leere. Learning: Jede Automation braucht eine Überwachung und eine Nachhol-Logik, die verpasste Termine erkennt und nachzieht.

Vibe Coding ersetzt keine Sicherheitsprüfung. Zwei Zugangsschlüssel lagen anfangs als normale, lesbare Variablen im Hosting statt verschlüsselt. Das Audit hat es gefunden, jetzt sind sie als Secrets gespeichert. Genau deshalb prüfen wir alles, was die KI baut.

Das Audit vor dem Launch lohnt sich. Wir haben eine leere Case-Seite in der Navigation gefunden, ein Kontaktformular, das Anfragen zwar speicherte, aber keine Benachrichtigung verschickte, und noch kein aktives Analytics. Alles war vor der Ankündigung behoben. Ohne Prüfung wären die ersten Anfragen aus dem Launch unbemerkt liegen geblieben.

Rechtstexte müssen mitwachsen. Jeder neue Dienst, etwa für E-Mail oder Statistik, gehört in die Datenschutzerklärung, und zwar genau dann, wenn er aktiv wird.

Unterm Strich: Jedes dieser Probleme war in kurzer Zeit gelöst, meist mit einem einfachen Workaround. Auf dem klassischen Weg hätte uns die gleiche Seite ein Vielfaches an Zeit gekostet.

Was bringt uns das System?

Die Seite ist schnell, gehört komplett uns und lässt sich ohne Plugin-Abhängigkeiten erweitern. Vor allem arbeitet sie für uns: Der Blog beantwortet täglich Fragen, die unsere Zielgruppe in Google und in KI-Assistenten stellt. Die LinkedIn-Posts bringen diese Inhalte dorthin, wo Entscheider mitlesen. Und jede Anfrage landet sofort in unserem Postfach. Ob das langfristig mehr Sichtbarkeit und Anfragen bringt, messen wir ab jetzt. Dafür ist Tracking mit Einwilligung von Anfang an eingebaut.

Häufige Fragen

Ist eine Website per Vibe Coding sicher?

So sicher wie die Prüfung dahinter. Die KI schreibt schnell, macht aber Fehler, etwa bei der Ablage von Zugangsdaten. Wer jede Änderung testet und sensible Daten verschlüsselt speichert, bekommt eine solide Seite.

Kann ich Inhalte trotzdem selbst ändern?

Ja. Die Inhalte liegen in einer Datenbank mit Weboberfläche und können dort bearbeitet werden. Einen visuellen Seiten-Editor wie in Webflow gibt es allerdings nicht.

Lohnt sich das auch für mein Unternehmen?

Wenn du Inhalte automatisieren, KI-Sichtbarkeit gezielt steuern und laufende Plattformkosten sparen willst, sehr wahrscheinlich. Wenn ein großes Team ohne technische Begleitung Seiten frei gestalten soll, eher ein Baukasten.

Quellen

• Martin Fowler: Vibe Coding
• Cloudflare: Workers Pricing
• Supabase: Pricing
• Raidboxes: Preise für Managed WordPress Hosting
• Automation Atlas: Resend free tier explained

Du willst so ein System auch?

Eine Website, die schnell ist, von KI-Assistenten verstanden wird und sich mit Blog und LinkedIn selbst mit Inhalten versorgt: Genau das bauen wir jetzt auch für Kunden. Schreib uns, wenn du so etwas für dein Unternehmen willst. Wir schauen uns gemeinsam an, was bei dir sinnvoll ist, und helfen dir gerne beim Aufbau.

Du willst, dass aus mehr Blicken bei dir Kunden werden? Lass uns 15 Minuten auf dein Setup schauen, kostenlos und ohne Pitch-Deck. Jetzt Erstgespräch buchen