Aby prawidłowo przygotować grafikę, która zostanie wykorzystana do opracowania kodu HTML w celu wysyłki mailingu, należy zastosować poniższe rozwiązania:
Optymalna szerokość grafiki
Grafika powinna mieć optymalną szerokość 600-700 pikseli.
Formaty grafiki
Grafika powinna być zapisana w formacie .jpg, .png lub .gif. Należy pamiętać, aby rozszerzenia były pisane małymi literami.
Personalizacja fragmentów grafiki
Jeśli część grafiki ma być personalizowana, zaleca się zastosowanie jednolitego tła w miejscu personalizacji.
Rozmiar i rodzaj czcionki
Rozmiar czcionki nie powinien być mniejszy niż 10 pikseli, a rodzaj czcionki powinien należeć do popularnych grup używanych w Internecie, takich jak Arial, Verdana, Tahoma lub Times New Roman.
Grafika w tle tekstu
Nie zaleca się umieszczania grafiki w tle tekstu, ponieważ nie wszystkie programy pocztowe obsługują tę funkcję. W takim przypadku tekst będzie widoczny, ale grafika nie będzie wyświetlana.
Grafika w mailingach na urządzeniach mobilnych
Na urządzeniach mobilnych grafika z tekstem może być pomniejszona i trudna do odczytania. Aby tekst zawsze był widoczny, niezależnie od pobrania obrazów, należy umieścić go na jednolitym tle, które będzie można zapisać w kodzie HTML jako kolor.
Dopasowanie grafiki do trybu ciemnego – dark mode
Aby grafika była dostosowana do trybu ciemnego, zaleca się używanie przezroczystego lub ciemnego tła. Przy przezroczystym tle należy pamiętać, że w dark mode kolor tła zostanie odwrócony, co może wpłynąć na czytelność elementów. W takim przypadku warto sprawdzić, czy wszystkie detale pozostają widoczne. Jeśli któryś z elementów staje się mniej czytelny, można dodać mu obramowanie o grubości 1 px w kolorze tła, aby zachować odpowiedni kontrast.
Umieszczenie tekstu w projekcie mailingu
Upewnij się, że tekst umieszczony w projekcie mailingu mieści się w prostokątach o jednolitym tle. Jeśli w projekcie występują linie krzywe, pole tekstu powinno znajdować się ponad lub pod krzywą, nie wchodząc w jej obszar. W przeciwnym razie tekst będzie musiał pozostać grafiką i nie będzie możliwy do edycji.
Przyciski CTA
Jeśli przyciski mają mieć edytowalny tekst, nie należy stosować cieni ani zaokrąglania rogów. W przeciwnym razie przyciski zostaną wyświetlone jako grafika, a edycja treści nie będzie możliwa.
Obszar na tekst personalizowany
Miejsce przeznaczone na tekst personalizowany powinno być dostatecznie duże, aby pomieścić najdłuższą dopuszczalną wartość danej cechy. Na przykład, jeśli używamy zmiennej „Miasto”, należy zapewnić miejsce na wpisanie wartości „Ełk” lub „Nowy Dwór Mazowiecki”.
Waga i rozdzielczość grafiki
Maksymalna waga grafiki nie powinna przekraczać 100-150 kB. Parametr rozdzielczości grafiki powinien być zapisany z wartością nie większą niż 72 dpi.
Rozmiar grafiki w newsletterze
Grafika przeznaczona do umieszczenia w newsletterze powinna mieć natywny rozmiar. Na przykład, jeśli chcemy, aby obrazek wyświetlał się w rozmiarze 100 na 100 pikseli, to powinien mieć dokładnie takie wymiary na serwerze. Umieszczenie pliku o mniejszych lub większych wymiarach spowoduje utratę jakości grafiki.
Nazwy plików graficznych
Nazwy plików graficznych nie powinny zawierać spacji, myślników ani znaków specjalnych. Długość nazwy pliku grafiki nie może przekraczać 35 znaków.
Dopasowanie wiadomości do standarów dostępności cyfrowej WCAG 2.2
Nowa wersja standardu WCAG 2.2 rozszerza wymagania dotyczące dostępności cyfrowej, szczególnie dla osób z niepełnosprawnościami wzroku, ruchu oraz trudnościami poznawczymi. Dostosowanie komunikacji e-mailowej do tych wytycznych jest kluczowe dla zapewnienia szerokiego dostępu do treści. Dowiedz się więcej z tego artykułu: Dostosowanie mailingów w SARE do standardu WCAG 2.2
