So optimieren Sie Bilder für WordPress
Veröffentlicht: 2019-11-12Ihre Bilder sollten für die Einrichtung Ihrer Website eher positiv als schädlich sein. Sie sollten Ihnen dabei helfen, die Ziele zu erreichen, die Sie für Ihre Website festgelegt haben.
Eine langsame Website ist jedermanns Alptraum. Als Websitebesitzer sollten Sie wissen, dass Bilder in ihren Rohformaten schlechte Nachrichten für die Geschwindigkeit Ihrer Website sind. Eine langsame Website-Geschwindigkeit beeinträchtigt Ihre SEO-Rankings und kostet Sie Ihr Publikum. Abgesehen von der Geschwindigkeit sollten Ihre Bilder auch gut positioniert sein, damit Sie so viele Benutzer wie möglich gewinnen und halten können.
In diesem Artikel werden wir Sie durch die verschiedenen Möglichkeiten führen, wie Sie Bilder für WordPress optimieren können. Das Optimieren von Bildern ist nicht in einer einzigen Aktion zu erreichen. Es ist eine Kombination aus mehreren Maßnahmen, die Ihre Website so beeindruckend machen, wie Sie es sich wünschen. Erlauben Sie uns, Sie durch diese einfachen Aktionen zu führen.
Wählen Sie das richtige Bildformat

Wenn Ihre Bilder mehrfarbig sind und einen hohen Kontrast haben, ist JPEG das beste Format, um den Unterschied zu sehen. Sie können Fotos in diesem Format komprimieren, um die Dateigröße zu reduzieren, aber dies beeinträchtigt die Qualität bis zu einem gewissen Grad. Wenn Ihre Bilder hingegen farblich weniger anspruchsvoll sind, ist PNG die beste Option. PNG hat den Vorteil gegenüber JPEG mit Unterstützung für Transparenz in Bildern. Das Komprimieren von PNG-Fotos führt jedoch zu Fotos mit besserer Qualität, jedoch mit größeren Dateigrößen.
Wenn Sie Bilder auf Ihrem Computer bearbeiten, müssen Sie den Dateityp auswählen, in dem Sie Ihre Bilder speichern möchten. Die gebräuchlichsten Formate für Bilder sind JPEG und PNG.
Fazit: Für mehrfarbige Fotos wählen und komprimieren Sie JPEG. Für schlichtere und transparente Fotos wählen Sie PNG.
Ändern Sie die Größe Ihrer Bilder
Das Reduzieren der Abmessungen Ihrer Bilder – unabhängig von ihrem Format – verringert ihre Dateigröße. Je kleiner Sie ein Bild machen, desto mehr schrumpft es in der Größe. Lassen Sie sich jedoch nicht hinreißen und übertreiben Sie es: Berücksichtigen Sie die Breite Ihrer Website und stellen Sie sicher, dass die Breite Ihres Bildes geringer ist. Wenn Sie die neuen Fotos zu klein machen, könnte ihr Inhalt weniger sichtbar sein.
Es ist möglich, Bilder hochzuladen, die die Größe Ihrer Website in der Breite überschreiten, die Ihre Website in Miniaturansichten anzeigt. Dies ändert jedoch nichts an der Tatsache, dass Sie ein großes Bild auf Ihrer Website haben, das Ihre Website verlangsamt. Sie können die Dateigröße um mehr als die Hälfte reduzieren, indem Sie die Größe ändern.
Wenn Sie die Größe Ihres Bildes vor dem Hochladen nicht geändert haben, können Sie bestimmte Fotos in Ihrer WordPress-Medienbibliothek auswählen, bearbeiten und in der Größe ändern.

Bilder zuschneiden

Der Unterschied zwischen Größenänderung und Zuschneiden besteht darin, dass bei der Größenänderung alle Elemente des Originalbilds erhalten bleiben. Andererseits werden beim Zuschneiden einige der Kanten des Originalbilds abgeschnitten.
Die Größenänderung von Bildern bedeutet, dass einige ihrer Elemente winzig und auf jeder Bildschirmgröße kaum sichtbar werden. Das Zuschneiden hilft Ihnen, besonders wenn Sie einen Schwerpunkt für Ihr Bild haben. Sie können unnötige Teile eines Bildes ausschneiden, eine Datei verkleinern und gleichzeitig die interessanten Elemente besser sichtbar machen.
Bilder komprimieren

