Sie haben Ihre Website in PageSpeed Insights geprüft und ein rotes Ergebnis unter 50 bekommen. Der erste Impuls: Panik, Frust, “Das geht nie zu beheben.”

Atmen Sie tief durch. Ich habe Hunderten Websites geholfen, von rotem zu grünem Score zu kommen. Und die gute Nachricht: Viele Probleme sind erstaunlich einfach zu lösen – oft in weniger als 10 Minuten pro Fix.

In diesem Artikel zeige ich Ihnen die 10 häufigsten Performance-Probleme und wie Sie diese Schritt für Schritt beheben. Keine Theorie, keine komplizierte Erklärungen – einfach Dinge, die Sie direkt tun können.

Am Ende dieses Artikels sollten Sie einen Score von mindestens 80 erreichen, oft sogar 90+.

Warum PageSpeed überhaupt wichtig ist

Bevor wir loslegen, kurz die Frage: Warum sollten Sie sich überhaupt kümmern?

Google Rankings

Google verwendet seit 2021 die Core Web Vitals als Ranking-Faktor. Websites mit guten PageSpeed-Werten ranken besser – besonders bei mobilen Suchen. Das ist keine Theorie, sondern Fakt.

Konversionen

Langsame Websites verkaufen weniger. Studien zeigen:

  • 1 Sekunde Verzögerung = 7% weniger Conversions
  • 40% der Nutzer verlassen eine Website, wenn sie länger als 3 Sekunden lädt
  • Jede 100ms Verbesserung steigert die Konversionsrate um 1%

Gute Performance = bessere Konversionen = mehr Umsatz.

Nutzererfahrung

Niemand wartet gerne. Eine schnelle Website fühlt sich professioneller an, ist angenehmer zu nutzen und kommt besser an.

Mobile Performance

Auf Mobilgeräten ist Performance noch wichtiger. Langsame Verbrennen Daten, sind nervig, und Nutzer verlassen die Seite schneller.

Die 3 Core Web Vitals im Detail

PageSpeed Insights misst nicht einen einzigen Score, sondern mehrere Metriken. Die wichtigsten sind die Core Web Vitals:

1. LCP (Largest Contentful Paint) – 2,5 Sekunden oder besser

Was ist das? Die Zeit, bis der größte Inhalt (meist ein Bild oder Textblock) sichtbar ist.

Ziel: Unter 2,5 Sekunden (grün)

2. FID (First Input Delay) – 100 Millisekunden oder besser

Was ist das? Die Zeit, bis die Website auf den ersten Klick/Tap des Nutzers reagiert.

Ziel: Unter 100 ms (grün)

Hinweis: FID wird durch INP (Interaction to Next Paint) abgelöst, aber PageSpeed zeigt noch beide an.

3. CLS (Cumulative Layout Shift) – 0,1 oder besser

Was ist das? Wie stark sich Elemente beim Laden verschieben (das nervige “Klick auf den falschen Button”).

Ziel: Unter 0,1 (grün)

Fix #1: Bilder komprimieren (5 Minuten)

Das Problem: Unkomprimierte oder zu große Bilder sind die häufigste Ursache für schlechte PageSpeed-Werte.

Schritt 1: Problem identifizieren

Öffnen Sie PageSpeed Insights und scrollen Sie zu “Möglichkeiten”. Suchen Sie nach:

  • “Bilder effizient codieren”
  • “Größen von Bildern nicht korrekt”

Schritt 2: Bilder manuell komprimieren (gratis)

Nutzen Sie Online-Tools wie:

Vorgehen:

  1. Bild hochladen
  2. Komprimieren lassen
  3. Gedankt komprimierte Version herunterladen
  4. Auf Server hochladen, alte Datei überschreiben

Typische Ersparnis: 60-80% Dateigröße bei kaum sichtbarem Qualitätsverlust.

Schritt 3: Bilder in richtigen Dimensionen bereitstellen

