So baue ich heute Webseiten: mein Workflow mit Astro, Hetzner und zwei KIs
· KI (Künstliche Intelligenz) · Webdesign · 10 Min. Lesezeit
Zuletzt aktualisiert am
Ich habe viele Jahre Webseiten mit WordPress und Contao gebaut – und tue das für meine Kunden nach wie vor. Aber wenn ich heute die freie Wahl habe, entsteht eine neue Webseite bei mir in einem anderen Workflow. Meine eigene Seite, auf der du diesen Beitrag gerade liest, ist genau so entstanden.
Dieser Beitrag ist bewusst zweigleisig geschrieben: Wenn du Unternehmerin oder Unternehmer bist und einfach verstehen willst, wie deine Webseite bei mir entsteht, lies die Kapitel von oben nach unten – ich erkläre jedes Werkzeug in Klartext. Wenn du selbst Webseiten baust, als Freelancer oder in einer Agentur, findest du in den Abschnitten „Für Kollegen” die Details, Zahlen und Stolpersteine. Denn dieser Weg ist kein Geheimnis, und ich zeige ihn gern.
Warum ich meinen Workflow umgestellt habe
Der Grund ist unspektakulär: Geschwindigkeit. Nicht nur die der fertigen Webseite, sondern vor allem die der Umsetzung. Ein klassisches CMS bringt immer Ballast mit – Systeme, Themes, Plugins, Updates. Vieles davon brauchst du für eine konkrete Seite gar nicht, es läuft aber trotzdem mit. In meinem heutigen Workflow ist es umgekehrt: Es existiert nur, was die Seite wirklich braucht.
Der Workflow besteht aus sechs Bausteinen, die ineinandergreifen: ein eigener Server, ein Versionsgedächtnis für den Code, eine automatische Veröffentlichung, ein schlankes System zum Bauen der Seiten, eine Entwicklungsumgebung mit KI – und eine zweite KI, die das Ganze plant und kontrolliert. Der Reihe nach.
Hetzner: das Fundament
Meine Webseiten laufen auf einem eigenen Cloud-Server bei Hetzner, einem deutschen Anbieter mit Rechenzentren in Falkenstein und Nürnberg. Das bedeutet: Ich weiß genau, wo die Daten liegen (Stichwort DSGVO), ich teile mir die Leistung nicht mit hunderten fremden Seiten wie beim klassischen Shared Hosting, und die Kosten sind planbar. Was Hosting grundsätzlich ausmacht, habe ich in meinem Beitrag Hosting erklärt aufgeschrieben.
Für Kollegen: Dimensionierung und Kosten
Das Überraschende zuerst: Ein Cloud-Server, der problemlos mehrere statische Webprojekte gleichzeitig trägt, kostet bei Hetzner aktuell unter zehn Euro im Monat – die Einstiegsmodelle der CX-Reihe starten bei etwa 5,50 Euro netto (Stand Sommer 2026; Hetzner hat die Preise dieses Jahr angehoben, liegt aber weiterhin deutlich unter vergleichbaren Anbietern). Weil Astro-Seiten statisch ausgeliefert werden, ist der Ressourcenbedarf minimal: keine PHP-Prozesse, keine Datenbanklast. Ein Server mit 2 vCPU und 4 GB RAM reicht für den Anfang völlig – und lässt sich bei Hetzner später ohne Neuinstallation vertikal skalieren. Dazu kommen 20 TB Inklusiv-Traffic, was du bei statischen Seiten praktisch nie ausreizt.
GitHub: das Gedächtnis des Projekts
Bevor irgendetwas gebaut wird, braucht das Projekt ein Zuhause – und das ist bei mir GitHub. Vereinfacht erklärt: GitHub bewahrt nicht nur den aktuellen Stand des Codes auf, sondern jede einzelne Änderung, die jemals gemacht wurde. Wie ein Vertragsordner, in dem nicht nur der aktuelle Vertrag liegt, sondern jede frühere Fassung mit Datum und Begründung. Geht etwas schief, drehe ich die Zeit einfach zurück.
Für dich als Kunde heißt das: Deine Webseite kann nicht „kaputtgehen”. Jeder Zustand, der jemals funktioniert hat, ist gesichert und in Minuten wiederherstellbar.
Für Kollegen: das Repository als Single Source of Truth
Technisch dahinter steht Git, das Versionierungssystem, und GitHub als gehostete Plattform darüber – für private Repositories kostenlos. Der entscheidende Punkt im Workflow: Das Repository ist die einzige Wahrheit. Es gibt keinen Zustand „auf dem Server liegt was anderes als lokal”, kein FTP-Chaos, keine Datei namens index_final_v2_NEU.html. Jede Änderung ist ein Commit mit nachvollziehbarer Beschreibung, und genau dieser Mechanismus ist später der Auslöser für die Veröffentlichung.
Coolify: die Brücke vom Code zur Live-Seite
Ein eigener Server klingt nach Handarbeit – ist es aber nicht mehr. Auf meinem Hetzner-Server läuft Coolify. Das ist, in einem Satz erklärt, meine private Veröffentlichungszentrale: Coolify beobachtet das Projekt auf GitHub, und sobald eine geprüfte Änderung dort ankommt, baut es die Webseite automatisch neu und stellt sie live. Kein Dateien-Hochschieben, kein „Hoffentlich habe ich nichts vergessen”. Der Weg von der fertigen Änderung zur Live-Seite ist ein definierter, wiederholbarer Ablauf von wenigen Minuten.
Für Kollegen: selbst gehostet statt gemietet
Coolify ist eine Open-Source-Alternative zu Plattformen wie Vercel oder Netlify – mit dem Unterschied, dass es auf dem eigenen Server läuft und keine monatlichen Plattformgebühren kostet. Die Einrichtung: ein Installationsskript auf dem frischen Server, danach läuft alles über eine Weboberfläche. Neues Projekt anlegen, GitHub-Repository verbinden, Build-Befehl hinterlegen – ab dann löst jeder Push auf den Hauptbranch automatisch Build und Deployment aus. SSL-Zertifikate über Let’s Encrypt verwaltet Coolify von selbst, und mehrere Projekte teilen sich denselben Server. Genau dadurch bleibt die Fünf-Euro-Rechnung von oben auch bei wachsendem Portfolio stabil.
Astro und Tailwind: der schlanke Rohbau
Das Herzstück ist Astro, ein modernes System zum Bauen von Webseiten. Der entscheidende Unterschied zum klassischen CMS: Astro erzeugt fertige, statische Seiten. Kein System muss bei jedem Besucher im Hintergrund mitlaufen, keine Datenbank wird gefragt, kein Plugin-Stapel durchlaufen. Es wird wirklich nur das geladen, was auf der Seite zu sehen ist. Das Ergebnis merkst du sofort: Die Seiten sind schnell – nicht durch nachträgliche Optimierung, sondern von Haus aus. Und was nicht existiert, kann weder gehackt werden noch Sicherheitsupdates verlangen.
Für die Gestaltung nutze ich Tailwind CSS. Vereinfacht gesagt lege ich einmal zentral fest, welche Farben, Schriften und Abstände es gibt – und die gesamte Webseite bedient sich aus diesem einen Regelwerk. Die praktische Folge: Anpassungen, die sonst Stunden dauern, sind eine Sache von Sekunden. Eine Farbe ändert sich an einer Stelle und sitzt sofort überall richtig.
Für Kollegen: Design-Tokens als Fundament
Die ehrliche Voraussetzung für dieses Tempo: Das System muss von Anfang an sauber aufgesetzt sein. Bei mir heißt das konkret: Alle Farben, Schriftgrößen und Abstände sind als Design-Tokens zentral definiert, Inhalte wie Blogbeiträge liegen als Markdown-Dateien in einer Content Collection mit festem Schema – jeder Beitrag wird beim Build automatisch gegen dieses Schema validiert, ein fehlendes Pflichtfeld bricht den Build ab, bevor etwas Kaputtes live geht. Diese Sorgfalt am Anfang ist der Preis für das Tempo danach. Wer sie überspringt, baut nur einen neuen Wildwuchs mit moderneren Werkzeugen.
Visual Studio Code mit GitHub Copilot: die Werkbank
Gearbeitet wird in Visual Studio Code, der kostenlosen Entwicklungsumgebung von Microsoft – wenn du so willst: meine digitale Werkbank, in der das Projekt mit allen Dateien vor mir liegt. Direkt darin arbeitet GitHub Copilot, eine KI, die Code nicht nur vorschlägt, sondern im sogenannten Agent-Modus ganze Arbeitsaufträge selbstständig umsetzt: Dateien anlegen, Änderungen über mehrere Stellen hinweg konsistent durchführen, Prüfungen laufen lassen.
Aber – und das ist der Punkt, an dem sich mein Workflow von „ich lasse die KI mal machen” unterscheidet: Copilot arbeitet bei mir nie frei nach Gefühl. Jeder Auftrag definiert exakt, welche Dateien angefasst werden dürfen, welche tabu sind und woran am Ende gemessen wird, ob die Arbeit stimmt.
Für Kollegen: Kosten und der Grund für Prompt-Disziplin
Copilot Pro kostet als Grundpreis rund zehn US-Dollar im Monat. Wichtig zu wissen: Seit Juni 2026 rechnet GitHub die Agent-Nutzung verbrauchsbasiert über AI Credits ab – wer die KI stundenlang unkontrolliert iterieren lässt, zahlt spürbar drauf. Für mich ist das kein Ärgernis, sondern eine Bestätigung des Ansatzes: Ein präziser Auftrag, der beim ersten Anlauf sitzt, ist nicht nur besser für die Qualität, sondern inzwischen auch messbar günstiger als zehn vage Nachbesserungsrunden. Prompt-Disziplin ist zur wirtschaftlichen Größe geworden.
Zwei KIs, ein System: Claude plant, Copilot baut
Jetzt zum Teil, nach dem ich am häufigsten gefragt werde. Ich arbeite mit zwei KIs, die bewusst getrennte Rollen haben.
Claude: planen, strukturieren, Aufträge formulieren
Mit Claude (dem KI-Assistenten von Anthropic, den ich als Desktop- und Mobile-App nutze, Abo in der Größenordnung von zwanzig Euro im Monat) bespreche ich Strategie und Struktur: Wie soll eine Seite aufgebaut sein, welche Design-Regeln gelten, was genau soll umgesetzt werden. Am Ende steht ein präzise formulierter, versionierter Arbeitsauftrag – ein Prompt als Dokument, nicht als schneller Chat-Befehl.
Das Schöne daran: Es funktioniert von überall. Ich kann unterwegs Anpassungen besprechen, planen und strukturieren – sogar komplette Blogbeiträge entstehen so. Dieser hier ist der lebende Beweis: unterwegs eingesprochen, gemeinsam mit Claude strukturiert und ausformuliert, zu Hause nur noch übergeben.
Was Claude inzwischen per Vormachen lernt und wo dabei die Grenzen liegen, steht hier.
Copilot: die Umsetzung nach klaren Vorgaben
Zu Hause füge ich den fertigen Auftrag in Copilot ein. Der setzt um – nach Vorgaben, nicht nach Laune – und legt über seine Arbeit einen Bericht als Datei ab: was geändert wurde, welche Prüfungen gelaufen sind, was offen blieb. Diesen Bericht bespreche ich wiederum mit Claude. So kontrollieren sich die beiden Systeme gegenseitig: Die eine KI definiert die Messlatte, die andere muss über sie springen, und ich entscheide am Ende.
Für Kollegen: automatisierte Qualitätssicherung mit Playwright
Verlassen tue ich mich dabei auf keinen von beiden. Für meine Seite läuft eine Playwright-Testsuite mit aktuell 38 automatisierten Prüfungen: Sind alle Seiten erreichbar, stimmen Titel und Meta-Angaben, funktioniert das Kontaktformular, hält das Layout seine Regeln ein. Diese Tests laufen lokal in einer sauberen Testumgebung, bevor irgendetwas den Rechner verlässt. Erst wenn alles grün ist, geht der Commit auf den Hauptbranch – und Coolify übernimmt. KI ist bei mir ein Kollege mit klaren Aufgaben und Qualitätskontrolle, kein Autopilot.
Der Kreislauf im Überblick
Zusammengesetzt ergibt das einen Kreislauf, der sich mit jedem Projekt und jeder Anpassung wiederholt:
Von der Idee bis zur Live-Schaltung vergehen bei kleinen Anpassungen oft nur Minuten – und trotzdem hat jede Änderung denselben vollständigen Prüfweg durchlaufen. Genau diese Kombination aus Tempo und Kontrolle war mit keinem meiner früheren Workflows möglich.
Und wo bleiben WordPress und Contao?
Jetzt die Wahrheit, die zu einem ehrlichen Fachbeitrag dazugehört: Dieser Workflow funktioniert, weil es jemanden wie mich gibt, der alles übernimmt. Er ist hochgradig spezialisiert – das ist seine Stärke und seine Grenze zugleich.
Wenn in deinem Unternehmen Mitarbeiterinnen und Mitarbeiter selbst Inhalte pflegen sollen – neue Kurse, Termine, Unterseiten, Neuigkeiten –, dann führt an einem klassischen CMS kein Weg vorbei. Falls du erst einmal verstehen willst, was ein CMS überhaupt leistet: Das habe ich hier ausführlich erklärt. Diese Menschen sind mit meinem Workflow nicht vertraut und haben verständlicherweise keine Zeit, sich einzuarbeiten. Ein CMS wie WordPress oder Contao gibt ihnen eine Oberfläche, in der sie selbstständig arbeiten können – und macht dich als Unternehmen unabhängiger von einem einzelnen Dienstleister. Das gilt vor allem für größere Unternehmen mit eigener Redaktion, und dafür baue und betreue ich diese Systeme weiterhin mit Überzeugung.
Was das für dein Projekt bedeutet
Liegt die Pflege dagegen bei mir, spielt der Workflow seine Stärke voll aus – und die lässt sich beziffern. Weil ich in deutlich kürzerer Zeit hochwertiger produzieren kann, sind Webseiten mit gleichem Umfang auf diesem Weg in der Regel rund zwei Drittel günstiger, als würde eine Agentur sie klassisch mit einem CMS umsetzen. Dazu kommt die laufende Seite der Rechnung: keine Plugin-Lizenzen, wie sie bei WordPress-Projekten schnell zusammenkommen, ein Serverbetrieb im einstelligen Euro-Bereich und kein Wartungsvertrag für Systemupdates, weil es schlicht kein System gibt, das gewartet werden müsste.
Am Ende ist es wie immer bei mir: Erst das Ziel, dann das Werkzeug. Pflegt dein Team selbst, bekommst du ein sauber aufgesetztes CMS. Soll die Seite vor allem schnell, sicher und wirtschaftlich sein und liegt die Pflege in meinen Händen, bekommst du diesen Workflow. Wenn du wissen willst, welcher Weg zu deinem Projekt passt: Lass uns darüber sprechen – ich sage dir ehrlich, welches Werkzeug du wirklich brauchst.
Du willst Marketing, das dich sichtbar macht? Lass uns sprechen.
Kontakt aufnehmenPraxis-Impulse fürs Postfach
Ab und zu ein Impuls, der dein Marketing weiterbringt – konkret, ohne Fülltext. Kostenlos, jederzeit abbestellbar.
Mit dem Eintragen erhältst du eine Bestätigungsmail (Double-Opt-in). Wie wir deine Daten verarbeiten, steht in den Datenschutzhinweisen.
Fast geschafft – bitte bestätigen.
Ich habe dir eine E-Mail geschickt. Klick auf den Bestätigungslink darin, dann bist du dabei.
Manuel von Heugel
Geschäftsführer, von Heugel Marketing GmbH
Seit über 20 Jahren im Marketing zu Hause: als Berater, Ausbilder, Dozent, Grafiker und Programmierer. Hier schreibe ich über das, was Marketing wirklich erfolgreich macht – konkret, fundiert und ohne Umschweife.
Mehr über mich