Rozmiary banerów dla wybranych szablonów
Niniejszy poradnik pomoże Ci przygotować sklep internetowy do sprzedaży od strony wizualnej. Dowiesz się między innymi jakie wymiary grafik są optymalne i dlaczego warto je kompresować.
Bannery są dostępne do konfiguracji w sekcji:
MODERACJA > Wygląd sklepu > Bannery, buttony, reklamy.
Współczesne monitory
Obecnie nawet małe monitory wyświetlają obraz o wysokiej rozdzielczości. Ekrany Retina i 4K wyświetlają grafiki w swojej natywnej rodzielczości, a system powiększa cały interfejs, aby jego elementy na małym ekranie były dobrze widoczne. Przez takie działanie zdjęcia, bannery i inne grafiki rastrowe w niskiej rozdzielczości zostają rozciągnięte i w efekcie wyglądają na rozmyte. Aby uniknąć takiego efektu zalecamy umieszczenie banerów w rozdzielczości większej niż obszar, w którym są wyświetlane.
Wymiary banerów dla poszczególnych urządzeń
Desktop
Zalecana szerokość jednego banera wg. ilości
banerów w rzędzie
Tablet
Zalecana szerokość jednego banera wg. ilości
banerów w rzędzie
Mobile
Zalecana szerokość jednego banera wg. ilości
banerów w rzędzie
Kompresowanie grafik
Kompresja grafik jest kluczowym elementem optymalizacji stron sklepu internetowego, ponieważ pozwala na zmniejszenie czasu ładowania strony, co bezpośrednio wpływa na poprawę doświadczenia użytkownika. Google PageSpeed Insights, narzędzie do analizy wydajności stron, często wskazuje na konieczność optymalizacji obrazów jako jeden z głównych sposobów na zwiększenie szybkości ładowania.
Dla osiągnięcia najlepszych rezultatów, zaleca się stosowanie formatów takich jak:
WebP, które oferują znaczną redukcję rozmiaru przy zachowaniu wysokiej jakości obrazu
JPEG i PNG, które są szeroko wspierane i dobrze znane.
WebP jest preferowany dla złożonych obrazów z bogatą paletą kolorów, podczas gdy PNG jest idealny dla grafiki z przezroczystością, a JPEG dla fotografii. Właściwe zarządzanie kompresją obrazów jest więc istotne dla SEO i ogólnej wydajności strony.
Po lewej słaba kompresja, po prawej mocna kompresja JPEG.
Widać wyraźne obniżenie jakości ale też i spadek wagi pliku z grafiką. Waga po lewej 450 KB po prawej 40 KB.
Dobra waga dla baneru reklamowego o rozmiarze 1775 x 600 pikseli, zawierającego zarówno zdjęcie, jak i elementy tekstowe z przyciskiem, powinna oscylować w granicach 150-200 KB. Pozwala to na zachowanie balansu między jakością a szybkością ładowania, co jest szczególnie ważne w kontekście utrzymania niskiego czasu oczekiwania na załadowanie się reklamy.
Jest to szczególnie istotne przy pierwszym załadowaniu strony, gdzie szybkość wyświetlenia reklamy może wpłynąć na skuteczność kampanii. Osiągnięcie takiej wagi baneru często wymaga użycia kompresji bezstratnej lub lekkiej kompresji stratnej, uwzględniając odpowiedni balans między wielkością a jakością wizualną grafiki.
Aby osiągnąć optymalną wagę baneru reklamowego, można skorzystać z różnych narzędzi do kompresji obrazów, zarówno płatnych, jak i bezpłatnych. Wśród bezpłatnych opcji popularne są TinyPNG oraz ImageOptim, które oferują intuicyjne interfejsy i dobre algorytmy kompresji dla formatów PNG i JPEG.
Dla bardziej zaawansowanych potrzeb, płatne narzędzia jak Adobe Photoshop czy kraken.io zapewniają szerokie spektrum opcji optymalizacji i wsparcie dla różnych formatów graficznych, w tym WebP. Te narzędzia umożliwiają precyzyjne dostosowanie stopnia kompresji, zachowując jednocześnie jakość obrazu odpowiednią dla potrzeb reklamowych.
Jeśli nie jesteś zadowolony z wyglądu swoich banerów lub masz jakiekolwiek problemy z ich odpowiednim ustawieniem w panelu - skontaktuj się z naszym Działem Graficznym, który w profesjonalny sposób przygotuje/skonfiguruje strefy banerowe w Twoim sklepie internetowym.