Optymalizacja zdjęć w sklepie internetowym polega na zmniejszeniu ich rozmiaru oraz nadaniu im odpowiedniej nazwy. Przekłada się to na:
- Znacznie szybsze ładowanie strony
- Bardzo pozytywny wpływ na SEO
- Zwiększenie konwersji (przez szybsze ładowanie strony)
W tym artykule dowiesz się jak to zrobić!
Jak zmniejszyć rozmiar zdjęć w sklepie internetowym
Są tutaj dwie drogi, którymi można pójść. Pierwsza jest łatwiejsza, ale daje o wiele gorsze rezultaty. Druga jest o wiele trudniejsza, ale jest to wręcz perfekcyjna optymalizacja, która będzie dawać korzyści przez wiele lat.
1. Gorsza opcja – masowa optymalizacja zdjęć
Aby masowo zoptymalizować zdjęcia na stronie, można skorzystać z wtyczki do optymalizacji, która wykona masową kompresję dla wszystkich zdjęć. Jest dostępnych wiele opcji – możesz użyć Robin Image Optimizer.
Po zainstalowaniu tej wtyczki w swoim sklepie na woocommerce należy wejść w ustawienia i włączyć automatyczną kompresję obrazów. Po jakimś czasie (w zależności ile zdjęć jest na Twojej stronie) wszystkie zdjęcia w sklepie zostaną skompresowane.
Jednak ja odradzam tę opcję. Jest ona o wiele mniej skuteczna niż skompresowanie zdjęć przed ich dodaniem na stronę.
2. O wiele lepsza opcja – ręczna optymalizacja zdjęć
O wiele lepiej jest podejść do optymalizacji zdjęć po prostu ręcznie.
W tym celu gorąco polecam narzędzie tinypng.com.
Działa ono w następujący sposób:
- Dodajemy zdjęcie, które chcemy zoptymalizować do narzędzia i zaznaczamy opcję “Convert my images automatically”, a następnie format “WEBP”. Format webp jest najlepszym, najlepiej zoptymalizowanym formatem pod wyświetlanie na stronach internetowych:
- Po przeciągnięciu zdjęcia pojawi się ono na dole strony i zostanie zoptymalizowane w ciągu 2 sekund:
Jak widać – zdjęcie zostało zmienione na format webp oraz skonwertowane – z 2 MB, waży teraz 78 KB, czyli jest to zmniejszenie rozmiaru aż o 96%!
Oznacza to, że użytkownik wchodząc na stronę, będzie musiał załadować tylko 78 KB żeby wyświetlić to zdjęcie zamiast wcześniejszych 2 MB.
Co więcej – zdjęcie nie traci na jakości, więc zostało to wykonane bez żadnego kosztu na wartości dla użytkownika.
Niestety jest to bardziej czasochłonna metoda, ponieważ trzeba to zrobić dla każdego zdjęcia na stronie. Ale zdecydowanie warto, ponieważ wpłynie to bardzo pozytywnie na szybkość całego sklepu.
Narzędzie TinyPNG jest darmowe – można w jednej sesji skonwertować 3 zdjęcia, pobrać je, a następnie odświeżyć stronę i zoptymalizować kolejne 3 zdjęcia. Jeśli masz ich bardzo dużo możesz pomyśleć o wykupieniu usługi premium bez limitu zdjęć w sesji co przyśpieszy proces.
Odpowiednia nazwa zdjęć w sklepie internetowym
Google widzi wszystko – również nazwę plików zdjęć. Dlatego też przed dodaniem zdjęcia na stronę, warto jest je w odpowiedni sposób nazwać.
Podczas nazywania zdjęcia – nie używaj polskich znaków, nie używaj spacji, a zamiast niej stosuj myślniki (-). Pamiętaj o umieszczeniu frazy kluczowej w nazwie zdjęcia. Np. pozlacane-kolczyki-z-brylantami-okragle-wiszace
Tak nazwane zdjęcie można już dodać na stronę i cieszyć się profesjonalną optymalizacją pod rozmiar i pod SEO.
Lazy loading zdjęć
Kolejnym elementem optymalizacji zdjęć w sklepie internetowym jest lazy loading zdjęć. Polega on na tym, że te zdjęcia, których użytkownik nie zobaczy od razu po wejściu na stronę nie są ładowane. Dopiero, gdy użytkownik zjedzie na dół strony, są one wczytywane.
Dzięki takiemu rozwiązaniu, użytkownik o wiele szybciej zobaczy górę strony (podstrona szybciej się załaduje), a reszta jest ładowana w tle, gdy on już się po niej porusza. Skraca to czas ładowania strony dla użytkownika i zwiększa UX.
Lazy loading można ustawić praktycznie w każdej wtyczce służącej optymalizacji szybkości strony – ja polecam WP Rocket.
I to by było na tyle – taka optymalizacja zdjęć znacznie zwiększy szybkość Twojego sklepu i zdecydowanie warto jest ją wykonać!
Jeśli chcesz zoptymalizować zdjęcia dodatkowo pod SEO, zapoznaj się teraz z tym artykułem: Opisy alternatywne obrazów w sklepie internetowym – co dają?
