7 trendów w projektowaniu e-mail marketingu, o których musisz wiedzieć

Na pewno słyszałeś powiedzenie o pierwszych wrażeniach. Wszyscy wiedzą, że mamy tylko jedną szansę, aby je zrobić. Ale w przypadku wiadomości e-mail masz kolejne wyzwanie: jeśli Twój e-mail na pierwszy rzut oka nie wygląda atrakcyjnie, większość subskrybentów usunie go bez wahania.

Aby pomóc Ci przetrwać pierwszą awarię skrzynki odbiorczej, przygotowaliśmy krótką listę trendów w projektowaniu wiadomości e-mail, z którymi powinien być zaznajomiony każdy e-mail marketer. Być może nie będziesz musiał projektować własnych e-maili, ale jeśli to zrobisz, te wskazówki sprawią, że Twoje e-maile będą wyglądać nowocześnie i profesjonalnie.

Dla tych z Was, którzy korzystają z narzędzia do edytowania wiadomości e-mail BeeFree, zamieściliśmy również krótkie instrukcje dotyczące każdej z wymienionych tutaj wskazówek.

1) Wszystko sprowadza się do urządzeń mobilnych.

Słyszałeś o „lokalizacja, lokalizacja, lokalizacja” w nieruchomościach, prawda? Dla marketerów e-mailowych jest to „mobilny, mobilny, mobilny”.

Trudno przecenić, jak ważna jest mobilność. 53% e-maili jest otwieranych na urządzeniach mobilnych, zgodnie z ostatnim raportem Litmusa dotyczącym użytkowania urządzeń z 15 stycznia. Jednak wielu sprzedawców e-maili nadal myśli najpierw o komputerach stacjonarnych, a następnie o urządzeniach mobilnych.

Nie pozwól, żeby to był ty. Oprócz korzystania z „responsywnego” projektu wiadomości e-mail, oto najbardziej podstawowe wskazówki dotyczące wiadomości e-mail przyjaznych dla urządzeń mobilnych:

• Wiersze tematu powinny mieć maksymalnie 40 znaków.
• Dostosuj tekst w preheader: jest prawie tak widoczny, jak wiersz tematu na urządzeniach mobilnych.
• Brak tekstu głównego o czcionce mniejszej niż 13 lub 14 punktów. Wielu projektantów e-maili faktycznie zaleca typ 15 lub 16 punktów.
• Najlepiej wyglądają pojedyncze kolumny. Celuj w coś o szerokości mniejszej niż 600 pikseli.
• Kompresuj obrazy tak bardzo, jak to możliwe, o ile nadal wyglądają dobrze, zwłaszcza na urządzeniach o wysokiej rozdzielczości.
• Przyciski powinny mieć co najmniej 48 pikseli szerokości, ale lepiej, jeśli są nieco większe. Dlaczego utrudniać klikanie?
• Unikaj „łącz ułożonych w stos” (kolumny lub listy łączy). Trudno je kliknąć.
• Bądź zwięzły. Usuń wszystkie niepotrzebne treści.
• Zakoduj swoje wezwanie do działania w CSS i HTML lub VML (Vector Markup Language). Nigdy nie używaj obrazu jako wezwania do działania. Jeśli obrazy są wyłączone, wezwanie do działania przez e-mail nie będzie działać. Około 40% wszystkich użytkowników Gmaila nadal ma wyłączone obrazy.

Użytkownicy BeeFree: Oddychaj swobodnie. Nie musisz się martwić o responsywny design. Używasz go już w każdym e-mailu zaprojektowanym przez BeeFree.

Oprócz korzystania z responsywnego projektu, Twoje e-maile BeeFree są również ustawione na kilka domyślnych ustawień specjalnie zoptymalizowanych pod kątem wiadomości e-mail przyjaznych dla urządzeń mobilnych. Podobnie jak szerokość wiadomości e-mail, która jest ustawiona na 600 pikseli:

Chcesz projekt z jedną kolumną? Mamy je. Wybierz dowolny projekt z pojedynczą kolumną ze strony startowej, a następnie po prostu wstaw blok tekstowy o pełnej szerokości, jak poniżej:

2) Ludzie nie czytają e-maili. Skanują je.

Wiąże się to z kilkoma konsekwencjami:

