Grafiki w mailingu e-commerce — co decyduje o open rate i klikalności
Email marketing ma jeden z najwyższych ROI w e-commerce, ale tylko gdy grafika i struktura są zaprojektowane z głową. Oto co musisz wiedzieć o mailingach produktowych.
Dlaczego wygląd mailingu ma realny wpływ na wyniki sprzedażowe
Email marketing ma jeden z najwyższych zwrotów z inwestycji ze wszystkich kanałów — szacuje się, że przeciętnie każda złotówka wydana na mailing przynosi kilkadziesiąt złotych przychodu. Ale te statystyki dotyczą dobrych kampanii. Mailing z niespójną grafiką, zdjęciami nieładującymi się na mobile i przyciskami CTA ukrytymi gdzieś w połowie treści nie sprzedaje. W e-commerce projektowanie mailingu to osobna dyscyplina, która rządzi się innymi prawami niż projektowanie strony internetowej, i wymaga znajomości środowisk, w których emaile są renderowane.
Specyfika techniczna projektowania dla klientów pocztowych
- Różne środowiska renderowania — Gmail, Outlook, Apple Mail to trzy różne silniki CSS, z różnymi ograniczeniami
- Obrazki często blokowane domyślnie — email musi mieć sens tekstowo i strukturalnie bez żadnych grafik
- Ciemny tryb zmienia kolory tła i tekstu — białe logo na ciemnym tle staje się niewidoczne bez odpowiednich media queries
- Maksymalna szerokość szablonu: 600px na desktop, 100% na mobile — przekroczenie to poziome scrollowanie
- Fonty niestandardowe nie ładują się w wielu klientach — Arial, Georgia, Helvetica są bezpieczne
Open rate a projekt graficzny — zaskakująca zależność
Open rate zależy przede wszystkim od tematu wiadomości i rozpoznawalności nadawcy — nie od grafiki, której odbiorca jeszcze nie widzi. Ale projekt graficzny ma kluczowy wpływ na wskaźniki wtórne, które algorytmy filtrów spamu biorą pod uwagę: czas spędzony na emailu, kliknięcia, poziom przewijania. Email, który odbiorcy otwierają ale natychmiast zamykają, dostaje gorszy score deliverability i następna kampania ląduje w folderze oferty lub spam. Dlatego dobra grafika to inwestycja nie tylko w konwersję bieżącej kampanii, ale w dostarczalność wszystkich przyszłych.
Struktura graficzna skutecznego emaila e-commerce
Mailingi e-commerce, które konwertują, mają prostą i powtarzalną strukturę: nagłówek z logo i ewentualną nawigacją, zdjęcie hero lub baner z komunikatem promocyjnym, jeden główny CTA, siatka produktów (zazwyczaj 2–3 kolumny, maksymalnie 6–9 produktów), opcjonalnie sekcja contentowa lub opinia klienta, footer z danymi sklepu i obligatoryjnym linkiem wypisania. Próba wciśnięcia 20 produktów w jeden email nie działa — lepszy jest email tematyczny ze spójnym wątkiem narracyjnym i 3–6 produktami, które do siebie pasują.
Projektowanie kart produktów w mailingu — co musi działać
- Zdjęcie produktu: proporcje kwadrat lub 4:3, białe tło lub spójne lifestyle, czytelna miniatura na małym ekranie
- Nazwa produktu: krótka, max 2 linie tekstu, font minimalnie 14px dla czytelności na mobile
- Cena: wyraźna i prominentna, dla promocji przekreślona stara cena obok nowej ceny
- Przycisk CTA pod każdym produktem — 'Sprawdź', 'Kupuję', 'Dodaj do koszyka', min. 44px wysokości
- Odstępy między kartami: więcej niż na stronie www — w emailu przestrzeń zwiększa czytelność
Zdjęcia w emailach — optymalizacja, której nie można pominąć
Jedną z najczęstszych pułapek przy projektowaniu mailingu są zbyt ciężkie pliki graficzne. Email z pięcioma zdjęciami po 2MB każde albo nie dotrze do odbiorcy, albo będzie się ładować kilkanaście sekund — a większość użytkowników nie czeka. Optymalizuję zdjęcia do mailingu do maksymalnie 100–200KB przy zachowaniu dobrej jakości. Wystarczy format JPEG z kompresją 70–80% i wymiary rzeczywiście wyświetlane w szablonie, nie oryginalne rozmiary z aparatu. Każde zdjęcie powinno też mieć atrybut alt z opisem — gdy grafika się nie załaduje, użytkownik widzi tekst zamiast pustego prostokąta.
Personalizacja graficzna mailingu — od statycznej do dynamicznej
Najprostszy poziom personalizacji to imię odbiorcy w temacie lub w nagłówku emaila. Bardziej zaawansowany to dynamiczne bloki produktowe oparte na historii przeglądania lub zakupów — klient, który oglądał buty do biegania, widzi inny zestaw produktów niż klient przeglądający odzież casual. Platformy e-mail jak Klaviyo, Mailchimp czy Sendgrid umożliwiają tworzenie szablonów z dynamicznymi sekcjami. Projekt graficzny musi to przewidywać: jeden szablon, wiele wariantów treści, spójna estetyka niezależnie od tego, które produkty trafią do danego segmentu.
Testowanie mailingu przed wysyłką — czego absolutnie nie pomijać
Przed każdą wysyłką sprawdzam szablon w co najmniej trzech środowiskach: Gmail na desktopie i na mobile, Apple Mail oraz Outlook. Sprawdzam też ciemny tryb — białe logo na białym tle jest niewidoczne w dark mode. Klikam każdy link w emailu i weryfikuję, że prowadzi na właściwą stronę z właściwymi parametrami UTM do śledzenia kampanii. Narzędzia takie jak Litmus lub Email on Acid automatyzują ten proces i pokazują podgląd w kilkudziesięciu środowiskach jednocześnie. To 30–60 minut pracy, która może uratować kampanię przed kompromitującymi błędami, na które nie ma drugiej szansy.
