Leitfaden · Teil 1 von 2
Website erstellen lassen:
wie das heute abläuft.
Früher begann ein Website-Projekt mit dem Kauf einer Vorlage und endete Monate später mit einer Seite, die niemand ändern konnte. Heute steht nach dreißig Minuten Briefing ein klickbarer Entwurf. Was sich geändert hat — und was das für Ihr Projekt bedeutet.
Lesezeit 15 Minuten
Es begann damit,
dass der Kunde einkaufen ging.
Wir haben das jahrelang selbst so gemacht, deshalb steht es hier so ausführlich. Wer wissen will, warum eine Website früher acht Wochen und fünfstellige Beträge gekostet hat, muss den Ablauf kennen.
WordPress aufsetzen
Datenbank anlegen, Installation hochladen, Grundeinstellungen setzen. Eine halbe Stunde Arbeit, mit der man nichts falsch machen kann — der einzige entspannte Teil des ganzen Projekts.
Den Kunden zum Vorlagen-Basar schicken
Dann kam der Satz, für den man sich heute schämt: „Schauen Sie doch mal, ob Ihnen davon etwas gefällt.“ Es folgte ein Link auf einen Marktplatz mit zwanzigtausend Vorlagen. Der Kunde, ein Geschäftsführer mit einer Fertigung und einem vollen Tag, sollte sich durch Vorschaubilder klicken und ein Design auswählen, das er nur als Demo mit fremden Inhalten sah.
Vorlage kaufen und installieren
Neunundfünfzig Dollar, Lizenz auf einen Account, oft den der Agentur. Nach der Installation stand da: nichts. Eine leere Seite mit einem Menüpunkt. Alles, was auf den Vorschaubildern zu sehen war, steckte in einem separaten Paket mit Beispielinhalten.
Die Dokumentation lesen
Vierzig bis achtzig Seiten, oft in gebrochenem Englisch, dazu Videos von 2019, in denen die Oberfläche anders aussieht als die installierte Fassung. Herausfinden musste man drei Dinge: Welcher Editor ist verbaut, wie werden die Beispielinhalte eingespielt, und wo stellt man Schriften und Farben ein.
Beispielinhalte einspielen und den Aufbau verstehen
Jetzt sah die Seite endlich aus wie im Vorschaubild — nur mit Bildern eines Yogastudios in Kalifornien. Danach begann die eigentliche Detektivarbeit: Welcher Baustein liegt wo, welche Einstellung wirkt an welcher Stelle, warum ändert sich die Schriftgröße im Fußbereich nicht, obwohl man sie eingestellt hat.
An dieser Stelle war noch kein einziger Satz über den Kunden geschrieben, kein Foto von einer Maschine hochgeladen und keine Entscheidung getroffen, die mit seinem Geschäft zu tun hatte. Verbraucht waren, je nach Vorlage, zwei bis fünf Arbeitstage.
Jede fehlende Funktion
war eine Erweiterung.
WordPress kann von sich aus wenig. Alles, was eine Firmenwebsite braucht, kommt von Dritten — und jeder dieser Dritten hat eigene Updates, eigene Werbung im Verwaltungsbereich und eine eigene Meinung darüber, wie schnell eine Seite sein muss. Klicken Sie die Stapel an.
Kontaktformular
Ohne Erweiterung gibt es kein Formular. Die verbreitete Variante ist kostenlos, die brauchbare kostet jährlich.
Der HakenSpam kommt trotzdem durch, also braucht es einen Filter — die nächste Erweiterung. Und wohin die abgeschickten Daten laufen, weiß nach zwei Jahren niemand mehr genau.
SEO-Werkzeug
Setzt Titel und Beschreibung, erzeugt eine Sitemap und malt Ampeln neben jeden Text.
Der HakenDie Ampeln verleiten dazu, für die Ampel zu schreiben statt für den Leser. Und das Werkzeug bewirbt sich im Verwaltungsbereich ständig selbst.
Caching
Legt fertige Fassungen der Seiten ab, damit nicht bei jedem Aufruf die Datenbank befragt wird.
Der HakenMan repariert damit ein Problem, das die Bauweise erst erzeugt hat. Und nach jeder Änderung fragt man sich, ob man gerade die alte Fassung sieht.
Bildverkleinerung
Rechnet hochgeladene Fotos herunter und erzeugt moderne Formate.
Der HakenDie kostenlose Fassung schafft fünfzig Bilder im Monat. Bei einem Hersteller mit Produktbereich sind das die Bilder einer Woche.
CDN-Anbindung
Liefert Bilder und Dateien über ein weltweites Netz aus, damit die Seite schneller lädt.
Der HakenEin weiterer Dienstleister, ein weiterer Vertrag, ein weiterer Ort, an dem Daten Ihrer Besucher landen — und der in die Datenschutzerklärung gehört.
Zweite Sprache
Englisch für den Export. Klingt nach einem Haken im Formular, ist aber der größte Eingriff von allen.
Der HakenDas Werkzeug greift tief in die Struktur ein. Danach ist ein Wechsel der Vorlage praktisch ausgeschlossen, und jedes Update wird zum Risiko.
Newsletter-Anbindung
Damit eine Anmeldung im Formular direkt im Versandsystem landet.
Der HakenBricht regelmäßig, wenn der Anbieter seine Schnittstelle ändert. Auffallen tut das meist erst, wenn drei Wochen keine Anmeldung mehr angekommen ist.
Tag Manager
Ein Feld, in das man einen Google-Schnipsel einträgt. Dafür braucht es eine eigene Erweiterung, weil das Design keine Stelle dafür vorsieht.
Der HakenEine komplette Erweiterung für ein Textfeld. Sie läuft mit, wird gepflegt und aktualisiert wie jede andere auch.
Cookie-Hinweis
Der Balken, der beim ersten Besuch aufgeht. Rechtlich nötig, sobald irgendetwas Fremdes mitlädt.
Der HakenEr blockiert die anderen Erweiterungen nur dann wirklich, wenn man ihn richtig einstellt. Sonst ist er eine Attrappe — und die kostet im Ernstfall mehr als sie einbringt.
Sicherung
Legt regelmäßig Kopien von Datenbank und Dateien ab, damit man nach einem misslungenen Update zurück kann.
Der HakenMan braucht sie nur, weil ständig Updates nötig sind. Und geleistet hat sie erst etwas, wenn jemand eine Rücksicherung getestet hat — was fast nie jemand tut.
Eine typische Zusammenstellung, nicht die längste. Bei Seiten mit Produktbereich und Shop-Anbindung kommen leicht zwanzig zusammen.
Jede dieser Erweiterungen lädt eigene Skripte und eigene Gestaltungsdateien, auch auf Seiten, auf denen sie gar nicht gebraucht wird. Deshalb ist die Ladezeit nicht ein Problem, das man am Ende noch schnell löst — sie ist das Ergebnis von zehn Entscheidungen, die man vorher getroffen hat.
Und dann fehlten
die Inhalte.
Technik war nie der Grund, warum Website-Projekte sich hinzogen. Der Grund waren Texte und Bilder — und die Frage, wer sie liefert.
„Die Texte schicken wir Ihnen dann“
Dieser Satz fällt im Kick-off und meint es ehrlich. Nur schreibt der Geschäftsführer keine Texte, wenn eine Anlage ausfällt, und der Vertriebsleiter schreibt sie erst recht nicht, wenn er unterwegs ist. Nach sechs Wochen liegen zwei von neun Seiten vor. Nach zwölf Wochen fragt jemand, warum die Website noch nicht online ist.
Die Bilder waren immer ein Problem
Vorhanden waren: Aufnahmen vom Messestand aus 2017, ein Ordner mit Handyfotos vom Hof und ein Prospekt-PDF, aus dem man Bilder in Briefmarkengröße ziehen konnte. Was fehlte: Aufnahmen der aktuellen Geräte in ordentlichem Licht. Ein Fototermin kostet Geld und einen Tag Betriebsablauf, also wurde er verschoben.
Also Stockfotos
Damit die Seite nicht leer aussieht, kamen gekaufte Bilder hinein. Ein lächelndes Team im Großraumbüro, ein Bagger, der nicht der eigene ist, ein Händedruck vor Glasfassade. Jeder Einkäufer erkennt das sofort — und zieht daraus einen Schluss über die Firma, den niemand beabsichtigt hat.
Interaktive Elemente: Fehlanzeige
Ein Konfigurator, eine Vergleichstabelle, eine Explosionszeichnung zum Anklicken — alles, was eine technische Seite lebendig macht, war entweder in der Vorlage nicht vorgesehen oder kostete eine weitere Erweiterung. In der Praxis blieb es beim Fließtext mit Bildern daneben.
Der Kern des Problems: Die Website wartete auf Zulieferungen von Menschen, die etwas anderes zu tun hatten. Und jede Woche Verzögerung kostete nichts, was jemandem sofort weh tat — deshalb zog es sich.
Menü, Mobilansicht,
Anker.
Wenn Inhalte und Vorlage endlich zusammenkamen, begann der Teil, der in keinem Angebot stand: das Zusammenrücken von Dingen, die nicht zusammenpassen wollten.
Das Menü
Die Vorlage brachte fünf Menüvarianten mit, von denen drei auf dem Telefon unbrauchbar waren. Die vierte sah gut aus, konnte aber keine zweite Ebene. Die fünfte konnte alles und passte nicht zum Rest. Am Ende wurde eine ausgewählt und mit eigenen Regeln nachgebessert — die beim nächsten Update wieder verschwanden.
Die Mobilansicht
Auf dem Bildschirm sah alles ordentlich aus. Auf dem Telefon stand die Tabelle mit den technischen Daten quer, das Hero-Bild schnitt den Kopf ab, und der Text lief unter dem festen Balken durch. Jede dieser Stellen wurde einzeln repariert, in Einstellungsfeldern, die drei Klicks tief lagen.
Abstände
Der Abstand über einer Überschrift ließ sich einstellen, der darunter nicht. Also wurde ein leerer Baustein eingefügt. Auf dem Telefon war der leere Baustein plötzlich zu groß, also bekam er eine eigene Regel. Nach vierzig solchen Stellen weiß niemand mehr, warum eine Seite so aussieht, wie sie aussieht.
Anker
Sprungmarken innerhalb einer Seite waren jedes Mal Handarbeit: eine Kennung vergeben, sie im Menü eintragen, prüfen, ob der feste Kopf den Zielpunkt verdeckt, dann den Versatz nachjustieren. Wehe, der Kunde wollte eine Sektion verschieben.
Nichts davon ist schwer. Es ist nur viel, es ist mühsam, und es hat mit dem Geschäft des Kunden nichts zu tun. Genau deshalb sind Website-Projekte früher teuer geworden: Nicht weil Gestaltung teuer ist, sondern weil ein großer Teil der Stunden in die Bekämpfung einer Vorlage floss.
Am Ende war die Seite online —
und keiner traute sich, sie anzufassen.
Der eigentliche Preis des alten Wegs
Acht Wochen,
und keine davon für Sie.
Ziehen Sie den Regler durch die Wochen. Oben der alte Weg, unten der heutige — dieselbe Firmenwebsite mit sieben Seiten, Produktbereich und Kontaktformular.
Mit gekaufter Vorlage
Vorlage suchen, kaufen, installieren. Der Kunde klickt sich durch einen Marktplatz.
Handgebaut mit KI-Unterstützung
Briefing am Telefon, dreißig Minuten. Am selben Tag steht die Designrichtung.
Schema aus unseren Projekten, keine Garantie. Der große Unterschied liegt nicht im Bauen, sondern darin, wann der Kunde etwas Entscheidbares zu sehen bekommt.
Der teuerste Posten im alten Ablauf steht in keiner Rechnung: die Wochen, in denen nichts passierte, weil auf Zulieferung gewartet wurde. Wer diese Wochen herausnimmt, halbiert die Projektdauer, ohne schneller zu arbeiten.
Dreißig Minuten,
dann wird gebaut.
Was sich geändert hat, ist nicht die Gestaltung. Geändert hat sich, wann eine Entscheidung fällt und wie viel Vorarbeit vor der ersten sichtbaren Fassung liegt.
Das Briefing: ein Telefonat
Maximal eine halbe Stunde, am Telefon oder in Teams. Drei Fragen tragen das Gespräch: Was machen Sie, wer soll auf der Seite etwas tun, und welche Seiten in Ihrer Branche gefallen Ihnen. Die Designrichtung wird dabei festgelegt — meist aus dem, was schon da ist: Ihre Farben, Ihr Logo, der Eindruck Ihrer Halle. Kein Workshop, kein Fragebogen mit vierzig Feldern.
Material: schicken Sie einfach alles
Was da ist, kommt per Mail. Alte Prospekte als PDF, Datenblätter, Fotos vom Hof, ein Word-Dokument von 2019, der Text aus dem Messeflyer. Ohne Sortierung, ohne Beschreibung, ohne Dateinamen-Ordnung. Das Auseinandersortieren ist unsere Arbeit, nicht Ihre — und es dauert Stunden, nicht Wochen.
Das Designsystem entsteht
Statt eine Vorlage auszuwählen, wird beschrieben, was gebraucht wird. Wir arbeiten dafür mit Claude Design: Man sagt, worum es geht, das Werkzeug stellt Rückfragen — zur Branche, zum Zweck einer Seite, zur Gewichtung — und legt dann Farben, Schriften, Abstände und die ersten Bausteine an. Bis dahin vergehen Minuten, nicht Tage.
Struktur und Prototyp
Auf dem System wachsen die Seiten. Am Ende steht kein Bild einer Website, sondern eine klickbare Fassung, die sich bedienen lässt — mit Menü, mit Mobilansicht, mit den echten Texten und Bildern des Kunden.
Die Vorstellung
Der Entwurf wird live gezeigt, nicht als PDF verschickt. Wir gehen gemeinsam durch, Änderungen werden im Gespräch notiert und meist noch am selben Tag eingearbeitet. Erst danach beginnt die Entwicklung — und die ist Thema von Teil 2.
Erst die Regeln,
dann die Seiten.
Der wichtigste Unterschied zum Vorlagen-Kauf: Es wird nichts ausgesucht, das schon fertig ist. Es entsteht ein Regelwerk, das nur für Ihre Firma gilt — und das mit jeder Seite wächst.
Ebene 1
Grundwerte
Farben, Schriften, Abstufungen der Schriftgrößen, Abstände. Ein knappes Dutzend Festlegungen, aus denen sich alles Weitere ableitet.
Ebene 2
Bausteine
Knöpfe, Karten, Tabellen, Bildrahmen, Formularfelder. Jeder Baustein wird einmal festgelegt und gilt dann überall gleich.
Ebene 3
Abschnitte
Aus Bausteinen werden größere Einheiten: ein Produktraster, eine Datentabelle, ein Kontaktbereich, eine Bildstrecke.
Ebene 4
Seiten
Die Startseite, die Produktseite, die Kontaktseite. Sie sind nur noch eine Reihenfolge von Abschnitten — deshalb dauert eine zusätzliche Seite Minuten und nicht Tage.
Der Aufbau ist iterativ: Es wird nicht erst ein vollständiges System gebaut und dann angewendet, sondern immer genau das ergänzt, was die nächste Seite braucht. Das klingt unordentlich und ist das Gegenteil — es verhindert, dass Wochen in Bausteine fließen, die nie jemand benutzt.
Aus der Praxis
Man kann sich mehrere Designs gleichzeitig anlegen lassen. Wir raten davon ab. Die Aufmerksamkeit verteilt sich dann auf viele Stellen gleichzeitig, statt eine Richtung sauber zu Ende zu denken — und das Ergebnis ist in unserer Erfahrung schlechter. Ein Entwurf, richtig durchgezogen, schlägt vier halbfertige.
Kein PDF.
Eine Seite, die man bedienen kann.
Der größte Gewinn für Sie als Auftraggeber steckt nicht in der Geschwindigkeit, sondern darin, worauf Sie Ihre Entscheidung stützen.
Sie sehen Ihre Inhalte, nicht fremde
Im Entwurf stehen Ihre Geräte, Ihre technischen Daten, Ihre Ansprechpartner. Kein Blindtext, keine Yogastudio-Fotos. Sie beurteilen damit Ihre Website und nicht die Vorlage von jemand anderem.
Sie können klicken
Menü auf, Produktseite an, zurück, Formular ausfüllen, auf dem Telefon ansehen. Was sich komisch anfühlt, fällt beim Bedienen auf — und nicht drei Wochen nach dem Start.
Änderungen kosten Minuten
„Die Datenblatt-Downloads müssen weiter nach oben“ ist im Gespräch gesagt und meist am selben Tag umgesetzt. Beim Vorlagen-Weg war das eine Anfrage, ein Angebot und eine Woche Wartezeit.
Sie entscheiden früh, nicht spät
Die teuren Änderungen sind die, die nach der Programmierung kommen. Wenn die Struktur im Entwurf steht und freigegeben ist, entfallen sie fast vollständig.
Zum ersten Mal klickt jemand
auf die eigene Website.
Drei Wochen nach dem ersten Telefonat, nicht drei Monate
Wo dieser Weg
nicht funktioniert.
Damit der Text nicht wie eine Werbebroschüre endet: Es gibt Fälle, in denen der beschriebene Ablauf der falsche ist.
Wenn täglich viele Leute Inhalte pflegen sollen
Ein Nachrichtenportal, ein Blog mit drei Autoren, ein Shop mit hunderten Artikeln, die sich ständig ändern: Dafür braucht es ein Redaktionssystem, und dann ist WordPress oder ein Shopsystem die richtige Wahl. Wir sagen in solchen Fällen ab und empfehlen weiter.
Wenn nichts da ist und nichts kommen soll
Wir können aus alten Prospekten, Datenblättern und Handyfotos viel herausholen. Aber wenn es weder Bilder noch Unterlagen gibt und auch niemand zwei Stunden für Fragen hat, entsteht auch mit dem besten Werkzeug nur eine hübsche leere Hülle.
Wenn die Entscheidung im Gremium fällt
Der schnelle Ablauf lebt davon, dass jemand am Telefon entscheiden darf. Wenn jede Farbe durch drei Abteilungen muss, bringt der Zeitgewinn im Entwurf nichts — dann liegt der Engpass woanders, und das sollte man vorher wissen.
Wenn Sie eine Bildkampagne brauchen
Eine Marke über zwölf Monate mit Filmproduktion, Fotoshooting und zehn Beteiligten ist ein anderes Geschäft. Das können größere Häuser besser, und wir sagen das auch.
Und eine Sache ändert sich durch kein Werkzeug: Jemand muss wissen, was das Gerät kann, für wen es gebaut ist und warum ein Kunde es der Konkurrenz vorzieht. Diese Antworten kommen aus Ihrem Haus. Alles andere ist Handwerk, und Handwerk lässt sich beschleunigen.
Teil 2:
von der Ansicht zur Website.
Ein klickbarer Entwurf ist noch keine Website. Was danach passiert — die Entwicklung mit Claude Code, die Bildaufbereitung, die Ladezeit, die sieben Prüfungen und die Übergabe — steht in Teil 2: Vom Entwurf zur fertigen Website.
Dazu passend: Wie schnell eine handgebaute Seite wirklich ist und woran das liegt, steht im Leitfaden Website-Geschwindigkeit. Warum wir keine WordPress-Seiten bauen, im Text Kein WordPress. Und was eine Firmenwebsite bei uns kostet, auf der Seite zum Webdesign.
Klartext zum Ablauf.
Wie lange dauert eine Firmenwebsite heute wirklich?
Vom Briefing bis zur fertigen Seite rechnen wir mit sechs bis zehn Wochen. Der Entwurf steht deutlich früher, meist in der ersten oder zweiten Woche. Die Zeit danach geht in Inhalte, Bildaufbereitung, Feinschliff und Technik. Wer sein Material schnell schickt, ist schneller fertig — das ist der einzige Hebel, der wirklich bei Ihnen liegt.
Wir haben keine Texte. Ist das ein Problem?
Nein, das ist der Normalfall. Wir arbeiten mit dem, was da ist: Prospekte, Datenblätter, Angebote, alte Websites, und einem Telefonat mit jemandem, der die Geräte kennt. Daraus entstehen Entwürfe, die Sie korrigieren, statt auf ein leeres Blatt zu schauen. Korrigieren ist deutlich leichter als schreiben.
Nutzt ihr KI — und merkt man das der Seite an?
Ja, wir nutzen sie, und nein, man merkt es der Seite nicht an. Die Werkzeuge beschleunigen den Aufbau von Gestaltung und Code. Die Entscheidungen — was auf die Startseite gehört, wie ein Gerät erklärt wird, welcher Satz stehen bleibt — trifft ein Mensch. Wo KI-Bilder eingesetzt werden, steht das sichtbar am Bild. Wie wir damit umgehen, steht offen im Text über die Zusammenarbeit mit KI.
Bekommen wir am Ende WordPress?
Nein. Wir bauen handgeschriebene Seiten ohne Redaktionssystem, weil das schneller lädt, weniger Angriffsfläche hat und keine Updates braucht. Wenn Sie ein Redaktionssystem wirklich brauchen, sagen wir Ihnen das und empfehlen jemanden. Die Gründe stehen ausführlich im Text Kein WordPress.
Wer kann die Seite später ändern?
Preise, Texte, neue Geräte: Das übernehmen wir im Wartungsvertrag, und meist ist es am selben Tag erledigt. Wenn Sie regelmäßig selbst etwas ändern wollen, sagen Sie das im Briefing — dann bekommen die betreffenden Bereiche eine einfache Eingabemöglichkeit, ohne dass die ganze Seite ein Redaktionssystem braucht.
Was passiert, wenn uns der Entwurf nicht gefällt?
Dann wird er geändert, und zwar während wir sprechen oder am selben Tag. Genau dafür wird früh ein klickbarer Entwurf gebaut statt spät eine fertige Seite. Wenn die Richtung grundsätzlich nicht passt, machen wir eine zweite — das kommt vor und ist eingepreist.
Gehört uns die Seite hinterher?
Ja, vollständig. Dateien, Bildlizenzen, Domain, Hosting und alle Zugänge laufen auf Ihren Namen. Sie können jederzeit mit allem umziehen. Warum das nicht selbstverständlich ist, steht im Text über Abkürzungen im Agenturalltag.