• Niezbędna jest biała spacja. Nie możesz wepchnąć wszystkiego, co masz do powiedzenia w e-mailu. Nie używaj linii lub więcej elementów projektu do dzielenia wiadomości e-mail. Użyj spacji. Jest to tak ważne, że za chwilę nadamy mu własną zasadę.
• Kopia musi być krótka. Ogranicz się do podstaw. Twój e-mail ma jedno zadanie: uzyskać kliknięcie. Skieruj ludzi na stronę docelową. Wszystko inne to sos.
• Akapity muszą być krótkie. W projektowaniu stron internetowych istnieje luźna zasada, że ​​więcej niż pięć wierszy w akapicie wygląda na trudne do odczytania. W e-mailu co najmniej trzy wiersze wyglądają na trudne do odczytania.
• Użyj czytelnej czcionki (ulubiona przez niektórych projektantów Georgia 16 punktów), z dobrym kontrastem z tłem. Unikaj znokautowanego typu.

Aby zwiększyć rozmiar tekstu w BeeFree, po prostu wybierz blok tekstowy i zaznacz tekst. Pojawi się paleta typów. Wybierz zmiany i po prostu usuń zaznaczenie tekstu. Voila.

3) Staraj się, aby stosunek tekstu do obrazu wynosił 60/40.

Niektórzy projektanci potajemnie kreśląc za ekranami komputerów, desperacko próbując kontrolować wygląd swoich e-maili na wielu urządzeniach, zastanawiali się, czy nie mogliby po prostu porzucić tekstu i układu i wysyłać e-maile zawierające tylko obrazy. Niestety nie mogą.

Wśród specjalistów od dostarczania wiadomości e-mail było trochę rozmów o tym, jak zbyt wiele obrazów może tłumić dostarczalność wiadomości. Jestem pewien, że to spowodowało pewne tarcia między projektantami a ludźmi dostarczającymi.

Na szczęście agencja e-mail Email on Acid przeprowadziła pewne badania i stwierdziła, że ​​stosunek tekstu do obrazów nie ma żadnego wpływu na dostarczalność – pod warunkiem, że w e-mailu jest co najmniej 500 znaków tekstu. To około sześciu do siedmiu linijek tekstu, więc ostatecznie poprzeczka jest dość niska.

Nawet jeśli nie ma to wpływu na dostarczalność, zasada 60/40 jest dobrą równowagą, do której warto dążyć. Jeszcze łatwiej to osiągnąć, jeśli dodasz trochę białej przestrzeni.

Aby sprawdzić, czy Twoje e-maile spełniają regułę 60/40, użyj przycisku Podgląd w BeeFree, a następnie obejrzyj e-mail. Zasadniczo chcesz, aby więcej niż połowa obszaru wiadomości e-mail to tekst lub biała przestrzeń wokół tekstu. Lub po prostu policz do 500 znaków, upewnij się, że Twoje obrazy są tak dobrze skompresowane, jak to tylko możliwe, i przestań się martwić.

4) Użyj obrazów o pełnej szerokości.

Gdy już wiesz, jak ich szukać, wszędzie zaczniesz widzieć obrazy o pełnej szerokości. Jasne, są w e-mailach, ale są też w całej sieci. Są to pełne obrazy tła, które czasami się poruszają. Zobacz stronę główną PayPal, aby zapoznać się z przykładem zapętlonego tła wideo.

Istnieje kilka powodów, dla których obrazy o pełnej szerokości są tak popularne. Po pierwsze, dobrze działają na urządzeniach mobilnych. To jest krytyczne. Stanowią również wyraźny kontrast z białą przestrzenią i minimalistycznym designem, o którym porozmawiamy w późniejszych wskazówkach.

BeeFree sprawia, że ​​dodanie obrazu o pełnej szerokości jest bardzo proste. Po prostu przeciągnij blok obrazu, wybierz obraz i gotowe.

Nie zapomnij dodać tagów alt do swoich obrazów. Jeśli ktoś wyłączy swoje obrazy, zobaczy tylko tagi alt. Aby edytować znaczniki alt w BeeFree, wybierz obraz, a następnie edytuj pole znacznika alt w prawej kolumnie.

5) Użyj spacji.

Biała przestrzeń zyskała popularność w wiadomościach e-mail około 2013 roku i jeszcze nie wypadła z łask. Jest kilka powodów, dla których białe znaki są tak cenione:

