Czym jest responsywność
Responsywność (z angielskiego responsive design) to podejście do projektowania e-maili i stron internetowych, w którym treść automatycznie dopasowuje się do rozdzielczości i wielkości ekranu urządzenia, na którym jest wyświetlana. Układ jednokolumnowy na telefonie, dwukolumnowy na tablecie, wielokolumnowy na komputerze – wszystkim tym zajmuje się responsywny kod, bez żadnej ingerencji użytkownika.
Od strony technicznej odpowiadają za to tzw. media queries – reguły CSS, które stosują różne style w zależności od szerokości ekranu.
Dlaczego responsywność ma znaczenie w e-mail marketingu
Udział e-maili otwieranych na urządzeniach mobilnych od dawna rośnie i w większości sklepów internetowych stanowi ponad połowę wszystkich otwarć. Nieresponsywny e-mail na telefonie albo zniechęca klienta, albo wręcz uniemożliwia mu kliknięcie przycisku, bo jest on po prostu za mały.
Skutki słabej responsywności
- Klient usuwa e-mail bez czytania → niższy open rate
- Klient nie jest w stanie kliknąć w CTA → niższy click rate i CTOR
- Złe wrażenia psują wizerunek marki
Responsywność sklepu internetowego i jej wpływ na marketing
Responsywność jest tak samo ważna dla strony sklepu internetowego, jak dla e-maili. Klient, który kliknie w link w newsletterze i trafi do sklepu internetowego, który źle wyświetla się na telefonie, z dużym prawdopodobieństwem wyjdzie bez zakupu.
Oznacza to, że nawet najlepsza kampania e-mailowa z wysokim CTOR nie przyniesie efektów, jeśli strona docelowa nie działa na telefonie. Co więcej, szybkość wczytywania i wygoda korzystania z sklepu internetowego na urządzeniach mobilnych to czynniki, które Google bierze pod uwagę przy ustalaniu kolejności w wynikach wyszukiwania.
Responsywność w Leadhubie
Leadhub generuje e‑maile z responsywnym kodem opartym na media queries – regułach CSS, które dostosowują układ e‑maila do szerokości ekranu urządzenia. Edytor drag & drop automatycznie tworzy e‑maile, które poprawnie wyświetlają się na telefonie, tablecie i komputerze, bez konieczności ręcznej edycji kodu.
Podczas tworzenia kampanii możesz przełączać się między podglądem na komputerze a podglądem mobilnym bezpośrednio w edytorze i sprawdzić, jak e‑mail wygląda na różnych urządzeniach, jeszcze zanim go wyślesz. Dodatkowo wybrane fragmenty treści możesz ustawić tak, aby były widoczne tylko na komputerze lub tylko na telefonie – na przykład pokazać na telefonie skróconą wersję tekstu, a na komputerze pełną.
Przed wysłaniem kampanii zawsze zalecamy sprawdzenie podglądu mobilnego – inny układ, wielkość tekstu czy zachowanie przycisków mogą znacząco wpłynąć na wyniki kampanii.