\nIm BMP-Format speichert Windows Paint auch heute noch gern seine Bilder.<\/div>\n
Irgendetwas musste also her, um die Datenmengen in den Griff zu bekommen. Es wurden Bildformate ersonnen, die Bilder mit weniger Daten abspeichern k\u00f6nnen.<\/p>\n
Dazu wurde in die mathematische Trickkiste<\/strong><\/a> gegriffen, aber auch versucht zu bestimmen was man vielleicht einfach weglassen k\u00f6nnte, so dass man trotzdem als Betrachter nichts davon merkt.<\/p>\n Sehen wir uns das an: Das bekannteste und wohl verbreitetste der sparsameren Bildformate d\u00fcrfte JPEG sein, JPEG steht kurz f\u00fcr „Joint Picture Experts Group“, also ein Gremium aus Experten f\u00fcr Bilder, die den Standard zusammen bestimmt haben. JPEG ist ein Bildformat, das Bilddaten in hohem Ma\u00df verkleinern kann und von jedem Ger\u00e4t – und f\u00fcr uns besonders relevant: von jedem Browser – verstanden wird.<\/p>\n Der kleine Haken bei JPEG ist, dass es sich dabei um ein Bildformat handelt, in dem nicht verlustfrei komprimiert wird. Bilder k\u00f6nnen zwar so stark komprimiert werden, dass die Datenmenge wirklich minimal wird, darunter leidet dann allerdings deutlich sichtbar die Bildqualit\u00e4t.<\/p>\n Exemplarisch k\u00f6nnte man sich hier vorstellen wir haben ein Foto einer belebten Strasse, im Hintergrund ist neben vielen anderen Personen und Objekten klein eine Passantin mit einer fein schwarz-weiss gestreiften Bluse zu sehen. Gehen wir hier davon aus, dass ein aufmerksamer Beobachter der nah genug dran ist das sehen kann, hat er etwas Abstand aber vermutlich schon nicht mehr. Wenn man nun die Linierung entfernt und im Bild stattdessen einfach eine graue Fl\u00e4che anzeigt, die sich mit viel weniger Daten speichern l\u00e4sst, w\u00fcrde der Betrachter mit Abstand den Unterschied nicht feststellen k\u00f6nnen. Genauso kann man nat\u00fcrlich subtile Farb\u00fcberg\u00e4nge einfach herauswerfen und sich vieler anderer Tricks nach \u00e4hnlichem Muster bedienen.<\/p>\n Nimmt man hier zuviele Details weg, wird das Ganze nat\u00fcrlich irgendwann augenf\u00e4llig. Beim Umgang mit Bildern im JPEG Format ist also immer ein Kompromiss zwischen Kompressionsfaktor und Anforderungen an die visuelle Qualit\u00e4t gefragt, f\u00fcr den sich keine perfekt allgemeing\u00fcltige Aussage treffen l\u00e4sst.<\/p>\n Ein Wertebereich, der in den meisten F\u00e4llen gut funktioniert, l\u00e4sst sich allerdings dennoch festlegen:<\/p>\n \u00dcblicherweise fragen bildverarbeitende Programme beim Speichervorgang eines Bildes den Benutzer nach einem Wert f\u00fcr die Anwendung der Kompressionsst\u00e4rke ab, meistens wird dabei eine Skala von 1-100 vorgegeben:<\/p>\n <\/p>\n <\/p>\n Der Wert 1 entspricht dabei der h\u00f6chsten Kompressionsstufe bei maximalem Verzicht auf Qualit\u00e4t, der Wert 100 bietet maximale Qualit\u00e4t bei geringster Kompression.<\/p>\n Wird dieser Wert nun von 100 auf 90 ge\u00e4ndert, wird ein Bild \u00fcblicherweise schon um Gr\u00f6\u00dfenordnungen kleiner, bei Werten unter 80 wird die Bildqualit\u00e4t beginnen erste deutliche Schw\u00e4chen zu zeigen.<\/p>\n <\/p>\n <\/p>\n Um einen Kompromiss zwischen Bildqualit\u00e4t und Dateigr\u00f6\u00dfe (=Ladezeit) zu erreichen, solltet ihr einfach mal ein wenig herumprobieren.<\/p>\n Einen guten Startpunkt k\u00f6nnte eine Kompression zwischen 80-90 darstellen:<\/p>\n <\/p>\n <\/p>\n Alle Gambio-Nutzer wissen (hoffentlich): Werden ein oder mehrere Artikelbilder hochgeladen, wird der Shop diese sofort schnell und automatisch auf gleichm\u00e4\u00dfige Gr\u00f6\u00dfen umrechnen und ablegen, so dass diese beim Seitenaufruf durch einen Kunden nicht erst langwierig erzeugt werden m\u00fcssen und der Kunde schnell die Seite angezeigt bekommt.<\/p>\n Dieses sogenannte Imageprocessing kann je nach Einstellung im Shop auch Kompression nach Wunsch anwenden; ein Parameter, dem viele Nutzer aus Unkenntnis wenig Aufmerksamkeit zuwenden.<\/p>\n Je nachdem mit welcher Shopversion ein H\u00e4ndler gestartet ist, k\u00f6nnen hier verschiedene Werte voreingestellt sein: Updates des Shops belassen immer den eingestellten Wert und ver\u00e4ndern ihn nicht.<\/p>\n Bei j\u00fcngeren Shops ist dies meist 100, also maximale Bildqualit\u00e4t zu Ungunsten der Bildgr\u00f6\u00dfe und damit der Ladezeiten:<\/p>\n <\/p>\n Die Qualit\u00e4t der Bilder ist in der Regel auch dann noch mehr als ausreichend, das solltet ihr aber nat\u00fcrlich \u00fcberpr\u00fcfen.<\/p>\n Dies sorgt zum einen f\u00fcr einen unterbrechungsfrei m\u00f6glichen Betrieb des Shops, denn wenn man viele Artikel mit vielen Bildern hat ist eine Umrechnung mit Wartezeit verbunden. Zum anderen sorgt es daf\u00fcr, dass ihr einen neuen Wert schnell und einfach ausprobieren k\u00f6nnt, indem ihr in einem beliebigen Artikel einfach mal ein Bild neu hochladet oder \u00e4ndert und diesen dann in der Kundenansicht anschaut.<\/p>\n Gef\u00e4llt euch, was ihr seht, bleibt ihr bei dem entsprechenden Wert und alle Artikel, die ihr nun im Weiteren \u00e4ndert oder neu anlegt werden entsprechend behandelt.<\/p>\n Nat\u00fcrlich gibt es auch daf\u00fcr eine L\u00f6sung: ihr k\u00f6nnt per Buttonklick die Neuerzeugung aller Artikel- und Kategoriebilder f\u00fcr alle bestehenden Elemente ansto\u00dfen.<\/p>\n Dazu wechselt ihr im Gambio Admin auf Darstellung \u2192 Bild-Optionen und dort auf den Reiter „Image Processing“.<\/p>\n Dort befindet sich der Knopf „Ausf\u00fchren“ f\u00fcr die Stapelverarbeitung der Bildbearbeitung, der den Vorgang startet:<\/p>\n <\/p>\n <\/p>\n Wie eingangs bereits erw\u00e4hnt, das Einf\u00fcgen von Bildern in den Shop ist immer ein Balanceakt zwischen einer herausragenden Optik und akzeptablen Ladezeiten.<\/p>\n Dabei ist in der Regel ein Kompromiss die beste L\u00f6sung, denn die allerh\u00f6chste Aufl\u00f6sung brauchen nun wirklich nur die wenigsten Bilder.<\/p>\n Auch eine etwas reduzierte Kompressionsrate ist in den allermeisten F\u00e4llen immer noch v\u00f6llg ausreichend, gerade auf den kleineren Screens von Smartphones, die ja ohnehin mehr und mehr auch zum Shoppen zum Einsatz kommen.<\/p>\n Ihr solltet also sinnvollerweise einmal die f\u00fcr euren Shop\/eure Bildgr\u00f6\u00dfen optimale Kompression herausfinden und anschlie\u00dfend alle Bilder in eurem Shop entsprechend anpassen.<\/p>\n So stellt ihr sicher, dass eure Bilder einerseits den Kunden zufriedenstellen und andererseits auch Google gl\u00fccklich machen!<\/p>\n Ach ja, die Bildberabeitung muss nicht unbedingt \u00fcber das Imageprocessing im Shop laufen:<\/p>\n Alle H\u00e4ndler, die \u00fcber einen eigenen Server f\u00fcr Ihren Shop verf\u00fcgen und dort Konsolenzugriff zum Beispiel per SSH haben, k\u00f6nnen ihre bestehenden Bilder noch schneller komprimieren.<\/p>\nWas k\u00f6nnen die Alternativen?<\/h2>\n
![\"Gambio](\"https:\/\/www.gambio.de\/blog\/wp-content\/uploads\/Kompressionsgr\u00f6\u00dfe_80_011017_024930_PM.jpg\")
<\/a><\/p>\nWie extrem die Unterschiede sein k\u00f6nnen, zeigen diese beiden Bilder:<\/h3>\n
![\"Gambio](\"https:\/\/www.gambio.de\/blog\/wp-content\/uploads\/Kompressionsgr\u00f6\u00dfe-100.png\")
<\/a>Gestochen scharf, daf\u00fcr mit hohem Datenvolumen: Kompressionsstufe 100<\/p>\n![\"Gambio](\"https:\/\/www.gambio.de\/blog\/wp-content\/uploads\/Kompressionsgr\u00f6\u00dfe-10.png\")
<\/a>Kleines Datenvolumen, daf\u00fcr nicht mehr sehr ansehnlich: Kompressionsstufe 10<\/p>\nDer Mittelweg als L\u00f6sung:<\/h3>\n
![\"Gambio](\"https:\/\/www.gambio.de\/blog\/wp-content\/uploads\/Kompressionsgr\u00f6\u00dfe-80.png\")
<\/a>Gute Bildqualit\u00e4t bei akzeptablem Datenvolumen: Kompressionsstufe 80<\/p>\nBildbearbeitung im Gambio-Shop:<\/h2>\n
\nDie eigene aktuelle Einstellung findet ihr im Shop unter Darstellung –> Bild-Optionen unter \u201cBildqualit\u00e4t\u201d.<\/div>\n![\"Bildqualit\u00e4t](\"https:\/\/www.gambio.de\/blog\/wp-content\/uploads\/Imageprocessing_backend.jpg\")
<\/a>
\nUm die Ladezeiten im Shop signifikant zu verbessern, w\u00e4re mein Tipp, hier den Wert auf 85 zu setzen und zu speichern.<\/p>\n
\nEine Einstellungs\u00e4nderung wird zun\u00e4chst nur auf neue Bilder angewendet, bestehende Bilder bleiben unver\u00e4ndert.<\/div>\nWas ist nun aber mit bereits bestehenden Artikeln?<\/h3>\n
![\"Das](\"https:\/\/www.gambio.de\/blog\/wp-content\/uploads\/imageprocessing_ausf\u00fchren.jpg\")
<\/a><\/p>\n
\nDerselbe Vorgang greift auch wenn ihr andere Bildoptionen ver\u00e4ndert, zum Beispiel wenn ihr ein Wasserzeichen in die Bilder einf\u00fcgen wollt.<\/div>\nNochmal zusammengefasst: warum sollte ich meine Bilder bearbeiten?<\/h2>\n
Bildbearbeitung f\u00fcr Experten<\/h2>\n