Nachdem Sie die Größe Ihrer Bilder geändert und zugeschnitten haben, können Sie noch einen Schritt weiter gehen, indem Sie die Bilder komprimieren. Sie können JPEG-Bilder in einem Prozess komprimieren, der als verlustbehaftete Komprimierung bezeichnet wird. Bei diesem Vorgang verlieren Sie einige Daten des Originalbildes, um eine kleinere Bilddatei zu erstellen.
Hier müssen Sie zwischen Bildgröße und Qualität wählen. Die Reduzierung der Größe ist das ultimative Ziel, aber es geht zu Lasten der Qualität. Daher sollten Sie die Größe so weit wie möglich reduzieren, ohne die gewünschte Funktionalität des Bildes zu beeinträchtigen. Allerdings sinkt die Bildqualität bei der Komprimierung nicht allzu sehr. Sie müssen nur nach dem Qualitätsfaktor suchen und entscheiden, ob es Ihnen gefällt.
Der Komprimierungsprozess ist mit online verfügbaren Bildkomprimierungstools möglich. TinyPNG ist das einzige Bildkomprimierungstool, das über 1 Milliarde PNG- und JPEG-optimierte Bilder bietet. Es bietet die perfekte Möglichkeit, Ihre Bilder zu optimieren, bevor Sie sie auf Ihre Website hochladen.
Wie funktioniert TinyPNG mit PNG?

Für PNG-Dateien verwendet TinyPNG intelligente verlustbehaftete Komprimierung, um die Dateigröße zu reduzieren. Das bedeutet zwar eine punktuelle Reduzierung der Bildfarben, ist aber mit bloßem Auge nicht wahrnehmbar und die Dateigröße nimmt dramatisch ab.

Normale unkomprimierte PNG-Bilder enthalten Kombinationen von 24-Bit-Farben. Bei der Komprimierung mit TinyPNG konvertieren Sie sie in immer kleinere 8-Bit-Farbbilder. Dieser auch als Quantisierung bezeichnete Prozess beinhaltet auch das Entfernen unnötiger Metadaten. Mit TinyPNG reduzieren Sie Ihre Dateigröße um über 70 % und machen Ihre Bilder vollständig transparent kompatibel.
Wie gut funktioniert es mit modernen Browsern?

Ein weiterer Aspekt, der TinyPNG einzigartig macht, ist die Unterstützung aller modernen Browser. Trotz der Weigerung von Internet Explorer 6, die Transparenz von PNG anzuerkennen, sorgt TinyPNG für einen transparenten Hintergrund im Browser. Wenn Ihr Browser animierte PNGs (Chrome, Firefox und Safari) unterstützt, können Sie sie gerne ausprobieren.
JPEG-Komprimierung
Wenn Sie eine JPEG-Komprimierung wünschen, suchen Sie nicht weiter. TinyPNG wurde ursprünglich entwickelt, um intelligente JPEG-Bildkomprimierung zu unterstützen, und leistet dabei hervorragende Arbeit.
Wenn Sie mit dem langsamen Laden Ihrer Website frustriert waren, verwenden Sie TinyPNG, bevor Sie Bilder auf Ihre Website hochladen, und erleben Sie den überwältigenden Unterschied. Es spart Ihnen Bandbreite und sorgt dafür, dass Ihre Website schneller geladen wird, indem alle Ihre JPEG- und PNG-Bilder komprimiert werden.
Stellen Sie Bilder von einem CDN bereit

