Jak Optymalizować Obrazy dla Stron Produktowych E-commerce | Bulk Image Compressor
Obrazy produktów sprzedają rzeczy. Jeśli kupujący nie widzą szczegółów wyraźnie, nie kupują. Ale jeśli Twoje obrazy są zbyt duże, a strony ładują się wolno, wychodzą, zanim obrazy w ogóle się załadują. Znalezienie tej równowagi to jedna z najbardziej praktycznych rzeczy, jakie możesz zrobić dla sklepu internetowego.
Dobra wiadomość jest taka, że nie musisz wybierać między jakością a szybkością. Z odpowiednimi ustawieniami kompresji i formatami, Twoje zdjęcia produktów mogą wyglądać ostro na ekranie, jednocześnie ładując się szybko na każdym urządzeniu.
Dlaczego rozmiar obrazu produktu ma znaczenie
Typowa strona produktu ma od 4 do 8 obrazów: główne zdjęcie, kilka kątów, może zdjęcie zbliżeniowe i obraz lifestyle’owy pokazujący produkt w użyciu. Jeśli każde z nich to nieskompresowany plik 4MB od fotografa, to 16 do 32MB obrazów na stronę.
Wolne strony produktów bezpośrednio szkodzą sprzedaży. Badania Deloitte wykazały, że poprawa szybkości strony mobilnej o 0,1 sekundy prowadziła do 8,4% wzrostu konwersji w witrynach detalicznych. Największym czynnikiem szybkości strony w e-commerce są prawie zawsze obrazy.
Jest też czynnik mobilny. Większość zakupów online odbywa się na telefonach. Twoje obrazy produktów muszą ładować się szybko na połączeniach komórkowych, a nie tylko na szybkim Wi-Fi.
Zdjęcia na białym tle a zdjęcia lifestyle’owe
Te dwa typy obrazów produktów mają różne cechy kompresji.
Zdjęcia produktów na białym tle to te, które widzisz na Amazon, eBay i większości stron z listą produktów. Mają zazwyczaj czyste białe tło z produktem na środku. Te obrazy kompresują się bardzo dobrze, ponieważ duże obszary jednolitej bieli wymagają bardzo mało danych. Często możesz je skompresować przy 75 do 80% jakości JPEG i nie widzieć prawie żadnej różnicy.
Zdjęcia lifestyle’owe pokazują produkty w rzeczywistych warunkach. Kubek do kawy na kuchennym blacie, kurtka na modelu na zewnątrz, buty na miejskim chodniku. Te obrazy mają większą złożoność wizualną ze zróżnicowanym tłem, teksturami i oświetleniem. Wymagają nieco wyższych ustawień jakości, około 80 do 85%, aby zachować szczegóły.
Oba typy mogą być znacznie mniejsze niż oryginały. Zdjęcie produktu na białym tle o wielkości 5MB zazwyczaj kompresuje się do 200 do 400KB. Zdjęcie lifestyle’owe o wielkości 6MB kompresuje się do 300 do 600KB.
Wymagania i rekomendacje platform
Różne platformy e-commerce mają własne wytyczne dotyczące obrazów. Oto specyfikacje dla głównych z nich:
Shopify rekomenduje obrazy o wymiarach 2048 x 2048 pikseli. Maksymalny rozmiar pliku to 20MB, ale zdecydowanie sugerują utrzymywanie obrazów znacznie poniżej tego. Shopify wykonuje pewną automatyczną kompresję i serwuje WebP, gdy przeglądarka go obsługuje, ale zaczynanie od zoptymalizowanych obrazów daje lepsze wyniki.
WooCommerce nie narzuca ścisłych limitów, ponieważ działa na Twoim własnym hostingu. Oznacza to, że optymalizacja obrazów jest w całości Twoją odpowiedzialnością. Domyślne rozmiary miniatur to 600 x 600 dla katalogu i pełny rozmiar obrazu dla strony produktu. Powinieneś zmienić rozmiar i skompresować przed przesłaniem.
Amazon wymaga minimum 1000 pikseli na dłuższym boku (dla funkcji zoom) i rekomenduje 2000 pikseli. Maksymalny rozmiar pliku to 10MB. Główny obraz musi mieć czyste białe tło (RGB 255, 255, 255). Amazon kompresuje obrazy po swojej stronie, ale przesyłanie już zoptymalizowanych obrazów daje Ci większą kontrolę nad końcowym wynikiem.
Etsy rekomenduje 2000 pikseli na najkrótszym boku. Akceptują pliki do 1MB. Ponieważ limit Etsy jest stosunkowo mały, prawie na pewno będziesz musiał skompresować przed przesłaniem.
Zalecane wymiary i rozmiary plików
Dla większości platform e-commerce, oto praktyczny cel:
| Typ obrazu | Wymiary | Docelowy rozmiar pliku |
|---|---|---|
| Główne zdjęcie produktu | 2000 x 2000px | 200 do 400KB |
| Alternatywne kąty | 2000 x 2000px | 200 do 400KB |
| Zdjęcie zbliżeniowe/zoom | 2000 x 2000px | 250 do 500KB |
| Zdjęcie lifestyle’owe | 2000 x 1333px | 300 do 600KB |
| Miniatura | 600 x 600px | 30 do 60KB |
Te rozmiary dają wystarczającą rozdzielczość dla funkcji zoom, utrzymując jednocześnie szybkie strony. Całkowity ładunek obrazów na stronę produktu powinien idealnie pozostać poniżej 2MB.
Wybór odpowiedniego formatu
JPEG jest standardem dla fotografii produktowej. Dobrze obsługuje zdjęcia i jest obsługiwany wszędzie. Używaj go jako domyślnego.
WebP oferuje około 25 do 35% lepszą kompresję niż JPEG przy tej samej jakości wizualnej. Jeśli Twoja platforma go obsługuje (Shopify robi to automatycznie, WooCommerce potrzebuje wtyczki), WebP to solidne ulepszenie. Aby uzyskać głębsze porównanie formatów, przeczytaj nasz przewodnik JPEG vs PNG vs WebP.
PNG jest potrzebny tylko wtedy, gdy obrazy produktów wymagają przezroczystości. Na przykład, jeśli sprzedajesz przedmioty, które muszą być pokazane bez żadnego tła, PNG zachowuje tę przezroczystość. W przeciwnym razie unikaj PNG dla zdjęć produktów, ponieważ rozmiary plików są znacznie większe.
Przetwarzanie wsadowe dla katalogów produktów
Jeśli masz sklep z dziesiątkami lub setkami produktów, kompresowanie obrazów jeden po drugim nie jest realistyczne. Katalog produktów z 200 przedmiotami i 5 obrazami każde oznacza 1 000 obrazów do przetworzenia.
W tym miejscu kompresja wsadowa oszczędza godziny. Dzięki Bulk Image Compressor możesz upuścić cały folder obrazów produktów i skompresować je wszystkie naraz. Wszystko działa w Twojej przeglądarce, więc zdjęcia produktów nigdy nie są przesyłane na żaden zewnętrzny serwer. Ma to znaczenie, gdy pracujesz z nieopublikowanymi produktami lub obrazami, których nie chcesz udostępniać przed premierą.
Oto przepływ pracy, który dobrze sprawdza się w przypadku katalogów produktów:
-
Najpierw zmień rozmiar. Doprowadź wszystkie obrazy do odpowiednich wymiarów (2000 x 2000px dla większości platform). Nie wysyłaj obrazów 6000px przez kompresję, gdy będą wyświetlane tylko przy 2000px.
-
Oddziel według typu. Umieść zdjęcia na białym tle w jednej partii, a zdjęcia lifestyle’owe w drugiej. Pozwala to na użycie różnych ustawień jakości dla każdej z nich.
-
Kompresuj zdjęcia na białym tle przy jakości 75 do 80%. Czyste tła kompresują się wydajnie przy niższych ustawieniach.
-
Kompresuj zdjęcia lifestyle’owe przy jakości 80 do 85%. Dodatkowe szczegóły w tych obrazach korzystają z nieco wyższej jakości.
-
Sprawdź kilka wyników. Otwórz kilka skompresowanych obrazów i porównaj je z oryginałami. Upewnij się, że tekst na opakowaniu jest nadal czytelny, a szczegóły produktu są wyraźne. Więcej na ten temat znajdziesz w naszym przewodniku zmniejszanie rozmiaru pliku bez utraty jakości.
-
Prześlij na swoją platformę. Zastąp oryginały skompresowanymi wersjami.
Wpływ na Twój wynik finansowy
Szybsze strony produktów oznaczają więcej sprzedaży. To takie proste. Gdy kupujący kliknie Twój produkt z wyniku wyszukiwania lub reklamy, masz około dwóch do trzech sekund, zanim zdecyduje, czy czekać, czy wcisnąć przycisk wstecz.
Zoptymalizowane obrazy zmniejszają również koszty hostingu i CDN. Jeśli serwujesz 500 000 odsłon stron produktów miesięcznie i zmniejszysz średni ładunek obrazów z 8MB do 1,5MB na stronę, to terabajty zaoszczędzonej przepustowości.
Twoje zdjęcia produktów są najważniejszym aktywem w sklepie internetowym. Prawidłowe ich kompresowanie pozwala zachować jakość wizualną, której potrzebują kupujący, jednocześnie dając im szybkie doświadczenie, które faktycznie prowadzi do zakupów.
Ready to compress your images?
Bulk compress JPEG, PNG, WebP, and AVIF images right in your browser. No uploads, no sign-ups.
Try Bulk Image Compressor