Eine Website, die konvertiert, basiert auf präzisen technischen Entscheidungen, nicht auf einer Ansammlung von Funktionen. Wir haben zehn konkrete Merkmale ausgewählt, die eine leistungsstarke Website von einem statischen Schaufenster unterscheiden, wobei wir auf die Punkte eingehen, die die meisten Leitfäden nur streifen: Barrierefreiheit, Budget für mobile Leistung und Wartbarkeit des Codes.
1. Budget für mobile JavaScript-Leistung
Die Desktop-Leistung verdeckt oft die Realität vor Ort. Auf mobilen Geräten stellt die Parsing- und Ausführungszeit von JavaScript den Hauptengpass dar, weit mehr als das Gewicht der Bilder.
Wir empfehlen, ein maximales JavaScript-Budget pro Seite bereits in der Entwurfsphase festzulegen. Jedes Drittanbieter-Skript (Analytics, Chat, Werbe-Pixel) verbraucht einen Teil dieses Budgets. Ohne diese Disziplin überschreitet die Summe schnell die akzeptable Grenze und beeinträchtigt die Interaction to Next Paint (INP), die Core Web Vitals-Metrik, die den FID ersetzt hat.
Ein schnelles Website-Revamping nachträglich kostet mehr als das Setzen von Grenzen im Vorfeld. Dieses Prinzip entspricht den praktischen Ratschlägen auf Zone Webmaster, die auf die Notwendigkeit hinweisen, technische Entscheidungen vor der Entwicklung zu strukturieren.
2. Konformität mit RGAA und dem European Accessibility Act
Seit dem 28. Juni 2025 gilt der European Accessibility Act für mehrere Dienstleistungen, die für Verbraucher bestimmt sind: E-Commerce, Banken, Transport, Telekommunikation, E-Books. Mikrounternehmen profitieren von Ausnahmen, aber die Mehrheit der Handelswebsites ist betroffen.
In Frankreich bilden der RGAA 4.1.2 und seine 106 Kriterien, die in 13 Themen unterteilt sind, den operativen Referenzrahmen. Konformität bedeutet nicht nur, Alt-Attribute zu Bildern hinzuzufügen. Sie erfordert ein strukturiertes Audit, die Veröffentlichung einer Barrierefreiheits-Erklärung und, je nach Status der Organisation, einen mehrjährigen Verbesserungsplan.
Die Integration von Barrierefreiheit bereits in der Entwurfsphase (Wahl der Kontraste, Struktur der Formulare, Tastaturnavigation) reduziert die Kosten im Vergleich zu einer späteren Nachbesserung.
3. Informationsarchitektur vor dem Prototyping getestet
Card Sorting und Tree Testing sind zwei schnelle Methoden, um die Struktur einer Website zu validieren, bevor Figma geöffnet wird. Wir beobachten immer noch zu viele Projekte, bei denen die Baumstruktur das interne Organigramm des Unternehmens widerspiegelt, anstatt die tatsächlichen Besucherpfade zu reflektieren.
Ein Tree Testing mit etwa zehn Teilnehmern reicht aus, um Navigationshindernisse zu identifizieren. Die Kosten sind im Vergleich zu einer Menüüberarbeitung nach dem Launch vernachlässigbar.
4. Interaction to Next Paint als zentrale Metrik
Die INP misst die allgemeine Reaktivität einer Seite, indem sie alle Benutzerinteraktionen berücksichtigt, nicht nur die erste. Ein Button, der mehrere Hundert Millisekunden nach einem Klick benötigt, um zu reagieren, beeinträchtigt direkt die Wahrnehmung der Qualität.
Die Optimierung der INP erfolgt durch das Aufteilen von JavaScript in kurze Aufgaben (yield to main thread), die Reduzierung unnötiger DOM-Neurenderings und die Verwendung von content-visibility für Bildschirminhalte. Diese Arbeit erfolgt auf Code-Ebene, nicht in einem Page Builder.
5. Content-Strategie, die auf Suchintention ausgerichtet ist
Inhalte ohne Mapping der Intention zu veröffentlichen, erzeugt nicht qualifizierten Traffic. Jede Seite sollte einer bestimmten Intention entsprechen: informativ, transaktional oder navigational.
In der Praxis bedeutet dies, dass die Startseite nicht mit den Kategorieseiten um die gleichen Anfragen konkurrieren sollte. Die Kannibalisierung zwischen Seiten ist eines der häufigsten SEO-Probleme auf mittelgroßen Unternehmenswebsites.
6. Strukturierte Daten Schema.org ab V1
Strukturierte Daten sind kein Bonus nach dem Launch. Die Implementierung von Schema.org-Tags (Organization, Product, FAQ, BreadcrumbList) bereits in der ersten Version ermöglicht den Zugriff auf erweiterte Ergebnisse in Suchmaschinen, ohne technische Schulden aufholen zu müssen.
Das Markup sollte mit dem Google-Tool zum Testen von erweiterten Ergebnissen validiert und dann in der Search Console überwacht werden, um Fehler sofort zu erkennen.
7. Cache-Politik und CDN, die an das Traffic-Profil angepasst sind
Eine Schaufenster-Website mit monatlich aktualisierten Inhalten und eine E-Commerce-Website mit einem dynamischen Katalog haben nicht die gleiche Cache-Strategie. Wir empfehlen, die Cache-Control-Header nach Ressourcentyp festzulegen:
- Statische Dateien (CSS, JS, Fonts): langfristiger Cache mit Fingerprinting im Dateinamen, um die Invalidierung beim Deployment zu erzwingen.
- HTML-Seiten: kurzfristiger Cache oder stale-while-revalidate, um frische Inhalte ohne Wartezeit für den Besucher bereitzustellen.
- Produktbilder: Zwischen-Caching über CDN mit manueller Löschung möglich, wenn sich das visuelle Material ändert.
8. HTTPS, Sicherheitsheader und Content Security Policy
Das TLS-Zertifikat ist seit Jahren eine Voraussetzung, aber die Sicherheitsheader fehlen auf den meisten professionellen Websites. Content-Security-Policy, X-Content-Type-Options, Referrer-Policy und Permissions-Policy reduzieren die Angriffsfläche, ohne die Leistung zu beeinträchtigen.
Ein Scan mit einem Tool wie Mozilla Observatory zeigt in wenigen Sekunden die fehlenden Header an. Die Konfiguration erfolgt auf Server- oder CDN-Ebene, nicht im CMS.
9. Dokumentiertes Design-System statt starren Prototypen
Ein Design-System (wiederverwendbare UI-Komponenten, Farb-Tokens, Abstandsregeln) gewährleistet die visuelle Konsistenz über die Zeit. Ohne es weicht jede neue Seite oder Funktion vom ursprünglichen Design ab.
Das Design-System erleichtert auch die Zusammenarbeit zwischen Design- und Entwicklungsteams. Dokumentierte Komponenten reduzieren die Rückfragen und beschleunigen die Iterationen nach dem Launch.
- Farb-Tokens und Typografie zentralisiert in CSS-Variablen oder JSON-Design-Tokens.
- Versionierte Komponentenbibliothek (Buttons, Karten, Formulare) mit dokumentierten interaktiven Zuständen.
- Abstands- und Rasterregeln, die über konsistente Utilities angewendet werden, nicht über willkürliche Werte.
10. Wartungsplan und Monitoring nach dem Launch
Eine Website ist ein Dienst, kein festes Lieferobjekt. Ohne aktives Monitoring sammeln sich Leistungsrückgänge und Sicherheitslücken stillschweigend an.
Der Wartungsplan umfasst mindestens die Aktualisierungen des CMS und seiner Erweiterungen, die Überwachung der Core Web Vitals über die Search Console und ein jährliches Barrierefreiheits-Audit, um die RGAA-Konformität aufrechtzuerhalten. Ein wiederkehrendes Budget für diese Wartung zu planen, vermeidet vollständige Überarbeitungen alle drei Jahre.
Diese zehn Merkmale funktionieren nicht isoliert. Eine schnelle, aber unzugängliche Website wird einen wachsenden Teil ihres rechtlichen Publikums verlieren. Eine zugängliche, aber nicht gewartete Website wird Schwachstellen anhäufen. Die Leistung einer Website misst sich an der Stärke ihres schwächsten Gliedes.
