Das beste Bildformat für WordPress ist WebP für Fotos und Grafiken, mit JPG und PNG als automatische Fallbacks und SVG für Logos und Symbole. WordPress macht einen großen Teil des Webs aus, und Bilder sind normalerweise das schwerste Element auf jeder Seite, die es bereitstellt. Daher hat das Format, das Sie hochladen, direkten Einfluss darauf, wie schnell Ihre Website geladen wird und wie gut sie rankt. WordPress erledigt eine Menge für Sie und generiert mehrere Größen für jeden Upload, wählt aber nicht das ideale Format aus, es sei denn, Sie richten es ein. In diesem Leitfaden erfahren Sie, welches Format Sie verwenden sollten, wie WordPress Bilder verarbeitet und welche Einstellungen und Plugins dafür sorgen, dass eine WordPress-Site schnell bleibt.

Warum das Bildformat bei WordPress so wichtig ist

Auf einer typischen WordPress-Seite machen Bilder den Großteil der Bytes aus, die ein Besucher herunterlädt. Das bedeutet Das Bildformat ist der größte Hebel für die Seitengeschwindigkeit, und die Seitengeschwindigkeit fließt direkt in die Core Web Vitals ein, die Google als Ranking-Signal verwendet. Ein Theme kann schlank und das Hosting schnell sein, aber eine Seite voller übergroßer JPGs wird trotzdem gecrawlt. Die Wahl eines effizienten Formats und die Bereitstellung von Versionen in angemessener Größe durch WordPress ist die wirkungsvollste Optimierung, die die meisten Websites vornehmen können, und sie kostet nur ein wenig Einrichtung.

Wie WordPress mit Bild-Uploads umgeht

Wenn Sie ein Bild hochladen, speichert WordPress es nicht nur. Es erstellt automatisch mehrere verkleinerte Kopien, Miniaturansicht, mittel, groß und vollständig, sodass für jeden Kontext eine geeignete Größe bereitgestellt werden kann. Außerdem wird das responsive srcset-Markup erstellt, damit Browser für jedes Gerät die richtige Größe auswählen. Das ist leistungsstark, funktioniert aber mit allem, was Sie hochladen, sodass ein 5000-Pixel-Original in jeder Größe aufgeblähte Kopien erzeugt. Das Hochladen eines effizient komprimierten Originals in sinnvoller Größe bedeutet, dass auch jede generierte Version schlank ist.

WebP: der moderne Standard

WebP ist das Format zur Standardisierung. Es erzeugt Dateien 25 bis 35 % kleiner als JPG bei gleicher Qualität, unterstützt Transparenz wie PNG und wird mittlerweile von jedem aktuellen Browser unterstützt. WordPress unterstützt WebP-Uploads seit Version 5.8 und kann mit dem richtigen Plugin automatisch WebP-Versionen Ihrer vorhandenen JPGs und PNGs bereitstellen und für jeden Browser, der diese nicht anzeigen kann, auf das Original zurückgreifen. Die Umstellung einer Medienbibliothek auf WebP ist oft der größte Geschwindigkeitsgewinn, den eine WordPress-Site erzielen kann.

JPG und PNG als Fallbacks

WebP bedeutet nicht, die älteren Formate aufzugeben. JPG bleibt der sichere Ersatz für Fotos und PNG für Grafiken, die Transparenz benötigen, und ein gutes Optimierungs-Plugin behält die Originale bei, sodass jeder Browser ohne WebP-Unterstützung immer noch ein funktionierendes Image erhält. In der Praxis laden Sie wie gewohnt ein JPG oder PNG hoch und das Plugin generiert und stellt daneben ein WebP bereit und stellt die kleinere Datei bereit, wo es kann. Dadurch profitieren Sie von den Einsparungen von WebP, ohne dass das Kompatibilitätsrisiko besteht. Aus diesem Grund handelt es sich um die empfohlene Einrichtung und nicht nur um WebP.

SVG für Logos und Icons

Für Ihr Logo und Ihre Schnittstellensymbole übertrifft SVG jedes Rasterformat. Es ist Vektor, so dass es bei jeder Bildschirmdichte aus einer winzigen Datei gestochen scharf bleibt. WordPress erlaubt aus Sicherheitsgründen standardmäßig keine SVG-Uploads, da ein SVG Skript enthalten kann. Sie aktivieren es daher mit einem Plugin, das die Dateien beim Hochladen bereinigt. Nach der Aktivierung ist ein als SVG bereitgestelltes Logo kleiner und schärfer als ein PNG-Äquivalent und muss nie in mehreren Größen generiert werden. Reservieren Sie SVG für Logos, Symbole und einfache Grafiken, niemals für Fotos.

