.svg)
de
Was passiert als Nächstes?
Die Optimierung der Bilder, die Sie auf Ihrer Website verwenden, wirkt sich erheblich auf die Benutzererfahrung Ihrer Website und auch auf die Ladezeit aus. Dies wirkt sich direkt auf Ihre SERP-Rankings aus und hilft bei vielen Faktoren, die Suchmaschinen helfen können, den Inhalt Ihrer Website besser zu verstehen.
Durch die Optimierung von Bildern und die Verwendung der richtigen Dateigröße erhalten Sie eine Website, die schneller geladen werden kann und eine bessere Benutzererfahrung bietet.
Schauen wir uns diese Infografik von Think With Google an.
Angesichts dieser Statistik ist es unerlässlich, die von Ihnen verwendeten Bilder zu optimieren, da sie einen großen Teil Ihres Seitengewichts ausmachen und somit die Ladegeschwindigkeit verlängern. Aber wie geht man dabei vor?
Hier finden Sie eine schrittweise Anleitung mit umsetzbaren Punkten, mit denen Sie die Bilder auf Ihrer Website optimieren können.
Schritt 1: Verwenden Sie saubere und zugeschnittene Bilder
Die Größe Ihrer Bilder so weit wie möglich zu reduzieren, ist eine der einfachsten und effektivsten Möglichkeiten, sie für das Web zu optimieren. Hier ist der Grund dafür.
Bilder bestehen aus Pixeln, und jedes Pixel enthält Daten, die die Dateigröße erhöhen. Wenn Sie diese Bilder auf die niedrigsten erforderlichen Abmessungen zuschneiden, werden eine Reihe unnötiger Pixel entfernt, wodurch die Dateigröße und damit die Ladezeit reduziert werden, ohne die Bildqualität zu beeinträchtigen.
Schritt 2: Entscheiden Sie sich für eine verlustbehaftete oder eine verlustfreie Komprimierung
Es gibt zwei grundlegende Arten von Komprimierungstechniken, die von verschiedenen Dateitypen häufig verwendet werden, und zwar die verlustbehaftete und die verlustfreie Komprimierung.
Wie der Name schon sagt, reduziert die verlustbehaftete Komprimierung die Dateigröße, indem Pixeldaten überall dort weggelassen werden, wo benachbarte Pixel ähnlich sind. Diese Methode nutzt die Art und Weise, wie das menschliche Auge Farben wahrnimmt, und lässt nur Daten aus, bei denen sie unbemerkt bleiben können. Aufgrund dieses Vorgangs ist die Komprimierungsrate hoch, sodass Sie eine deutlich kleinere Dateigröße ohne nennenswerten Qualitätsunterschied haben (es sei denn, Sie zoomen bis zu einem gewissen Grad hinein).
Bei der Verlustfreien Komprimierung werden keine Pixeldaten weggelassen, sondern sie werden unverändert komprimiert. Dies führt zu einem schärferen Bild, jedoch ohne signifikante Verringerung der Dateigröße.
Je nachdem, welche Qualität Sie benötigen und ob der Benutzer die Ansicht vergrößern kann, können Sie entscheiden, welche Komprimierungsmethode verwendet werden soll. Bildbearbeitungsprogramme wie Adobe Photoshop verwenden eine Kombination dieser beiden Techniken, um Ihnen je nach der von Ihnen gewählten Qualität eine hohe Komprimierungsrate zu bieten.
Schritt 3: Wählen Sie den richtigen Dateityp
Es gibt drei Dateitypen, die häufig für Bilder verwendet werden. Es handelt sich um JPEG- (.jpg), `PNG- (.png) und GIF-Bilder (.gif). Die Auswahl des richtigen Dateityps kann dazu beitragen, die Dateigröße Ihrer Bilder erheblich zu reduzieren. Hier finden Sie einen kurzen Überblick über diese Dateitypen, um Ihnen bei der Entscheidung zu helfen.
JPEG ist der am häufigsten verwendete Dateityp, und das aus gutem Grund. Es hat die höchste Farbtiefe und bietet sowohl eine verlustbehaftete als auch eine verlustfreie Komprimierung bei einstellbaren Qualitäten und Dateigrößen. JPEGs eignen sich am besten für Fotografie und komplexe Bilder.
PNGs verwenden nur eine verlustfreie Komprimierung, sodass sie reichhaltige Bilder erzeugen, jedoch auf Kosten einer größeren Dateigröße. Dieser Dateityp wird häufig für Logos und andere einfache Bilder verwendet.
GIF-Dateien sind auf nur 256 Farben beschränkt und verwenden nur eine verlustfreie Komprimierung. Sie unterstützen Animationen und werden daher häufig für animierte Loop-Bilder mit niedriger Qualität verwendet.
Schritt 4: Überschüssige Metadaten entfernen
Bilder enthalten oft Metadaten, die für Ihren Zweck nicht erforderlich sind. Diese Metadaten sind nichts anderes als Angaben zur Geolokalisierung der Bilder, zu Kameramarke und -modell, Datum, Uhrzeit, ISO, Verschlusszeit und einer Reihe anderer Einstellungen.
Wenn der einzige Zweck des Bildes darin besteht, es auf Ihrer Website zu verwenden, werden diese Daten zu nichts anderem als Übergepäck. So können Sie diese Daten entfernen.
in
Ihren Computer und klicken Sie auf „Eigenschaften“.
entfernt
, und klicken Sie auf „OK“. In diesem Dialogfeld können Sie auch wählen, ob Sie Daten aus der Originaldatei entfernen oder eine Kopie speichern möchten.
Schritt 5: Raster oder Vektor?
Raster und Vektor sind die beiden Grundtypen digitaler Grafikbilder, die überall verwendet werden. Es ist sehr wichtig zu wissen, welche Art von Grafikbild Sie benötigen. Schauen wir uns jedoch zunächst kurz an, was sie genau bedeuten.
Der Hauptunterschied zwischen Raster- und Vektorgrafiken besteht darin, dass Rastergrafiken Pixel verwenden, um ein Bild darzustellen, während Vektorgrafiken Pfade (Linien, Punkte und Polygone) verwenden. Das bedeutet, dass Rastergrafiken in der Lage sind, detailreiche Bilder mit vielen unregelmäßigen Formen zu liefern. Der Haken dabei ist, dass die Dateigröße beträchtlich hoch sein wird. Außerdem verschwimmen Bilder, die Rastergrafiken verwenden, wenn sie vergrößert werden.
Andererseits haben Vektorbilder eine viel kleinere Dateigröße und sind unabhängig von der Auflösung, sodass sie unabhängig vom Zoom nicht verschwimmen. Da sie jedoch Pfade anstelle von Pixeln verwenden, eignen sie sich nur für geometrische Bilder wie Logos und Symbole.
Bevor Sie ein Bild auf Ihre Website hochladen, müssen Sie darüber nachdenken, was das Bild enthält und welchen Zweck es auf der Website hat. Dies hilft Ihnen bei der Entscheidung, ob Sie für dieses Bild Rastergrafiken oder Vektorgrafiken verwenden möchten.
And, less time obsessing about your local presence