twentyonepixels.de – Firmenpräsenz
Vollständiger Relaunch der Firmenwebsite mit 45 Services, Kontaktformular, SEO-Optimierung und DSGVO-Compliance.
Projekteinblicke
Die Herausforderung
Die bestehende Website war ein minimaler One-Pager ohne Navigation, Kontaktmöglichkeit oder rechtliche Seiten. Kein SEO, kein Structured Data, kein responsives Design. Potenzielle Kunden konnten weder Leistungen noch Referenzen einsehen.
Unsere Umsetzung
Kompletter Relaunch mit Laravel 12, Vue.js 3.5, Inertia.js und Tailwind CSS v4. Modulares Design-System mit Glass-Card-Effekten und Dark Theme. Vollständige SEO-Implementierung mit JSON-LD Structured Data für jede Seite. 45 Services auf der Leistungsseite, Kontaktformular mit Honeypot-Spam-Schutz und Rate-Limiting.
Das Resultat
Lighthouse Score >= 90 in allen Kategorien. 45 Services übersichtlich dargestellt, vollständig responsive und DSGVO-konform. Umfassendes JSON-LD Schema-Markup für optimale Suchmaschinenerfassung.
Server-Side Rendering, weil KI-Crawler kein JavaScript ausführen
Eine Single-Page-Application liefert im Auslieferungszustand ein nahezu leeres HTML-Dokument aus und baut den Inhalt erst im Browser auf. Googlebot kommt damit inzwischen zurecht — GPTBot, ClaudeBot und PerplexityBot nicht. Diese Crawler lesen den Rohtext der Antwort und ziehen weiter. Ohne Gegenmaßnahme wäre die Website für KI-Suchmaschinen praktisch unsichtbar gewesen, ohne dass es im Browser aufgefallen wäre. Deshalb läuft Inertia mit aktiviertem Server-Side Rendering als eigener Node-Dienst: Jede Seite verlässt den Server als vollständiges HTML. Fällt der Dienst aus, greift automatisch das Client-Rendering — die Website bleibt erreichbar, nur die Maschinenlesbarkeit sinkt.
42 Detailseiten ohne Thin Content
Jede der 45 Leistungen hat eine eigene Detailseite unter /leistungen/{slug} — der klassische Weg, auf dem solche Seitentypen zu austauschbaren Textgerüsten verkommen. Dagegen steht hier eine inhaltliche Mindestanforderung pro Seite: konkrete Anwendungsfälle statt Leistungsversprechen, eine Einordnung der eingesetzten Technologien und ein eigener FAQ-Block. Der Median über alle 75 Seiten der Website liegt bei rund 900 Wörtern. Ergänzt wird das durch interne Verlinkung: Jede Detailseite ist über mindestens zwei eingehende Links aus thematisch passenden Kontexten erreichbar, damit keine Seite nur in der Sitemap existiert.
3.206 automatisierte Tests
Die Website ist mit 2.393 PHP-Tests (PHPUnit) und 813 Frontend-Tests (Vitest) abgesichert, zusammen 3.206 automatisierte Tests — gezählt am 15.10.2026 über "php artisan test --list-tests" und "npx vitest list". Der Schwerpunkt liegt nicht auf Rendering-Details, sondern auf dem, was bei einer Content-Website tatsächlich bricht: Metadaten und Canonicals pro Seite, Gültigkeit der JSON-LD-Schemas, Vollständigkeit der Sitemap gegenüber den registrierten Routen, Rate-Limiting und Honeypot am Kontaktformular sowie die Security-Header. Ergänzt wird die Suite durch End-to-End-Tests mit Playwright über drei Geräteprofile — Desktop, Tablet und Smartphone.
DSGVO-Konformität als Bauentscheidung, nicht als Banner
Die Website lädt keine externen Ressourcen: Schriften liegen selbst gehostet auf dem eigenen Server, es gibt keine Google Fonts, kein CDN und keine eingebetteten Karten von Drittanbietern. Durchgesetzt wird das technisch über eine Content-Security-Policy, die Verbindungen zu fremden Hosts unterbindet — ein versehentlich eingebautes externes Skript würde im Browser blockiert und fiele sofort auf. Der Cookie-Banner ist dadurch keine Voraussetzung für den Seitenaufruf, sondern betrifft nur die optionale Reichweitenmessung. Gehostet wird ausschließlich in deutschen Rechenzentren.
Warum diese Seite ihre eigenen Zahlen prüft
Eine Fallstudie über die eigene Arbeit hat ein Problem, das fremde Fallstudien nicht haben: Sie veraltet mit jedem Arbeitstag. Die Zahl der Tests wächst, die Seitenzahl ändert sich, und niemand denkt beim Schreiben eines neuen Tests daran, eine Fallstudie anzupassen. Am 13.09.2026 stand hier deshalb "1.119 automatisierte Tests", während es tatsächlich 2.904 waren — der Faktor lag bei 2,6, und die Angabe stand ausgerechnet auf der Seite, die die eigene Sorgfalt belegen soll. Die Konsequenz ist kein Vorsatz, sondern ein Test: Er zählt die Testfälle beim Testlauf und vergleicht sie mit der Zahl, die hier im Text steht. Weicht sie ab, wird der Lauf rot und nennt beide Zahlen. Genau das ist zwei Tage später passiert — ein einzelner neuer Frontend-Test verschob die Zahl um eins und meldete die Fallstudie im selben Durchlauf als veraltet. Eine Zahl auf einer Website ist nur so verlässlich wie der Mechanismus, der sie nachrechnet.
Was dieses Projekt nicht leistet
Strukturierte Daten bringen keinen direkten Ranking-Vorteil. Sie machen den Inhalt maschinenlesbar und ermöglichen erweiterte Treffer — die Position in der Trefferliste entscheiden sie nicht.