Auswahl der richtigen Bildgrößen

WordPress generiert mehrere Größen, aber Sie steuern die Abmessungen. Stellen Sie die ein groß und nicht breiter als Ihr Inhaltsbereich, oft etwa 1200 bis 1600 Pixel, sodass Bilder in voller Breite nicht unnötig groß sind. Das Hochladen eines 4000-Pixel-Fotos, wenn Ihre Inhaltsspalte 800 Pixel breit ist, verschwendet Bandbreite, selbst nachdem WordPress die Größe geändert hat, da die größte generierte Kopie immer noch übergroß ist. Passen Sie die Größe Ihrer registrierten Bilder an das tatsächliche Layout Ihres Themes an, und jedes Bild, das auf der Website bereitgestellt wird, bleibt proportional zu der Position, an der es angezeigt wird.

Komprimierungs- und Optimierungs-Plugins

Ein Optimierungs-Plugin automatisiert die gesamte Pipeline. Beliebte Optionen Komprimieren Sie jeden Upload, generieren Sie WebP-Versionen und können Sie unnötige Metadaten entfernen, und das alles, ohne dass Sie ein Bild mit der Hand berühren müssen. Viele optimieren auch Ihre vorhandene Bibliothek in großen Mengen, indem sie jahrelang gesammelte JPGs und PNGs in einem Durchgang in WebP konvertieren. Einige verlagern die Verarbeitung auf ihre eigenen Server, um Ihr Hosting zu schonen. Wofür Sie sich auch entscheiden, der Effekt ist derselbe: Bilder kommen automatisch komprimiert und im besten Format auf der Seite an, was weitaus zuverlässiger ist, als jedes einzelne Bild manuell zu optimieren.

Faules Laden von Bildern

Beim verzögerten Laden werden Bilder zurückgestellt, bis ein Besucher in deren Nähe scrollt, sodass beim ersten Laden einer Seite nur das abgerufen wird, was sofort sichtbar ist. WordPress ermöglicht standardmäßig Lazy Loading bei Bildern unterhalb des Falzes, wobei das Ladeattribut automatisch hinzugefügt wird. Dies beschleunigt den ersten Malvorgang auf bildlastigen Seiten spürbar. Die einzige Ausnahme ist Ihr größtes „Above-the-Fold“-Bild, oft das Hero, das schnell geladen werden sollte, damit es die Metrik „Größter Contentful Paint“ nicht verzögert. Mit den meisten Optimierungs-Plugins können Sie dieses Bild mit einer einzigen Einstellung vom Lazy Loading ausschließen.

Metadaten entfernen

Fotos enthalten Metadaten, Kameramodell, GPS-Standort und Farbprofile, die eine Website selten benötigt und die ihr Gewicht erhöhen. Durch das Entfernen dieser Metadaten wird jede Datei verkleinert ohne sichtbare Änderung, und die meisten Optimierungs-Plugins tun dies als Teil der Komprimierung. Das Entfernen von GPS-Daten hat auch einen Vorteil für die Privatsphäre, da Sie wahrscheinlich nicht veröffentlichen möchten, wo ein Foto aufgenommen wurde. Die einzigen Metadaten, die es wert sind, aufbewahrt zu werden, sind das Farbprofil, wenn es auf die Farbgenauigkeit ankommt. Andernfalls führt das Entfernen zu einer kostenlosen, unsichtbaren Größenreduzierung in der gesamten Bibliothek.

Ein empfohlenes WordPress-Bild-Setup

Wenn Sie es zusammenbauen, ist die Einrichtung unkompliziert. Registrieren Sie Bildgrößen, die zum Layout Ihres Themes passen. Installieren Sie ein Optimierungs-Plugin, das Uploads komprimiert, WebP mit Fallbacks generiert und bereitstellt und Metadaten entfernt. Aktivieren Sie bereinigtes SVG für Ihr Logo und Ihre Symbole. Behalten Sie das Standard-Lazy-Loading von WordPress bei, aber laden Sie Ihr Heldenbild eifrig. Laden Sie dann einfach Originale in angemessener Größe hoch und lassen Sie die Pipeline den Rest erledigen. Wenn dies eingerichtet ist, wird jedes Bild auf der Website komprimiert, hat die richtige Größe und wird automatisch im besten Format bereitgestellt, und die Website bleibt schnell, auch wenn die Bibliothek wächst.

