Da die H\u00e4lfte der Daten, die Besucher beim Aufrufen Ihrer Website herunterladen m\u00fcssen, aus Bildern stammt, kann jede Optimierung, die Sie hier vornehmen, einen gro\u00dfen Einfluss auf die Leistung Ihrer Website haben.<\/p>\n
Wenn Ihre Bilder \u00fcberhaupt nicht optimiert sind, k\u00f6nnen Sie Ihr Bildgewicht<\/strong> nach dieser Anleitung um 50-80% reduzieren<\/strong>.<\/p>\n Bei der Bildoptimierung gibt es drei einfache Techniken.<\/p>\n Die erste und effektivste M\u00f6glichkeit, Ihre Bilder zu optimieren, besteht darin, sie zu komprimieren.<\/p>\n Klicken Sie hier, um ShortPixel selbst auszuprobieren<\/a><\/p>\n Die Bildkomprimierung ist das wichtigste Mittel zur Optimierung von Grafiken. Wenn Sie dem Optimierungsleitfaden von WP Rocket<\/a> gefolgt sind, werden Sie mit dem dort eingef\u00fchrten Minimierungskonzept vertraut sein. Die Bildkomprimierung ist nicht so anders.<\/p>\n Beim Komprimieren eines Bildes schreibt ein Algorithmus im Grunde den Code im Bild um, um die Gesamtdateigr\u00f6\u00dfe zu reduzieren. Es gibt zwei Hauptarten der Komprimierung.<\/p>\n Die verlustfreie Komprimierung optimiert Ihre Bilder unter Beibehaltung der exakt gleichen Pixel-f\u00fcr-Pixel-Anzeige. Es gibt keinen Grund, die verlustfreie Komprimierung zu \u00fcberspringen, da sie die Dateigr\u00f6\u00dfe reduziert und buchst\u00e4blich keinen visuellen Unterschied macht.<\/p>\n Ich habe jedoch empfohlen, stattdessen verlustbehaftete Komprimierung zu verwenden.<\/p>\n Die verlustbehaftete Komprimierung bietet eine viel gr\u00f6\u00dfere Optimierung, jedoch auf Kosten einer geringf\u00fcgigen Verschlechterung der Qualit\u00e4t. Dieser Qualit\u00e4tsverlust ist jedoch so gering, dass er oft nicht wahrnehmbar ist.<\/p>\n Verlustfreie Komprimierung ist wichtig f\u00fcr medizinische Bildgebung und technische Zeichnungen, aber f\u00fcr Bilder, die auf einer Website angezeigt werden, erf\u00fcllt verlustbehaftet problemlos unsere Qualit\u00e4tsstandards.<\/p>\n Ich empfehle das ShortPixel-<\/a> Plugin zur Bildoptimierung, das ich hier bei Compete Themes verwende. Es umfasst verlustbehaftete und verlustfreie Komprimierung sowie eine "gl\u00e4nzende" Komprimierung, die eine Art Zwischenoption ist.<\/p>\n ShortPixel komprimiert Bilder automatisch, wenn Sie sie auf Ihre Website hochladen, was sehr praktisch sein kann. Da ich beim Bearbeiten eher ungeduldig bin, schalte ich diese Option lieber aus und optimiere die Bilder sp\u00e4ter \u00fcber das Medienmen\u00fc.<\/p>\n Automatische Komprimierung beim Hochladen kann deaktiviert werden<\/p>\n Sie k\u00f6nnen ein Tool wie TinyPNG verwenden<\/a>, um Ihre Bilder zu komprimieren, aber ich finde es einfacher, die Bilder wie immer auf meine Site hochzuladen und sie dann mit ShortPixel zu optimieren.<\/p>\n Hier zeichnet sich ShortPixel<\/a> wirklich aus.<\/p>\n Wenn Sie ein Tool wie TinyPNG verwenden, um Ihre Bilder zu optimieren, optimieren Sie nur die neuen Bilder, die Sie auf Ihre Site hochladen. Was ist mit all den Bildern, die Sie bereits hochgeladen haben? Wie optimiert man sie?<\/p>\n ShortPixel verf\u00fcgt \u00fcber eine gro\u00dfartige Option zur Massenoptimierung, die alle Ihre Bilder gleichzeitig durchl\u00e4uft.<\/p>\n Das obige Bild ist mit Ausnahme des Teils \u201ekleinere Miniaturansichten“ ziemlich selbsterkl\u00e4rend. Warum gibt es 4x so viele kleinere Thumbnails und was sind sie \u00fcberhaupt?<\/p>\n Sie wissen das vielleicht nicht, aber wenn Sie ein Bild in WordPress hochladen, werden automatisch drei zus\u00e4tzliche Gr\u00f6\u00dfen erstellt (wenn das Bild gro\u00df genug ist):<\/p>\n Sie k\u00f6nnen die Abmessungen dieser Bildgr\u00f6\u00dfen im Men\u00fc Einstellungen > Medien anzeigen und bearbeiten.<\/p>\n Hier ist das Problem\u2026<\/p>\n Angenommen, Sie komprimieren ein Bild und laden es dann auf Ihre Website hoch. Die \u201eVoll“-Version ist vollst\u00e4ndig optimiert, die drei zus\u00e4tzlichen Gr\u00f6\u00dfen jedoch nicht. Wenn Sie die \u201emittlere“ Version des Bildes in einen Beitrag einf\u00fcgen, ist dieses Bild unkomprimiert. ShortPixel optimiert die von Ihnen hochgeladenen Originalbilder und alle zus\u00e4tzlichen Gr\u00f6\u00dfen, die WordPress erstellt.<\/p>\n Sie werden allein durch die Komprimierung eine beeindruckende Leistungssteigerung erzielen, aber es gibt zwei weitere einfache M\u00f6glichkeiten, Bilder auf Ihrer Website weiter zu optimieren.<\/p>\n Angenommen, Sie laden ein Bild mit einer Gr\u00f6\u00dfe von 5.000 x 2.500\u00a0Pixeln auf Ihre Website hoch. Sie f\u00fcgen es dann in einen Beitrag ein, wo es mit 800 x 400 Pixel angezeigt wird. Obwohl das Bild auf dem Bildschirm des Besuchers nur 800px breit ist, m\u00fcssen sie die 5.000px-Version herunterladen.<\/p>\n Unn\u00f6tig zu erw\u00e4hnen, dass ein Bild mit einer Breite von 5.000 Pixeln riesig ist und das Laden wahrscheinlich l\u00e4nger dauert als jede andere Datei auf Ihrer Website zusammen.<\/p>\n Es gibt zwei M\u00f6glichkeiten, dies zu vermeiden.<\/p>\n Als allgemeine Faustregel gilt, dass Sie keine Bilder hochladen, die gr\u00f6\u00dfer als 2.000\u00a0Pixel sind. Unabh\u00e4ngig davon, ob Sie Windows oder Mac verwenden, verf\u00fcgen Sie \u00fcber einen einfachen Bildeditor, mit dem Sie zu gro\u00dfe Bilder vor dem Hochladen schnell in der Gr\u00f6\u00dfe \u00e4ndern k\u00f6nnen.<\/p>\n Ein weiterer Tipp ist, die \u201eVollversion“ zu vermeiden, wenn Sie ein \u00fcbergro\u00dfes Bild in einen Beitrag einf\u00fcgen. W\u00e4hlen Sie stattdessen die Gr\u00f6\u00dfe "Gro\u00df", die standardm\u00e4\u00dfig 1024px betr\u00e4gt.<\/p>\n Es ist einfach, die Gr\u00f6\u00dfe von Bildern zu \u00e4ndern, bevor Sie sie hochladen, aber was ist mit denen, die sich bereits auf Ihrer Website befinden?<\/p>\n ShortPixel<\/a> verf\u00fcgt \u00fcber eine Einstellung, mit der Sie eine maximale Breite und H\u00f6he f\u00fcr Ihre Bilder festlegen k\u00f6nnen.<\/p>\n Sie k\u00f6nnen diese Option so einstellen, dass die Bilder beim \u00c4ndern der Gr\u00f6\u00dfe nie beschnitten werden. Sobald Sie diese Einstellung aktiviert haben, k\u00f6nnen Sie den Massenoptimierer ausf\u00fchren und ShortPixel passt die Gr\u00f6\u00dfe aller \u00fcberm\u00e4\u00dfig gro\u00dfen Bilder an, auf die es st\u00f6\u00dft. Es wird auch die Gr\u00f6\u00dfe neuer Bilder \u00e4ndern, wenn Sie sie hochladen.<\/p>\n Wenn Sie viele gro\u00dfe Bilder verwendet haben, ist dies m\u00f6glicherweise der vorteilhafteste Schritt f\u00fcr Ihre Website. Es gibt nur noch eine weitere Optimierungstechnik und sie ist die bisher einfachste.<\/p>\n Bilddateien k\u00f6nnen zus\u00e4tzliche Daten enthalten, die nicht im Bild selbst angezeigt werden, die als EXIF-Daten bezeichnet werden. Das EXIF \u200b\u200bkann sehr n\u00fctzlich sein und enth\u00e4lt Informationen wie den Kamerahersteller, Datum und Uhrzeit der Aufnahme und sogar die GPS-Koordinaten.<\/p>\n Sie ben\u00f6tigen diese Daten nicht, die an die Bilder angeh\u00e4ngt werden, die Sie auf Ihrer Website ver\u00f6ffentlichen. Ganz zu schweigen davon, dass es aus Datenschutzgr\u00fcnden wahrscheinlich am besten ist, wenn Ihre Fotos keine GPS-Koordinaten enthalten!<\/p>\n Auch das<\/a> erledigt ShortPixel<\/a> f\u00fcr uns problemlos. Es ist standardm\u00e4\u00dfig eine Einstellung aktiviert, die w\u00e4hrend des Optimierungsprozesses die EXIF-Daten aus allen Bildern entfernt.<\/p>\n Im Durchschnitt f\u00fchrt dies zu einer zus\u00e4tzlichen Reduzierung der Dateigr\u00f6\u00dfe um 8,5%.<\/p>\n Wenn Sie Ihre Bilder noch nicht optimiert haben, wird dies ein gro\u00dfartiger Tag f\u00fcr Ihre Website!<\/p>\n Alle reden von Hosting und Dateioptimierungen, aber aus irgendeinem Grund wird die Bildoptimierung oft vernachl\u00e4ssigt. Das ist verr\u00fcckt, denn es gibt riesige Gewinne zu erzielen.<\/p>\n Ich verwende ShortPixel, um alle in diesem Handbuch beschriebenen Bildoptimierungspraktiken durchzuf\u00fchren und empfehle es allen anderen, denen die Leistung ihrer WordPress-Site wichtig ist.<\/p>\n Klicken Sie hier, um ShortPixel jetzt auszuprobieren<\/a><\/p>\n Jetzt, da Sie auf dem Weg zu einer superoptimierten Medienbibliothek sind, sollten Sie einen Premium-Host wie WP Engine<\/a> in Betracht ziehen, um diese Bilder noch schneller zu laden. Und Sie sollten einen Blick auf den WP Rocket-Guide<\/a> werfen ,<\/a> insbesondere den Teil \u00fcber Lazy Loading<\/a> zur weiteren Bildoptimierung.<\/p>\nDrei M\u00f6glichkeiten, Bilder zu optimieren<\/h2>\n
1 Komprimieren Sie Ihre Bilder<\/h3>\n
Verlustfreie Kompression<\/h4>\n
Verlustbehaftete Kompression<\/h4>\n
So komprimieren Sie Ihre Bilder<\/h4>\n
![\"So](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-176813-616f3240ca972.png\")
<\/a><\/p>\n![\"So](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-176813-616f32428aed6.png\")
<\/a><\/p>\nWas ist mit Bildern, die Sie bereits hochgeladen haben?<\/h4>\n
![\"So](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-176813-616f32446974a.png\")
<\/a><\/p>\nAlle Bildgr\u00f6\u00dfen optimieren<\/h4>\n
\n
![\"So](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-176813-616f32466e04b.png\")
<\/a><\/p>\n2 \u00c4ndern Sie die Gr\u00f6\u00dfe Ihrer Bilder<\/h3>\n
Kleinere Bilder hochladen<\/h4>\n
![\"So](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-176813-616f3248c6bb4.png\")
<\/a><\/p>\n\u00c4ndern Sie die Gr\u00f6\u00dfe von Bildern in Ihrer Medienbibliothek<\/h4>\n
![\"So](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-176813-616f324ac8d3b.png\")
<\/a><\/p>\n3 EXIF-Daten entfernen<\/h3>\n
![\"So](\"https:\/\/themewp.inform.click\/wp-content\/uploads\/2021\/10\/post-176813-616f324cc2416.png\")
<\/a><\/p>\nKleinere Bilder = schnellere Websites<\/h2>\n