Ein 2000x2000px Bild, das auf Ihrer Website nur 500x500px angezeigt wird, verschwendet Bandbreite.

Lösung:

  • In Photoshop/GIMP auf die benötigte Größe skalieren
  • Oder mit einem Plugin automatisch skalieren lassen (siehe Fix #2)

Schritt 4: Modernes Format verwenden

WebP ist deutlich kleiner als JPEG oder PNG bei gleicher Qualität.

WordPress-Lösung: Plugin wie WebP Express oder ShortPixel nutzen, das automatisch WebP-Versionen erstellt und diese Browsern anbietet.

WordPress-Nutzer: Fix #2 lesen (Image Optimization Plugin).

Fix #2: Image-Optimization Plugin installieren (WordPress, 5 Minuten)

Wenn Sie WordPress nutzen, machen Sie das automatisch mit einem Plugin.

Empfohlene Plugins

Kostenlose Plugins:

  • WebP Express – Erstellt WebP-Versionen, super leichtgewichtig
  • Imagify – Kostenlos bis zu 25MB/Monat, sehr einfach
  • ShortPixel – Kostenlos bis zu 100 Bilder/Monat

Premium-Plugins:

  • Smush Pro – Unbegrenzt, sehr zuverlässig
  • WP Rocket – Beinhaltet Image-Optimierung + Caching
  • ShortPixel Image Optimizer – Advanced features wie Lazy Load

Installation (am Beispiel WebP Express)

  1. WordPress-Backend → Plugins → Installieren
  2. “WebP Express” suchen
  3. Installieren und aktivieren
  4. Gehen Sie zu Einstellungen → WebP Express
  5. “Run Test” klicken
  6. Wenn alles grün ist: Speichern

Das Plugin macht jetzt automatisch:

  • WebP-Versionen aller Bilder erstellen
  • Browsern die WebP-Versionen anbieten
  • Fallback zu JPG/PNG für alte Browser

Erwartetes Ergebnis: +10-20 Punkte im PageSpeed Score, 30-60% weniger Bandbreite.

Fix #3: Browser Caching aktivieren (5 Minuten)

Das Problem: Jedes Mal, wenn ein Nutzer Ihre Website besucht, werden alle Ressourcen neu geladen – auch wenn sie sich nie ändern.

Browser Caching speichert Dateien (CSS, JS, Bilder) lokal im Browser des Nutzers. Beim nächsten Besuch laden diese dann fast augenblicklich.

WordPress-Lösung

Am besten mit Caching-Plugin:

WP Rocket (Premium, empfohlen)

  1. Installieren und aktivieren
  2. Aktivieren Sie “Browser Caching”
  3. Fertig – WP Rocket konfiguriert alles automatisch

W3 Total Cache (Kostenlos)

  1. Installieren und aktivieren
  2. General Settings → Browser Cache
  3. Alle Checkboxen aktivieren
  4. Save all settings

WP Super Cache (Kostenlos)

  1. Installieren und aktivieren
  2. Einstellungen → Easy
  3. Caching aktivieren
  4. Leichtere Option als W3 Total Cache

Nicht-WordPress: .htaccess (Apache Server)

Falls Sie Zugriff auf .htaccess haben, fügen Sie hinzu:

<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresByType image/jpg "access plus 1 year"
    ExpiresByType image/jpeg "access plus 1 year"
    ExpiresByType image/gif "access plus 1 year"
    ExpiresByType image/png "access plus 1 year"
    ExpiresByType text/css "access plus 1 month"
    ExpiresByType application/pdf "access plus 1 month"
    ExpiresByType text/javascript "access plus 1 month"
    ExpiresByType application/javascript "access plus 1 month"
</IfModule>

Nginx-Server

Fügen Sie zu nginx.conf hinzu:

location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ {
    expires 1y;
    add_header Cache-Control "public, immutable";
}

Fix #4: Text-Komprimierung aktivieren (5 Minuten)

Das Problem: HTML, CSS und JavaScript sind unkomprimiert, obwohl Gzip oder Brotli sie um 60-80% verkleinern könnte.

WordPress-Lösung (mit Caching-Plugin)

Die meisten Caching-Plugins aktivieren Gzip automatisch:

WP Rocket: Automatisch aktiviert

W3 Total Cache:

  1. General Settings → Browser Cache
  2. “Enable HTTP (gzip) compression” aktivieren
  3. Speichern

WP Super Cache:

  1. Advanced → Cache hits to this website for quick access
  2. “Compress pages so they’re served more quickly to visitors” aktivieren

Nicht-WordPress: .htaccess (Apache)

<IfModule mod_deflate.c>
    # Compress HTML, CSS, JavaScript, Text, XML and fonts
    AddOutputFilterByType DEFLATE application/javascript
    AddOutputFilterByType DEFLATE application/rss+xml
    AddOutputFilterByType DEFLATE application/vnd.ms-fontobject
    AddOutputFilterByType DEFLATE application/x-font
    AddOutputFilterByType DEFLATE application/x-font-opentype
    AddOutputFilterByType DEFLATE application/x-font-otf
    AddOutputFilterByType DEFLATE application/x-font-truetype
    AddOutputFilterByType DEFLATE application/x-font-ttf
    AddOutputFilterByType DEFLATE application/x-javascript
    AddOutputFilterByType DEFLATE application/xhtml+xml
    AddOutputFilterByType DEFLATE application/xml
    AddOutputFilterByType DEFLATE font/opentype
    AddOutputFilterByType DEFLATE font/otf
    AddOutputFilterByType DEFLATE font/ttf
    AddOutputFilterByType DEFLATE image/svg+xml
    AddOutputFilterByType DEFLATE image/x-icon
    AddOutputFilterByType DEFLATE text/css
    AddOutputFilterByType DEFLATE text/html
    AddOutputFilterByType DEFLATE text/javascript
    AddOutputFilterByType DEFLATE text/plain
    AddOutputFilterByType DEFLATE text/xml
</IfModule>

Nginx-Server

gzip on;
gzip_types text/plain text/css application/json application/javascript text/xml application/xml application/xml+rss text/javascript;

Brotli (noch besser als Gzip)

Brotli ist effizienter als Gzip (ca. 15-20% mehr Kompression). Prüfen Sie, ob Ihr Server Brotli unterstützt:

Apache: Modul mod_brotli installieren

Nginx: Modul ngx_brotli installieren

WordPress-Plugin: Brotli Plugin kann Brotli aktivieren, wenn Ihr Server es unterstützt.

Fix #5: JavaScript und CSS minimieren (5 Minuten)

Das Problem: JavaScript- und CSS-Dateien enthalten Leerzeichen, Kommentare, Umbrüche – alles unnötig, das Bandbreite frisst.

WordPress-Lösung

Mit den meisten Caching-Plugins:

WP Rocket:

  1. Settings → File Optimization
  2. “Minify CSS” aktivieren
  3. “Minify JavaScript” aktivieren
  4. Speichern

W3 Total Cache:

  1. Minify → General
  2. Minify aktivieren
  3. JS und CSS aktivieren
  4. Speichern

WP Super Cache:

  1. Advanced → Minify
  2. JavaScript und CSS aktivieren

Nicht-WordPress: Manuelle Tools

JavaScript:

CSS:

Vorgehen:

  1. Original-Datei speichern (Backup!)
  2. Inhalt in das Tool kopieren
  3. Minifierte Version kopieren
  4. Original damit überschreiben

Vorsicht: Manchmal bricht Minifizierung den Code. Testen Sie nach dem Minifizieren immer gründlich!

Fix #6: Render-blocking JavaScript entfernen (10 Minuten)

Das Problem: JavaScript-Dateien im <head> blockieren das Rendering. Der Browser muss erst alle JS laden und ausführen, bevor der Nutzer etwas sieht.

Die Lösung: JavaScript asynchron oder verzögert laden

Asynchron (async): Skript lädt im Hintergrund, wird ausgeführt sobald fertig. Nicht geeignet für Skripte, die andere Skripte abhängig sind.

Verzögert (defer): Skript lädt im Hintergrund, wird erst ausgeführt NACHDEM der DOM fertig ist.

WordPress-Lösung

Mit Caching-Plugin:

WP Rocket:

  1. Settings → File Optimization
  2. “Load JavaScript deferred” aktivieren
  3. Speichern

W3 Total Cache:

  1. Minify → Advanced
  2. “Non-blocking using defer” aktivieren

Plugin Async JavaScript:

  1. Installieren und aktivieren
  2. Einstellungen → Async JavaScript
  3. “Enable Async JavaScript” aktivieren
  4. Meistens “defer” ist sicherer als “async”

Nicht-WordPress: Manuell

Ändern Sie <script>-Tags von:

<script src="script.js"></script>

Zu:

<script src="script.js" defer></script>

Oder:

<script src="script.js" async></script>

Wann defer, wann async?

  • defer: Für die meisten Skripte sicherer, keine Abhängigkeitsprobleme
  • async: Für Skripte, die nicht abhängig sind, schneller

Fix #7: CSS inline für Above-the-Fold (15 Minuten)

Das Problem: CSS-Dateien blockieren das Rendering. Der Nutzer sieht erst etwas, nachdem ALLE CSS geladen ist.

Die Lösung: Das für den sichtbaren Bereich (above-the-fold) notwendige CSS direkt inline in das HTML einbetten. Den Rest async laden.

Schritt 1: Above-the-Fold CSS extrahieren

Online-Tool:

  1. Öffnen Sie Ihre Website
  2. Drücken Sie F12 (DevTools)
  3. Gehen Sie zum Tab “Sources”
  4. Öffnen Sie die CSS-Datei
  5. Kopieren Sie das CSS für die sichtbaren Elemente (Header, Hero, Navigation)

Automatisch:

Schritt 2: Critical CSS inline einbetten

Fügen Sie das extrahierte CSS in den <head> ein:

<head>
<style>
/* Ihr Critical CSS hier */
body { margin: 0; font-family: sans-serif; }
.hero { background: #333; color: white; padding: 50px 0; }
/* ... weiteres CSS für above-the-fold ... */
</style>

<link rel="stylesheet" href="style.css" media="print" onload="this.media='all'">
</head>

Der link-Tag mit dem Trick lädt das restliche CSS asynchron.

WordPress-Lösung

Plugin CriticalCSS

  1. Installieren und aktivieren
  2. Scannt automatisch Critical CSS
  3. Bettet es inline ein

WP Rocket Premium

  1. Settings → Advanced Rules
  2. “Remove unused CSS” (CSS-Optimierung)
  3. Automatisch extrahiert und inline-bettet

Fix #8: Lazy Loading für Bilder (5 Minuten)

Das Problem: Alle Bilder laden sofort, auch die, die der Nutzer gar nicht sieht (ganz unten auf der Seite).

Die Lösung: Lazy Loading – Bilder laden erst, wenn sie in den sichtbaren Bereich scrollen.

Native Browser Lazy Loading (moderne Browser, empfohlen)

Fügen Sie einfach loading="lazy" zu <img>-Tags hinzu:

<img src="image.jpg" loading="lazy" alt="..." width="800" height="600">

Wichtig: Geben Sie immer width und height an, damit der Browser den Platzhalter vorab korrekt rendern kann (verhindert Layout Shifts).

WordPress-Lösung

Seit WordPress 5.5: Lazy Loading ist automatisch für alle <img>-Tags aktiviert!

Für ältere Versionen:

  • a3 Lazy Load – Kostenlos, einfach
  • WP Rocket: Integriert
  • Lazy Load by WP Rocket – Gratis-Version

Plugin a3 Lazy Load:

  1. Installieren und aktivieren
  2. Einstellungen → alles Standard lassen
  3. Fertig

Plugin Lazy Load by WP Rocket:

  1. Installieren und aktivieren
  2. Keine Konfiguration nötig

Nicht-WordPress: JavaScript-Library

Nutzen Sie eine JavaScript-Library wie:

  • lazysizes – Sehr populär, lightweight
  • Intersection Observer API – Native Browser-API, keine Library nötig

Beispiel mit Intersection Observer:

document.addEventListener("DOMContentLoaded", function() {
  var lazyImages = [].slice.call(document.querySelectorAll("img.lazy"));

  if ("IntersectionObserver" in window) {
    let lazyImageObserver = new IntersectionObserver(function(entries, observer) {
      entries.forEach(function(entry) {
        if (entry.isIntersecting) {
          let lazyImage = entry.target;
          lazyImage.src = lazyImage.dataset.src;
          lazyImage.srcset = lazyImage.dataset.srcset;
          lazyImage.classList.remove("lazy");
          lazyImageObserver.unobserve(lazyImage);
        }
      });
    });

    lazyImages.forEach(function(lazyImage) {
      lazyImageObserver.observe(lazyImage);
    });
  }
});

HTML:

<img class="lazy" data-src="image.jpg" data-srcset="image.jpg 1x, image@2x.jpg 2x" alt="...">

Fix #9: Drittanbieter-Scripte reduzieren (10 Minuten)

Das Problem: Facebook Pixel, Google Analytics, YouTube-Videos, Twitter-Feeds – alle laden externe Scripte, die Performance killen.

Schritt 1: Alle Drittanbieter-Scripte identifizieren

Öffnen Sie PageSpeed Insights → “Drittanbieter-Usage”

Oder DevTools → Network → filtern nach externen Domains.

Schritt 2: Priorisieren: Brauchen Sie das wirklich?

Typische Drittanbieter-Scripte und Alternativen:

ScriptWirklich nötig?Alternative
Google AnalyticsJa, für TrackingCookielose Alternative: Plausible, Fathom
Google FontsNein, nicht von GoogleLokal hosten (siehe Google Fonts Guide)
Facebook PixelJa, für RetargetingCookie-Banner nötig (siehe Cookie-Banner Guide)
YouTube-VideosJa, für ContentYouTube-Privacy-Enhanced: youtube-nocookie.com
Google MapsVielleichtOpenStreetMap als Alternative
Twitter-FeedWahrscheinlich nichtStatischer Screenshot oder Link
Instagram-FeedWahrscheinlich nichtLink statt embed
Chat-Widget (Intercom, etc.)VielleichtVerzögert laden oder nur auf bestimmten Seiten

Schritt 3: Scripte verzögert laden

Laden Sie Drittanbieter-Scripte erst, wenn:

  • Der Nutzer eingewilligt hat (Cookie-Banner)
  • Die Website vollständig geladen ist
  • Der Nutzer interagiert (z.B. Scrollen)

WordPress-Lösung:

  • WP Rocket kann Drittanbieter-Scripte verzögert laden
  • Cookie-Banner Plugins (Borlabs, Real Cookie Banner) blockieren Scripte bis zur Einwilligung

Nicht-WordPress:

// Erst laden, wenn Nutzer zum Ende der Seite scrollt
document.addEventListener('scroll', function() {
  var footer = document.getElementById('footer');
  var rect = footer.getBoundingClientRect();
  
  if (rect.top < window.innerHeight) {
    loadScript('https://connect.facebook.net/en_US/fbevents.js');
    // Remove event listener after loading
    document.removeEventListener('scroll', arguments.callee);
  }
});

Schritt 4: Self-Hosten statt CDN

Manche Scripte können Sie selbst hosten:

  • jQuery (falls Ihre Website es nutzt): Herunterladen und lokal hosten
  • Font Awesome: Lokal hosten statt CDN
  • Google Fonts: Lokal hosten

Vorteil: Weniger DNS-Lookups, schneller Laden, mehr Kontrolle.

Fix #10: HTTP/2 oder HTTP/3 aktivieren (5-10 Minuten)

Das Problem: HTTP/1.1 kann nicht viele gleichzeitige Anfragen. HTTP/2 und HTTP/3 sind schneller.

Prüfen, ob Sie bereits HTTP/2/3 nutzen

Online-Tool:

Chrome DevTools:

  1. F12 → Network
  2. Spalte “Protocol” hinzufügen (Rechtsklick auf Tab-Header → Spalten aktivieren)
  3. Seite neu laden
  4. Sehen Sie “h2” oder “h3” in der Spalte? Dann ist HTTP/2/3 aktiv.

HTTP/2 aktivieren

Apache:

<IfModule http2_module>
    Protocols h2 http/1.1
</IfModule>

Nginx:

listen 443 ssl http2;

Cloudflare: HTTP/2/3 ist automatisch aktiviert (wenn Sie Cloudflare nutzen).

cPanel:

  1. cPanel → Software → Select PHP Version
  2. HTTP/2 aktivieren (falls verfügbar)

HTTP/3 (QUIC) aktivieren

HTTP/3 ist noch schneller als HTTP/2, besonders bei instabilen Verbindungen (mobil).

Apache (nicht direkt unterstützt): HTTP/3 ist in Apache noch nicht verfügbar (Stand 2026). Nginx oder Cloudflare nutzen.

Nginx:

listen 443 ssl http3;
listen 443 ssl http2;

Cloudflare: HTTP/3 ist in allen Plänen verfügbar. Einfach in Cloudflare-Dashboard aktivieren:

  1. Network → HTTP/3 with QUIC
  2. Aktivieren

Zusätzliche Quick-Wins (weniger als 5 Minuten)

Datenbank optimieren (WordPress)

Überlagerte Datenbank verlangsamt Ladezeiten.

Plugin: WP-Optimize

  1. Installieren und aktivieren
  2. Database → Run all selected cleanups
  3. Automatische Optimierung aktivieren

Unused CSS/JS entfernen

Oder CSS-/JS-Dateien, die gar nicht benutzt werden.

WordPress-Plugin: Asset CleanUp

  1. Installieren und aktivieren
  2. Scannt auf jeder Seite nicht benutztes CSS/JS
  3. Kann pro Seite deaktivieren

Vorsicht: Kann Layout/Functionality kaputt machen. Testen Sie nach dem Deaktivieren gründlich!

Server-Upgrade prüfen

Shared Hosting ist oft langsam. Prüfen Sie:

  • PHP-Version aktualisieren (mindestens PHP 8.1)
  • Server-Geografie: Server in Deutschland oder Österreich, wenn Ihre Nutzer dort sind
  • CDN nutzen: Cloudflare kostenlos, beschleunigt weltweit

HTTPS aktivieren (falls nicht vorhanden)

HTTPS ist nicht nur sicherer, sondern auch schneller wegen HTTP/2.

Let’s Encrypt ist kostenlos. Viele Hoster haben One-Click-Installation.

Nach den Fixes: Seite neu testen

Nachdem Sie einige Fixes umgesetzt haben, testen Sie Ihre Seite erneut:

  1. PageSpeed Insights öffnen
  2. URL eingeben
  3. Analysieren
  4. Score prüfen

Erwartung:

  • Nach allen 10 Fixes: 80-100 Score
  • Nach 5 Fixes: 60-80 Score
  • Nach 2-3 Fixes: 50-70 Score

Wichtig: Testen Sie Desktop und Mobile separat. Mobile ist oft schwieriger und benötigt mehr Optimierung.

Die 10 Fixes auf einen Blick (Zeitaufwand)

#FixZeitErwarteter Score-Gain
1Bilder komprimieren5 Min+10-15
2Image-Plugin (WP)5 Min+10-20
3Browser Caching5 Min+5-10
4Text-Komprimierung5 Min+5-8
5JS/CSS minimieren5 Min+5-10
6Async JS10 Min+8-12
7Critical CSS15 Min+10-15
8Lazy Loading5 Min+5-10
9Drittanbieter-Scripte10 Min+10-20
10HTTP/2/35-10 Min+5-8

Gesamtzeit: ca. 1 Stunde für alle 10 Fixes
Erwarteter Score-Gain: +50-80 Punkte (wenn vorher 30, dann 80-110)

Häufige Fehler und wie Sie sie vermeiden

Fehler 1: Minifiziertes JS bricht die Website

Wenn Sie JavaScript manuell minimieren, kann es passieren, dass Code kaputt geht.

Lösung: Immer Backup der Original-Datei. Testen Sie nach der Minifizierung gründlich (Klick durch alle wichtigen Seiten).

Fehler 2: Critical CSS falsch extrahiert → Layout zerstört

Wenn Sie zu wenig CSS extrahieren, sieht die Seite kurz anders aus (Flash of Unstyled Content). Wenn Sie zu viel extrahieren, vergrößern Sie das Inline-CSS zu sehr.

Lösung: Nutzen Sie lieber ein Tool (WP Rocket, CriticalCSS Plugin) als manuell.

Fehler 3: Lazy Loading verursacht Layout Shifts

Wenn Sie width und height nicht angeben, weiß der Browser nicht, wie groß das Platzhalter-Bild sein soll. Das verursacht Layout Shifts (CLS).

Lösung: Geben Sie IMMER width und height bei Lazy Loading an.

Fehler 4: Cache-Fehler nach Optimierung

Manchmal sehen Nutzer nach Optimierungen alte Versionen wegen Cache.

Lösung:

  • Browser-Cache leeren (Ctrl+Shift+R)
  • Plugin-Cache leeren (WP Rocket: Clear Cache)
  • CDN-Cache leeren (Cloudflare: Purge Everything)

Fehler 5: Mobile Score viel schlechter als Desktop

Das ist normal. Mobile hat:

  • Langsamere CPU
  • Weniger RAM
  • Langsamere Netzwerke (oft 4G statt Gigabit)
  • Batterie-Einschränkungen

Lösung:

  • Besonders auf Bilder achten (Mobile braucht kleinere Bilder)
  • Weniger Drittanbieter-Scripte
  • Critical CSS noch wichtiger für Mobile

Für WordPress: Das ultimative Performance-Setup

Wenn Sie WordPress nutzen, hier mein empfohlenes Setup:

Hosting

  • Empfohlen: Kinsta, WP Engine, Raidboxes (Managed WordPress Hosting)
  • Günstig: All-Inkl, Hetzner (aber: mehr Konfiguration nötig)

Plugins (Minimal-Setup)

  1. Caching: WP Rocket (Premium) oder W3 Total Cache (Kostenlos)
  2. Image-Optimierung: WebP Express oder ShortPixel
  3. Lazy Loading: In WP Rocket integriert oder a3 Lazy Load
  4. Cookie-Banner: Borlabs Cookie (für DSGVO-Compliance)
  5. Datenschutz: Local Google Fonts für lokales Font-Hosting

Zu vermeiden

  • Zu viele Plugins (mehr als 30 sind zu viel)
  • Page Builders wie Divi/Elementor in der Standard-Konfiguration (langsam)
  • Billige Themes mit eingebauten Overhead

Für Nicht-WordPress: Alternativen

Next.js (React)

Sehr schnell aus der Box mit Server-Side Rendering und Automatic Code Splitting.

Gatsby (React)

Statisch generierte Sites, extrem schnell, perfekt für Blogs/Portfolio-Websites.

Hugo (Statische Sites)

Rasend schnell, kein PHP, keine Datenbank, perfekt für Dokumentationen/Blogs.

Laravel (PHP)

Mit Varnish-Cache und Optimierung schnell für komplexe Web-Apps.

PageSpeed ist nicht alles: Core Web Vitals才是

Ein Score von 100 ist nett, aber die Core Web Vitals sind wichtiger für Nutzererfahrung und Google-Ranking.

Konzentrieren Sie sich auf:

  1. LCP < 2,5 Sekunden – Größtes Element schnell sichtbar
  2. INP < 200 ms – Schnelle Reaktion auf Nutzerinteraktion
  3. CLS < 0,1 – Keine Layout-Shifts

Wenn diese drei grün sind, ist alles andere zweitrangig.

Monitoring: Performance überwachen

Nachdem Sie optimiert haben, überwachen Sie Performance regelmäßig:

PageSpeed Insights

Testen Sie monatlich Desktop und Mobile.

Google Search Console

Unter “Erlebnis mit Web Vitals” sehen Sie, wie Core Web Vitals auf echte Nutzerdaten performen.

Monitoring-Tools

  • Google Lighthouse CI – Automatische Tests bei jedem Deploy
  • WebPageTest – Detaillierte Wasserfall-Diagramme
  • GTmetrix – Alternative zu PageSpeed Insights

Zusammenfassung: Ihr 1-Stunden-Fahrplan

Hier ist ein konkreter Fahrplan, wie Sie in 1 Stunde von Score 30 zu 80+ kommen:

Minute 0-5: Initial-Test

  1. PageSpeed Insights öffnen, URL testen
  2. Score notieren, häufigste Probleme identifizieren

Minute 5-10: Bilder komprimieren (Fix #1)

  1. Tinypng.com oder Squoosh nutzen
  2. Alle Hauptbilder komprimieren

Minute 10-15: Image-Plugin installieren (Fix #2)

  1. WebP Express oder ShortPixel installieren
  2. Konfigurieren und laufen lassen

Minute 15-20: Caching aktivieren (Fix #3)

  1. WP Rocket oder W3 Total Cache installieren
  2. Browser Caching aktivieren

Minute 20-25: Text-Komprimierung (Fix #4)

  1. Gzip aktivieren (im Caching-Plugin oder .htaccess)

Minute 25-30: JS/CSS minimieren (Fix #5)

  1. Minify im Caching-Plugin aktivieren

Minute 30-40: Async JavaScript (Fix #6)

  1. Async JavaScript aktivieren oder Plugin installieren

Minute 40-50: Lazy Loading (Fix #8)

  1. Lazy Loading im Caching-Plugin aktivieren

Minute 50-55: Drittanbieter prüfen (Fix #9)

  1. Nicht benötigte Widgets entfernen
  2. Scripte verzögert laden

Minute 55-60: HTTP/2 prüfen (Fix #10)

  1. HTTP/2-Test
  2. Falls nötig: Server-Konfiguration ändern

Minute 60: Neu-Test

  1. Cache leeren
  2. PageSpeed Insights neu testen
  3. Score prüfen

Sie brauchen Hilfe bei der Performance-Optimierung?

Sie haben die Fixes ausprobiert, aber der Score ist immer noch unter 50? Keine Sorge, Performance-Optimierung kann komplex sein.

Nutzen Sie unseren kostenlosen Website-Check. Wir analysieren:

  • PageSpeed Score (Desktop & Mobile)
  • Core Web Vitals
  • Ladezeiten
  • Spezifische Optimierungsempfehlungen
  • Welche Fixes priorisiert werden sollten

Sie bekommen einen konkreten Plan, wie Sie Ihre Website beschleunigen können.

Weitere hilfreiche Artikel:

Starten Sie jetzt Ihre Performance-Optimierung – Ihre Besucher werden es danken!