AVIF: die

nächster Schritt über WebP hinaus

AVIF ist das neueste effiziente Format und wird auch von WordPress unterstützt. Es komprimiert sogar kleiner als WebP, oft noch einmal 20 % kleiner, bei gleicher visueller Qualität, mit Unterstützung für Transparenz und breite Farben. Die Browserunterstützung ist jetzt umfassend, liegt jedoch etwas hinter WebP zurück, sodass AVIF am besten mit einem WebP- oder JPG-Fallback funktioniert. Einige Optimierungs-Plugins können AVIF automatisch neben WebP generieren. Für eine Website, die die letzten paar Kilobyte von jedem Bild wegjagt, lohnt es sich, AVIF zu aktivieren, obwohl WebP vorerst das sichere Primärformat bleibt.

Die Mediathek und das Housekeeping

Mit der Zeit füllt sich eine WordPress-Medienbibliothek mit ungenutzten Bildern, alten Versionen und Duplikaten, die Backups aufblähen und den Administrator überfordern. Durch regelmäßiges Ausräumen ungenutzter Medien bleibt die Bibliothek überschaubar und Ihre Backups sind schlank. Plugins können Bilder identifizieren, die keinem Beitrag oder keiner Seite angehängt sind. Es lohnt sich jedoch, sie vor dem Löschen zu überprüfen, da einige Bilder auf eine Weise verwendet werden, die der Scan nicht erkennen kann. Eine aufgeräumte Medienbibliothek erleichtert das Arbeiten und vermittelt nach der Optimierung ein klares Bild davon, wie viel Platz Ihre Bilder tatsächlich einnehmen.

Miniaturansichten nach einem Theme-Wechsel neu generieren

Wenn Sie das Thema wechseln oder Ihre registrierten Bildgrößen ändern, haben vorhandene Uploads weiterhin die alten generierten Größen. Durch die Regenerierung von Miniaturansichten werden alle Größen aus den Originalen neu erstellt um den neuen Dimensionen zu entsprechen, was ein dediziertes Plugin in großen Mengen in der gesamten Bibliothek erledigt. Wenn Sie dies überspringen, können Bilder unter dem neuen Thema gestreckt oder in der falschen Größe angezeigt werden. Dies ist ein einmaliger Schritt nach jeder Änderung Ihrer Bildgrößen, und durch die Ausführung bleibt die gesamte Bibliothek mit der tatsächlichen Darstellung der Bilder im aktuellen Design konsistent.

CDN-Lieferung für Bilder

Ein Content-Delivery-Netzwerk beschleunigt die Bildbereitstellung, indem es Dateien von einem Server in der Nähe jedes Besuchers bereitstellt. Ein CDN speichert Ihre Bilder an Edge-Standorten weltweit zwischen, sodass ein Leser, der weit von Ihrem Host entfernt ist, trotzdem schnell Bilder erhält. Viele WordPress-Optimierungs- und Caching-Plugins integrieren ein CDN, und einige bildspezifische CDNs konvertieren und ändern ihre Größe auch im Handumdrehen und verarbeiten Format und Abmessungen automatisch. Bei einer Website mit einem globalen Publikum oder starkem Datenverkehr beseitigt ein CDN den Engpass bei der Bildbereitstellung und entlastet gleichzeitig Ihren Ursprungsserver.

Ausgewählte Bilder und soziale Vorschauen

Das vorgestellte Bild jedes Beitrags erfüllt eine doppelte Funktion: Es erscheint in Ihrem Theme und über Open Graph-Tags als Vorschau, wenn der Beitrag geteilt wird. Stellen Sie ausgewählte Bilder auf eine Größe ein, die für soziale Vorschauen geeignet ist, etwa 1200 x 630, damit geteilte Links im Feed gut aussehen. Ein SEO-Plugin ordnet das vorgestellte Bild normalerweise automatisch dem Open Graph-Tag zu. Wenn Sie dies richtig machen, zeigt jeder Beitrag, der geteilt wird, ein sauberes Bild mit der richtigen Größe und nicht nur ein abgeschnittenes Miniaturbild oder gar nichts.

Testen Sie Ihre Bildleistung