Bei Benutzern, die weit vom Server Ihrer Website entfernt sind, kann es zu langsameren Ladegeschwindigkeiten kommen. Um dies zu erledigen, können Sie ein CDN installieren. Ein CDN ermöglicht es Besuchern, sich über den ihnen am nächsten gelegenen Server zu verbinden. Sobald Sie eine CDN-URL haben, kopieren Sie sie in das Cache-Plugin, das Sie verwenden. Ersetzen Sie die Bild-URLs, sodass sie die URL Ihres CDN enthalten. Auf diese Weise werden Ihre Bilder auch Ihren Besuchern über das gleiche CDN-Kriterium angezeigt.
Verwenden Sie Lazy Loading
Die Natur von WordPress besteht darin, alles gleichzeitig auf eine Seite zu laden – in dem Moment, in dem Sie die Seite anfordern. Da Bilder langsamer geladen werden als Text, verlangsamen sie zwangsläufig das Laden Ihrer Seiten.
Lazy Loading stellt sicher, dass die Bilder, die sich unterhalb der Benutzeroberfläche des Betrachters befinden, nicht geladen werden, sobald eine Seite mit dem Laden beginnt. Stattdessen werden die Bilder oben zuerst geladen; dann wird der Rest geladen, wenn der Besucher zu ihnen herunterscrollt. Auf diese Weise werden Ihre Seiten trotz der darin enthaltenen Bilder schnell geladen. Einige Plugins, die verzögertes Laden ermöglichen, zeigen eine Bildversion mit geringer Qualität an, bis die eigentliche geladen ist.
Zwischenspeichern Sie Ihre Bilder
Wenn Sie eine schnelle Website haben möchten, müssen Sie Cache-Plugins ausprobieren, falls Sie sie noch nicht ausprobiert haben. Das Zwischenspeichern von Inhalten auf Ihrer Website und Ihren Seiten impliziert die Erstellung von Versionen davon, damit sie auf Anfrage sofort verfügbar sind. Ein stellar Cache-Plugin gibt Ihnen die Möglichkeit, Ihre Bilder per „Browser-Caching“ zwischenzuspeichern – eine leicht zugängliche Alternative.
Benennen Sie Ihre Bilddateien angemessen
Stellen Sie beim Hochladen Ihrer Bilder sicher, dass Sie sie benennen. Dabei stellen Sie möglicherweise fest, dass Ihr Plugin ihnen automatisch Alt-Text hinzufügt. Diese Situation ist ideal, da der beste Weg, Ihre Bilder zu benennen, eine einfache Beschreibung ist. Das Hinzufügen zu vieler Schlüsselwörter ist nicht das Richtige für Sie. Keywords geben Ihnen einen Vorteil, wenn es um SEO geht. Wenn Sie jedoch zu viele davon auf Ihren Bildern haben, riskieren Sie Füllstrafen!
Optimieren Sie Ihre Bilder für die Darstellung in Google Snippets
Es ist nicht einfach, Rich Snippets in den Suchergebnissen zu erhalten. Sie müssen einige Schlüsselwörter haben, die den Benutzern präzise und prägnante Antworten geben. Erstellen Sie ein Bild, das die Keywords beschreibt, auf die Sie abzielen. Referenzen in Benutzerqualität für sachliche Inhalte, um Klicks zu inspirieren. Wenn Sie feststellen, dass Sie für das Keyword nicht auf der ersten Seite erscheinen, bearbeiten Sie Ihren Inhalt, um ihn zu verbessern.
Verwenden Sie außerdem Plugins für strukturierte Daten (Schema), um Ihre Chancen auf Rich Snippets zu verbessern.
Verwenden Sie Originalbilder
Vermeiden Sie die Verwendung von Bildern von anderen Websites. Sie verlangsamen Sie, da sie zusätzliche Anforderungen mit sich bringen, um den Server der Website zu befriedigen, von der Sie das Foto ausgeliehen haben.
Endeffekt
Das sind unsere Anweisungen, wie Sie Ihre Bilder für WordPress optimieren können. Wie wir bereits erwähnt haben, können Sie sich nicht einen aussuchen und damit laufen und gute Ergebnisse erwarten. Die Bildoptimierung erfordert eine einheitliche Anstrengung mehrerer Strategien. Stellen Sie sicher, dass Sie die Ideen verstehen, wenden Sie sie an und machen Sie sich bereit, nicht nur Ihre Besucher, sondern auch sich selbst zu überraschen.