• Ułatwia skanowanie tekstu, jak wspomniano powyżej.
• Dzięki temu cała wiadomość e-mail wygląda na bardziej czytelną, co oznacza, że ​​jest bardziej prawdopodobne, że zostanie przeczytana.
• Biała przestrzeń pięknie dopasowuje się do różnych urządzeń – idealnie nadaje się do dostosowania do mobilnego designu.

Potrzebujesz więcej pustej przestrzeni w swoich e-mailach? Wypróbuj te wskazówki:

1. Zacznij od białego tła.
2. Użyj „zwiastun”, aby uzyskać jak najwięcej kopii. Oznacza to włączenie pierwszego lub dwóch zdań artykułu, a następnie dodanie linku „czytaj więcej”, aby przyciągnąć subskrybentów do strony docelowej lub strony z treścią.
3. Nie używaj linii do dzielenia sekcji. Użyj spacji.
4. Myśl jak minimalista. Skróć zawartość do niezbędnego minimum.

W BeeFree, jeśli chcesz dodać więcej białych znaków, wybierz pole tekstowe, a następnie przejdź do kontrolki „Ustawienia pola” w prawej kolumnie. Zwiększaj wyściółkę, aż będzie wyglądać tak, jak chcesz.

Chcesz mieć białe tło? Nie ma problemu. Kliknij z dala od bloków wiadomości e-mail, aby nic nie zostało wybrane. Następnie zmień kolor tła, wybierając menu rozwijane koloru tła w lewym górnym rogu edytora.

Przesuń suwak, aby był całkowicie biały.

Kliknij OK. Tło wiadomości e-mail będzie teraz białe.

Aby uzyskać ostatnią tonację dla białej przestrzeni, rozważ wybity typ. Jest bardzo popularny wśród projektantów, ale wykazano, że miażdży czytanie ze zrozumieniem.

Wybite lub „odwrócone” litery to białe litery na czarnym lub kolorowym tle. David Oglivy był właściwie jednym z pierwszych głosów przeciwko odwrotnemu typowi. Myślał, że to trudne do odczytania. I miał rację: oto wyniki badań z książki Colina Wheildona Type & Layout: Jak typografia i projektowanie mogą przekazywać Twoje przesłanie lub przeszkadzać .

Myślałeś, że te dane nie dotyczą typu san serif? Że nadal można używać san serif dla typu znokautowanego? Pomyśl jeszcze raz. Wheildon odkrył, że odwrotny typ bezszeryfowy w rzeczywistości szkodzi czytaniu ze zrozumieniem nawet bardziej niż typ szeryfowy.

6) Dostępny jest wygląd zwykłego tekstu.

To jest siostrzana wskazówka dotycząca białej przestrzeni. Nawiązuje do trendu projektowego minimalizmu. Myślę, że oszczędny projekt Google podsunął trend minimalizmu, ale jestem pewien, że byli inni wpływowi. Tak czy inaczej, tak jak popularna jest biała przestrzeń, coraz częściej pojawia się też wygląd „zwykłego tekstu”.

Oto przykład z biuletynu e-mailowego Belle Beth Cooper:

I kolejny przykład:

BeeFree sprawia, że ​​zwykły tekst wygląda naprawdę łatwo. Zasadniczo domyślnym ustawieniem BeeFree jest wygląd zwykłego tekstu.

Ta wiadomość e-mail BeeFree korzysta z większości ustawień domyślnych. Wszystko, co zrobiłem, to dodanie obrazu i wpisanie innego tekstu. Nie są wymagane żadne umiejętności projektowe!

7) Płaska konstrukcja jest dostępna.

Niezależnie od tego, czy nazwiesz to płaską konstrukcją, czy płaskim stylem, rządzi w sieci. Rządzi też e-mailami. Styl płaski odnosi się do braku cieniowania lub elementów 3D na stronie lub wiadomości e-mail. Charakterystyczne oznaki płaskiej konstrukcji to brak cieniowania, użycie przezroczystości i czcionek bezszeryfowych.

Oto przykład płaskiego projektu na stronie internetowej:

I przykład płaskiego projektu w e-mailu:

Chcesz jeszcze jeden przykład płaskiej konstrukcji? Sprawdź BeeFree. To klasyczna płaska konstrukcja.

To podsumowanie trendów projektowych w e-mail marketingu. Zastosuj te wskazówki do swoich e-maili, aby wyglądały świeżo przez cały 2015 rok. I wracaj do tego bloga – będziemy Cię na bieżąco informować o nowych trendach w projektowaniu e-maili w miarę ich ewolucji.