Messen Sie nach der Optimierung das Ergebnis. Tools wie PageSpeed Insights melden bildbezogene Probleme, wodurch übergroße Bilder, fehlende moderne Formate und Bilder ohne Abmessungen, die zu Layoutverschiebungen führen, gekennzeichnet werden. Sie knüpfen direkt an Core Web Vitals an, sodass ihre Ratschläge den von Google gemessenen Werten entsprechen. Die Durchführung eines Tests vor und nach einem Optimierungsdurchlauf zeigt genau, wie viel schneller die Seite geworden ist, und hebt alle Bilder hervor, die sie noch behindern. Betrachten Sie diese Berichte als Checkliste, um das letzte Gewicht aus Ihren Bildern herauszuholen.

Häufige WordPress-Bildfehler

Ein paar Gewohnheiten verlangsamen WordPress-Seiten ganz leise. Hochladen von Kamerabildern in voller Auflösung, Überspringen der Komprimierung und Nichtaktivierung von WebP sind am häufigsten und hinterlassen jeweils große Dateien dort, wo kleine Dateien ausreichen würden. Andere umfassen das Vergessen, die Bildabmessungen festzulegen, was zu einer Verschiebung des Layouts führt, und die Verwendung eines langsamen, funktionsreichen Plugins, das mehr Gewicht hinzufügt als spart. Jedes dieser Probleme lässt sich mit dem oben beschriebenen Setup leicht beheben. Wenn Sie sie vermeiden, bleibt eine WordPress-Site schnell, während sie wächst, anstatt zuzusehen, wie sie Jahr für Jahr langsamer wird, wenn sich die Bibliothek füllt.

Was ist das beste Bildformat für WordPress?

WebP für Fotos und Grafiken mit JPG- und PNG-Fallbacks und SVG für Logos. WebP-Dateien sind bei gleicher Qualität 25 bis 35 % kleiner als JPG und werden von jedem aktuellen Browser unterstützt.

Unterstützt WordPress WebP?

Ja, seit WordPress 5.8. Sie können WebP direkt hochladen und ein Optimierungs-Plugin kann WebP-Versionen bestehender JPGs und PNGs automatisch mit Fallbacks bereitstellen.

Kann ich SVG-Dateien in WordPress hochladen?

Aus Sicherheitsgründen nicht standardmäßig. Ein Plugin, das SVGs beim Hochladen bereinigt Aktiviert es sicher, wodurch Logos und Symbole, die als SVG bereitgestellt werden, kleiner und schärfer als PNG sind.

Benötige ich ein Bildoptimierungs-Plugin?

Es wird dringend empfohlen. Ein Plugin komprimiert Uploads, generiert WebP und entfernt Metadaten automatisch, was weitaus zuverlässiger ist, als jedes Bild von Hand zu optimieren.

Sollte ich die Größe von Bildern ändern, bevor ich sie auf WordPress hochlade?

Ja. Laden Sie nicht breiter als Ihren Inhaltsbereich hoch, oft 1200 bis 1600 Pixel. Ein riesiges Original macht jede Größe, die WordPress daraus generiert, auch übergroß.

Unterstützt WordPress AVIF?

Ja. AVIF komprimiert etwa 20 % kleiner als WebP in der gleichen Qualität, und einige Optimierungs-Plugins generieren es automatisch. Stellen Sie es mit einem WebP- oder JPG-Fallback bereit, um vollständige Browserunterstützung zu erhalten.

Sollte ich ein CDN für WordPress-Bilder verwenden?

Für eine globale oder stark frequentierte Website, ja. Ein CDN speichert Bilder an Edge-Standorten weltweit zwischen, sodass entfernte Besucher sie schnell erhalten und die Last von Ihrem Ursprungsserver abfällt.

Warum sehen meine Bilder nach einem Themenwechsel falsch aus?

Weil vorhandene Uploads ihre alten generierten Größen behalten. Durch die Regenerierung von Miniaturansichten werden alle Größen aus den Originalen neu erstellt passend zu den Dimensionen des neuen Themas.

Sollte ich WordPress-Bilder verzögert laden?

Ja, und WordPress ermöglicht standardmäßig Lazy Loading auf Bildern unterhalb des Falzes. Lassen Sie es eingeschaltet, aber laden Sie Ihr Hauptbild „above-the-fold“ eifrig, damit es den größten Contentful Paint nicht verzögert.