Unsere Website ist neu. Nicht überarbeitet, sondern komplett neu gebaut: anderes Fundament, andere Struktur, neue Texte. Von der ersten Konzeption bis heute sind rund zwei Jahre vergangen, und weil wir unseren Kunden regelmäßig erklären, wann sich so ein Schritt lohnt und wann eben nicht, machen wir das hier einmal am eigenen Beispiel. Mit Zahlen, mit etwas Technik, und in einer Sprache, für die man kein Informatikstudium braucht.
Zwei Jahre, zwei Anläufe
Die Seite, die davor jahrelang lief, war handgeschrieben: HTML, CSS und PHP, Zeile für Zeile. Das hat funktioniert, aber jede Änderung bedeutete, in den Code zu greifen. Redaktionell etwas anzupassen war nichts, was man mal eben zwischendurch macht.
Der erste Anlauf war deshalb ein anderer. Wir haben ein neues Design entworfen und es mit Bricks und Elementor auf WordPress umgesetzt, also mit Page-Buildern. Der Schritt war richtig, und er hat uns etwas gezeigt: Das Design trug, aber der Unterbau setzte uns Grenzen, die wir für unsere eigene Seite nicht akzeptieren wollten.
Ein Baukasten nimmt einem viel Arbeit ab und setzt dafür einen Rahmen. Das ist ein fairer Tausch, und für viele Projekte ist er genau richtig. Wir bauen weiterhin gerne Seiten auf dieser Basis, weil sie schnell fertig sind und sich gut selbst pflegen lassen. Bei uns kamen aber Fragen auf, die sich in diesem Rahmen nicht mehr beantworten ließen: Wie hängen Referenzen, Themen und Blogbeiträge miteinander zusammen? Wer bekommt eine Anfrage zu einem bestimmten Thema? Was genau lädt eigentlich im Hintergrund?
Also der zweite Anlauf, diesmal mit Laravel. Dazu kam ein Argument, das ehrlicherweise genauso schwer wog: Wir bauen für Kunden individuelle Anwendungen. Wenn wir das können, sollte man es unserer eigenen Seite ansehen.
Was dabei entstanden ist
Über 800 Arbeitsschritte stecken in der neuen Seite. Ein Arbeitsschritt, im Fachjargon Commit, ist eine gespeicherte Version: vergleichbar mit dem Versionsverlauf in einem Textdokument, nur lückenlos und mit Begründung. Man kann jeden einzelnen davon nachlesen und im Zweifel rückgängig machen.
Was daraus geworden ist:
21 Seitentypen, von der Startseite bis zur Fehlerseite
120 Bausteine, aus denen diese Seiten zusammengesetzt sind
102 automatische Prüfungen, die bei jeder Änderung durchlaufen
112 Weiterleitungen von alten auf neue Adressen
Die 120 Bausteine sind der Punkt, an dem sich Aufwand und Nutzen entscheiden. Eine Referenzkachel, ein Kontaktformular, eine Fragenliste: Jedes dieser Elemente existiert genau einmal und wird überall dort eingesetzt, wo es gebraucht wird. Verbessern wir eins, verbessert es sich auf allen Seiten gleichzeitig. Das ist der Unterschied zwischen einer Seite, die man weiterentwickelt, und einer, an der man immer wieder dieselbe Stelle repariert.
Die 102 Prüfungen laufen automatisch und melden sich, wenn eine Änderung an einer Stelle etwas an einer anderen kaputtmacht. Sie sind der Grund, warum wir an dieser Seite arbeiten können, ohne jedes Mal die halbe Website durchzuklicken.
Drei Entscheidungen, die man sieht
Die Seite kommt fertig bei euch an
Viele moderne Websites schicken dem Browser Einzelteile und eine Bauanleitung. Der Browser setzt daraus die Seite zusammen, und ihr wartet, bis er fertig ist. Wir haben uns für den anderen Weg entschieden: Die Seite wird auf unserem Server fertig zusammengebaut und kommt als fertige Seite an.
Für euch heißt das, der Inhalt ist sofort da. Der wichtigere Teil betrifft aber etwas anderes. Suchmaschinen und KI-Dienste schicken Programme über Websites, die den Inhalt einlesen, und diese Programme führen in aller Regel keinen Programmcode aus. Eine Seite, die erst im Browser entsteht, ist für sie weitgehend leer. Was nicht schon im ausgelieferten Dokument steht, wird nicht gelesen und kann nicht zitiert werden.
Weil bei uns die fertige Seite ausgeliefert wird, sehen Google, ChatGPT und Perplexity denselben Text wie ihr. Das ist die Grundlage dafür, dass eine Seite in Suchergebnissen und in KI-Antworten überhaupt auftaucht. Genau darum geht es bei GEO, der Sichtbarkeit in Antwortmaschinen, und es ist derselbe Rat, den wir im Marketing unseren Kunden geben.
Kein alter Link läuft ins Leere
Bei einem Relaunch ändern sich Adressen. Wer das auf sich beruhen lässt, verliert auf einen Schlag jeden Link, den andere Seiten über die Jahre gesetzt haben, und dazu die aufgebaute Position in der Suche. Das ist der Fehler, der Relaunches teuer macht, und man merkt ihn erst Wochen später.
Wir haben deshalb 112 Weiterleitungsregeln angelegt, bevor die neue Seite online ging. Alte Lesezeichen funktionieren, Links aus fremden Artikeln funktionieren, und die Sichtbarkeit zieht mit um. Der Blog ist vollständig mitgekommen: 79 Beiträge, inklusive ihrer alten Adressen. Nichts davon ist verloren gegangen.
Datenschutz ist eingebaut, nicht nachgerüstet
Alles, was die Seite zum Aussehen und Funktionieren braucht, liegt auf unserem eigenen Server. Schriften und Symbole holen wir nicht bei einem Anbieter, der dabei nebenbei eure IP-Adresse mitbekommt, sondern liefern sie selbst aus. Eingebettete Dienste wie der Terminkalender starten erst, wenn ihr im Banner zustimmt und zusätzlich selbst darauf klickt. Das Kontaktformular kommt ohne reCAPTCHA aus: Es erkennt automatisierte Einsendungen an einem versteckten Feld, das nur Maschinen ausfüllen. Ihr müsst dafür keine Ampeln auf Bildern anklicken.
Datenschutz ist kein Zusatz, den man am Ende dazustellt. Es ist eine Entscheidung, die man beim Aufbau trifft, und danach ist sie kaum noch Arbeit.
Wie die Seite aufgebaut ist
Die Struktur folgt dem, was wir tatsächlich anbieten. Drei Schwerpunkte, drei Seiten:
Marketing: Sichtbarkeit und qualifizierte Anfragen, also Google Ads, SEO, lokale Sichtbarkeit und Conversion-Tracking
Webdesign: Websites und Shops auf Standard-Basis, gestaltet und gebaut für Abschlüsse
Webengineering: alles jenseits des Standards, also individuelle Anwendungen, Shopware, Schnittstellen und KI-Anbindungen
Darunter liegen drei Ebenen, und die stehen bewusst nicht nebeneinander, sondern sind miteinander verknüpft.
Die Referenzen sind der Beweisteil. 33 Projekte, jedes einem Schwerpunkt zugeordnet, dazu einem Projekttyp wie Relaunch oder Onlineshop und mehreren Fachthemen. Diese Zuordnung ist der Grund, warum ihr euch durch die Referenzen filtern könnt, statt eine lange Liste durchzuscrollen.
Die Themenseiten gehen ins Detail. 34 Themen, von Ladezeit über Shopware bis Barrierefreiheit, und jede beantwortet dieselbe Frage: Was habt ihr davon, wenn wir das übernehmen? Diese Themen sind gleichzeitig die Klammer der ganzen Seite. Sie verknüpfen Referenzen, sie verknüpfen Blogbeiträge, und sie steuern, wer bei einer Anfrage zu diesem Thema antwortet. Eine Shopware-Frage landet dadurch nicht in einem Sammelpostfach, sondern bei der Person, die Shopware macht.
Der Blog hängt an denselben Themen. Ein Beitrag über Ladezeiten steht damit automatisch neben der passenden Themenseite und den Projekten, in denen wir daran gearbeitet haben.
Der JFcompanion beantwortet Fragen, bevor ihr sie tippt
Eine Sache am Relaunch ist keine Technik, sondern eine Beobachtung. Wer sich durch eine Leistungsseite liest, hat irgendwann eine Frage. Meistens passiert dann nichts davon, was wir uns wünschen würden: Weiterlesen und hoffen, dass die Antwort noch kommt. Oder zum Kontaktformular springen, die Frage selbst formulieren und frühestens am nächsten Werktag eine Antwort bekommen. Am häufigsten aber: gehen. Das sieht man in keiner Statistik als das, was es ist, nämlich als unbeantwortete Frage.
Klassische Chat-Fenster lösen das schlecht. Sie sitzen als anonymer Kreis in der Ecke, wissen nichts über die Seite, auf der sie sitzen, und begrüßen jeden mit demselben leeren Eingabefeld. Ein leeres Feld ist aber eine Aufgabe, kein Angebot: Man muss erst selbst formulieren, was man eigentlich wissen will.
Der JFcompanion macht es andersherum. Er weiß, welchen Abschnitt ihr gerade lest, und schlägt genau die zwei bis drei Fragen vor, die dazu passen. Ein Klick genügt, tippen kann man, muss man aber nicht. Jede Antwort bringt weiterführende Fragen mit, sodass ein Gespräch entsteht, ohne dass jemand eine Frage erfinden muss. Was er nicht weiß, sagt er, statt etwas zu erfinden, und wenn es konkreter wird, verbindet er direkt weiter: per Mail, Telefon oder mit einem Termin beim passenden Ansprechpartner.
Er ist damit kein Spielzeug, sondern die logische Fortsetzung der Themen-Struktur weiter oben. Und er ist nicht auf unsere Seite beschränkt: Ein Assistent, der die eigenen Inhalte kennt und Besucher zum richtigen Ansprechpartner bringt, lässt sich für andere Websites genauso bauen.
Ein Blick unter die Oberfläche
Als Fundament arbeitet Laravel, für die Bedienung im Browser React, für die Gestaltung Tailwind CSS. Die Inhalte pflegen wir in Filament, einem Redaktionsbereich, den wir passend zu dieser Seite gebaut haben, statt einen fertigen zurechtzubiegen. Genau das ist der Unterschied zur handgeschriebenen Seite von früher: Der Code liegt bei den Entwicklern, die Inhalte bei der Redaktion.
Eine Kleinigkeit daran gefällt uns besonders: Die Anmeldung im Redaktionsbereich hat kein Passwort mehr. Wer sich anmeldet, gibt seine Adresse ein und bekommt einen Link ins Postfach, der 15 Minuten gültig ist und genau einmal funktioniert. Ein Passwort, das es nicht gibt, kann nicht schwach sein, nicht mehrfach verwendet werden und bei keinem fremden Datenleck auftauchen.
Bei der Geschwindigkeit haben wir uns eine Marke gesetzt: mindestens 95 von 100 Punkten im Lighthouse-Test von Google, und zwar in allen vier Kategorien, nicht nur beim Tempo. Barrierefreiheit und saubere Technik zählen dort genauso.
Was als Nächstes kommt
Eine Website ist mit dem Start nicht fertig, sie fängt da erst an. Die nächsten Schritte stehen: weitere Referenzen, mehr Themenseiten, und ein Blog, der wieder regelmäßiger wird. Diesen Beitrag könnt ihr als Auftakt lesen.
Falls ihr beim Lesen an eure eigene Seite gedacht habt: Genau diese Fragen stellen wir auch in Kundenprojekten, und genau diese Bausteine bauen wir auch für andere. Ob Baukasten oder Individualentwicklung die richtige Basis ist, entscheidet das Ziel, nicht die Technik, die gerade in Mode ist. In vielen Fällen ist die einfache Lösung die richtige, und das sagen wir dann auch. Wir schauen uns das gerne mit euch an, und ein erstes Gespräch kostet nichts.
Ein Auftritt, der verkauft
Pascal ist seit 2017 bei JFconcept und verantwortet seit 2023 das Webdesign. Du siehst deinen Entwurf als klickbaren Prototyp, bevor wir bauen, nicht als PDF zum Vorstellen. Datenschutz denken wir von Anfang an mit, statt die Seite hinterher DSGVO-fähig zu machen, und das technische SEO-Fundament gehört zu jedem Projekt: saubere Struktur, Sitemap, schnelle Ladezeiten.
