WordPress-Website optimieren
Bilder, Links und Farben in einem Durchgang
Mediathek, Beitragskacheln, Theme-Palette: drei Stellen mit schnellem Gewinn.
WordPress unter Last
Optimieren Sie den Weg der Anfrage, nicht zehn Einstellungen auf Verdacht
Messen Sie zuerst, an welcher Station Zeit, Datenmenge oder Bedienbarkeit verloren geht.
Eine Anfrage, zwei Verarbeitungspfade, ein eigener Bedienungstest
GET /angebote/Liegt fertiges HTML vor?
Core, Theme und aktive Plugins führen Code aus.
Inhalte und Optionen werden gelesen.
Jetzt beginnen Laden und Darstellen der Ressourcen.
srcset + sizes- Alt-Text passt zur Funktion des Bildes
- Beitragskachel hat einen verständlichen Link
- Fokus, Zoom und Kontrast werden manuell geprüft
Erst Befund, dann Änderung
Drei Ansichten zeigen drei Ursachenklassen
Zeigt: Konfiguration, Softwarestand und Hinweise wie fehlendes Seiten-Caching.
Zeigt: Serverantwort, Dateigrößen, Ladereihenfolge und das wichtigste sichtbare Element.
Zeigt: ob schnelle Inhalte auch auffindbar, lesbar und bedienbar sind.
Reihenfolge nach Ursache
Vier Eingriffe mit klarer Gegenprobe
- 01Serverpfad verkürzen
Prüfen Sie zuerst, ob Hosting oder Plugin bereits Seiten-Caching bereitstellt. Konfigurieren Sie eine passende Lösung und leeren Sie den Cache nach Änderungen.
GegenprobeDie Seite bleibt aktuell; wiederholte Aufrufe umgehen unnötige WordPress-Arbeit.
- 02Theme und Plugins einzeln messen
Entfernen Sie nicht benötigte Erweiterungen. Testen Sie verbleibende Kandidaten in derselben Umgebung mehrmals statt nur mit einem einzelnen Lauf.
GegenprobeDie relative Änderung bleibt über mehrere vergleichbare Messungen erkennbar.
- 03Bildvariante passend ausgeben
Nutzen Sie Bilder aus der Mediathek und WordPress-Funktionen. So kann WordPress verfügbare Varianten über
srcsetundsizesanbieten.GegenprobeDer Browser lädt eine zur Darstellung passende Datei; der Alt-Text beschreibt Aussage oder Ziel.
- 04Die Bedienung separat durchlaufen
Prüfen Sie Beitragskarten, Navigation, Formulare und Zoom ohne Maus. Korrigieren Sie globale Farben im Theme statt Beitrag für Beitrag.
GegenprobeFokus bleibt sichtbar, Linkziele verständlich und Inhalte bei Vergrößerung vollständig.
So prüfen Sie es
- Notieren Sie URL, Gerät, Verbindung und Messwerkzeug. Vergleichen Sie denselben Zustand mehrmals.
- Öffnen Sie Werkzeuge → Website-Zustand und ordnen Sie jeden Hinweis dem Server- oder Browserpfad zu.
- Ändern Sie genau eine Ursache. Leeren Sie betroffene Caches und wiederholen Sie dieselbe Messung.
- Gehen Sie die Seite danach mit Tab, 200 Prozent Zoom und ausgeschalteten Bildern durch. Geschwindigkeit und Bedienung erhalten je ein Ergebnis.
Offizielle Quellen
WordPress-Verhalten nachlesen
Aus dem Prüfbericht
Drei Stellen, drei Befunde
Kritisch Bilder aus der Mediathek ohne Alt-Text Regel image-alt
Beim Hochladen kann das Feld leer bleiben. Jedes Bild mit Aussage braucht eine passende Textalternative, rein dekorative Bilder ein leeres alt.
Kritisch Jede Kachel verlinkt nur ihr Vorschaubild Regel link-name
Ist das Bild der ganze Link, wird sein Alt-Text zum Linktext. Er nennt das Ziel, nicht das Motiv.
Kritisch Buttons und Metazeile sind zu blass Regel color-contrast
Die Farben kommen aus dem Theme, nicht aus dem einzelnen Beitrag. Ein dunklerer Wert in der Palette wirkt auf allen Seiten.
Zum Mitnehmen
Die drei Stellen, korrigiert
Ein Alt-Text, ein Bildlink, ein Farbwert.
Korrektur in 3 Schritten ansehen
Bilder beim Hochladen beschriften
Ein informatives Bild bekommt einen Satz, ein rein dekoratives ein leeres alt. Der Dateiname ersetzt beides nicht.
KorrekturvergleichSchritt 1 · HTML Vorher
<figure class="wp-block-image"> <img src="/wp-content/uploads/IMG_2043.jpg" alt="IMG_2043"> </figure>Nachher
<figure class="wp-block-image"> <img src="/wp-content/uploads/IMG_2043.jpg" alt="Bäckerin schiebt Brote in den Steinofen"> </figure>Markierte Zeilen wurden geändert
So prüfen Sie es Blenden Sie Bilder im Browser aus. Statt „IMG_2043“ steht jetzt ein Satz.
Dem Bildlink sein Ziel geben
Ist das Vorschaubild der ganze Link, wird sein Alt-Text zum Linktext. Er nennt das Ziel, nicht das Motiv.
KorrekturvergleichSchritt 2 · HTML Vorher
<a class="post-thumbnail" href="/brotsorten"> <img src="/wp-content/uploads/brote.jpg" alt=""> </a>Nachher
<a class="post-thumbnail" href="/brotsorten"> <img src="/wp-content/uploads/brote.jpg" alt="Unsere Brotsorten"> </a>Markierte Zeilen wurden geändert
So prüfen Sie es In der Linkliste eines Vorleseprogramms steht „Unsere Brotsorten“ statt eines leeren Eintrags.
Die Buttonschrift auf Kontrast bringen
Weiße Schrift auf hellem Grün erreicht 2,1:1. Ein dunkler Ton auf derselben Fläche bringt den Button deutlich über 4,5:1.
KorrekturvergleichSchritt 3 · CSS Vorher
.wp-block-button__link { color: #ffffff; background: #9bbf7a; }Nachher
.wp-block-button__link { color: #14260a; background: #9bbf7a; }Markierte Zeilen wurden geändert
So prüfen Sie es Prüfen Sie Vorder- und Hintergrundfarbe mit einem Kontrastwerkzeug. Für normalen Text zeigt es mindestens 4,5:1.