Bildkompression ist eine der Hauptursachen für langsame Websites. Bilder, die nicht vorher komprimiert und skaliert wurden und direkt auf der Website platziert werden, benötigen normalerweise 15-mal mehr Speicherplatz als tatsächlich erforderlich. Ich zeige Ihnen, wie Sie Bilder in nur wenigen Schritten komprimieren können.
Lassen Sie uns damit anfangen, was ist Bildkompression?
Bildkompression ist ein Prozess, bei dem wir das Gewicht eines Bildes mit möglichst wenig Verlust der Bildqualität reduzieren. Einfach ausgedrückt, warum sollten Sie ein Bild mit 10 MB haben, wenn Sie dasselbe Bild mit der gleichen Qualität auf der Website hochladen können, und es nur 100 KB groß ist? Stellen Sie sich vor, das Bild wiegt 100 Mal weniger 🙂
Bildkompression hat mehrere Vorteile für Ihre Website. Auf diese Weise erleichtern Sie die Website und beschleunigen das Laden der Webseiten, was sich direkt auf das SEO auswirkt, da die Geschwindigkeit der Seite ein wichtiger Punkt und Signal für die Optimierung der Website ist.
Die Mathematik ist einfach: Sie erstellen eine Seite mit 5 Bildern, jedes Bild nimmt 10 MB in Anspruch, das sind 50 MB pro Seite nur durch die Bilder. Nach diesem Artikel komprimieren Sie diese gleichen Bilder und sie nehmen nur 5×100 KB ein, was 500 KB auf dieser Bildseite bedeutet.
Alles ist hier großartig, aber lassen Sie uns sehen, ob es wirklich so ist, lassen Sie uns eine großartige Anwendung ausprobieren…
Squoosh.app Bildkompressionsanwendung
Squoosh.app ist eine kostenlose Bildkompressionsanwendung, die nicht auf Ihrem Computer installiert werden muss, da alles direkt auf der Website selbst geschieht. Wenn Sie also kein Photoshop verwenden oder nicht wissen, wie man es nutzt, können Sie dieses Tool verwenden, um das Bild in wenigen Sekunden zu komprimieren und es dann auf die Website hochzuladen.
Mit der Anwendung von Squoosh.app können Sie Folgendes tun:
- Sie ändern das Bildformat
- Sie ändern die Bildabmessungen
- Sie ändern die Bildqualität
- Sie und Ihre Website-Besucher genießen eine schnellere Seite.
So sieht Squoosh.app aus, wo ich Bilder komprimiere, und unten werde ich Ihnen mit einem Video zeigen, wie Sie alles in 10 Sekunden tun können.
Vermeiden Sie es, ein Plakat auf der Website zu posten…
Die Größe der Bilder selbst ist auch sehr wichtig. Überlegen wir nochmal: Warum sollten Sie ein Bild auf der Website platzieren, das auf ein Plakat passt?
Riesige Bilder werden auch nach der Kompression immer noch schwer sein, daher ist es wichtig, dass die Bilder richtig dimensioniert sind, weil der Besucher das Bild nicht in der Größe sehen wird, die Sie festgelegt haben, sondern in der Größe, die das Gerät, das er benutzt, zulässt.
Angenommen, das Logo auf der Seite nimmt einen Raum von 150px x 50px ein, ein Logo von 3000 x 1000px zu platzieren hat keinen Zweck, und außerdem wird es viel schwieriger. Wenn wir berücksichtigen, dass es auch am Anfang der Seite platziert ist und unter den ersten Dingen geladen wird. Das verlangsamt die Seite bereits zu Beginn.
Balance zwischen den Abmessungen und der erforderlichen Bildqualität!
Der beste Weg, um zu bestimmen, welche Bildgröße Ihre Seite benötigt, ist zu schauen, wo das Bild passt und welchen Zweck es erfüllt. Wenn es ein Bild ist, das als Hintergrund für die Seite oder als Teil der Seite verwendet wird, dann kann seine Breite 1920 Pixel betragen. Es ist kein Zufall, dass es so viele Pixel sind, es ist einfach so, dass die meisten Laptops genau diese Auflösung verwenden, sodass Sie das Maximum erhalten, aber nicht zu viel.
Dies gilt für die Desktop-Version, für die mobile Version müssen Sie natürlich ein anderes Bild platzieren, da es unnötig ist, das 1920px breite Bild auf der mobilen Version zu haben, die nur 400-500px breit ist. Es kann natürlich, aber es ist unnötig und verlangsamt das Laden der Seite.
Wenn Sie ein Bild für ein Produkt im Online-Shop posten, dann ist dieses Bild auf einer Seite des Bildschirms, aber dieses Bild wird oft angeklickt, um es vergrößert zu sehen. Deshalb ist es großartig, dass dieses Bild 1080px x 1080px ist. Auf diese Weise wird das Bild groß genug sein, um alles schön zu sehen, auch wenn es vergrößert wird, und andererseits nicht zu groß, um die Seite zusätzlich zu belasten.
Wenn wir Symbole auf der Seite platzieren, ist es je nach Bedarf am besten, diese Symbole im SVG-Format und in der Größe 50×50, 100×100 und manchmal sogar kleiner zu platzieren. Dies ist eine Geschichte über die Abmessungen der Bilder, die ich ansprechen musste, und die wir in zukünftigen Artikeln weiter behandeln und uns den kleinsten Details widmen werden. Denn dies ist eines der häufigsten Probleme auf Websites und hängt mit der Bildoptimierung zusammen.
Reduzieren Sie das Bildgewicht in wenigen Schritten auf Squoosh.app
Es gibt keine große Philosophie (mehr :D). Wir legen los und komprimieren das Bild in wenigen Schritten, das die gleiche Qualität hat, und das Gewicht wird von 1,41 MB auf 97 KB sinken.
- Bild auf Squoosh.app hochladen
- Bildgröße auswählen
- Bildformat auswählen (jpeg, png, webp, …)
- Bildqualität des neuen Bildes bestimmen
- Vergleichen Sie das Originalbild mit dem neuen Bild
- ARBEIT GESCHAFFT!
Magischer Ernährungsberater für Bilder…
Teilen Sie mir die Ergebnisse mit, nachdem Sie die Bilder mit diesem tollen Tool komprimiert haben, und senden Sie mir die neuen Ladegeschwindigkeits-Ergebnisse Ihrer Website. Viel Spaß 🙂

DE
EN
FR