Website Speed & Performance: Was kannst du besser machen?
Der Mister Marketing Website Check baut auf den Analysen von Google Lighthouse auf. Schneidet deine Website in den Ergebnissen schlechter ab als erwartet? Hier findest du ein paar Verbesserungsvorschläge, wie du sie optimieren kannst. Die hier angeführten Empfehlungen beziehen sich jedoch nicht ausschließlich auf die Parameter des Google Lighthouse Checks. Sie helfen dir generell dabei, das Beste aus deiner Website herauszuholen. In diesem Artikel erfährst du, wie du die Geschwindigkeit und Performance deiner Website verbessern kannst.
Speed
Die Ladezeit ist nicht nur für die Benutzerfreundlichkeit, sondern auch für das Suchmaschinenranking wichtig. Du solltest dich vor allem mit den Themen Bildoptimierung, Seitengröße und Webserver auseinandersetzen.
Page Weight
Wenn deine Website zu groß ist, wirkt sich das auf die Ladezeit aus. Reduziere daher unnötige Daten, beispielsweise durch:
Bildkomprimierung
Sprites (mehrere Bilder/Icons als ein Bild laden)
Schriftkomprimierung
Codekomprimierung
Serverladezeit
Eine Verbesserung der Serverladezeit kannst du durch folgende Maßnahmen erreichen:
Schnellere Webserver verwenden
Serverseitige Code- und Datenoptimierung
Verwenden eines CDNs (Daten vom nahegelegenster Server holen)
Performance
Für bessere Ergebnisse optimiere die folgenden Werte:
First Contentful Paint (FCP)
Lazyload-Eigenschaften (Daten werden erst geladen, wenn sie im sichtbaren Bereich sind)
Asynchrone Datenbeschaffung (weniger wichtige Daten werden erst geladen, wenn alle anderen bereits vorhanden sind)
DOM-Optimierung (technische Struktur der Website)
Speed Index
Minimieren der Hauptthread-Prozesse
Reduzieren der JavaScript-Ausführungszeit
Sicherstellen, dass der Text während des Ladens der Schriftarten sichtbar ist
Largest Contentful Paint (LCP)
Inhalte vorladen
Clientseitiges Rendering optimieren
CSS- und JavaScript-Optimierung
Time to Interactive (TTI)
Reduzieren von Drittanbietercode
Anzahl der Anfragen niedrig und die Transfergröße klein halten
Cumulative Layout Shift (CLS)
Iframes (z.B. Werbebanner) am Anfang der Seite verhindern
Inhalte dimensionieren (Höhe und Breite vergeben)
Bildoptimierung
Große Bilder verlangsamen Webseiten, was zu einem schlechten Benutzererlebnis führt. Die Optimierung findet entweder mit einem Plug-In oder einem Skript statt. Die wichtigsten Optimierungsschritte sind:
Bilder in modernen Formaten bereitstellen (z.B. WebP)
Bilder richtig dimensionieren
Bilder effizient codieren
Progressive Web App (PWA)
Wenn du deine Website beziehungsweise deine Webapplikation als PWA entwickelst, funktioniert sie auch z.B. bei schlechter Internetverbindung. Grund dafür ist die Verwendung modernster Technologien wie Service Worker oder Cache-Spezifikationen.