Na pierwszy rzut oka, podpisy email mogą nie wydawać się tak ważne, zwłaszcza jeśli porównasz je z innymi rzeczami, które dzieją się w Twojej firmie. Ale jeśli zagłębisz się w to głębiej, dowiesz się, że podpisy email odgrywają znaczącą rolę, jeśli chodzi o marketing, budowanie marki lub utrzymywanie dobrych relacji z klientami. Co więcej, zastrzeżenia dodane do tych podpisów mogą również zapobiec problemom prawnym. Pamiętaj, że nawet najlepiej napisany e-mail może nie spełnić swojej roli, jeśli nie jesteś wystarczająco pewny firmy, z którą masz do czynienia, więc zdobycie zaufania klienta powinno być priorytetem dla każdego pracownika w Twojej firmie. Z pewnością dobrze wyglądający podpis emaila, który zawiera przydatne informacje jest miłą próbą zrobienia dobrego wrażenia. A jeśli połączysz dobrze wyglądający podpis z atrakcyjnym banerem marketingowym, rezultaty mogą przerosnąć Twoje oczekiwania.
Jest kilka wymagań, które powinien spełniać każdy podpis. Przeanalizujmy je po kolei. Są to:
- Czysty, ale przyciągający uwagę design
- Kompatybilność z urządzeniami mobilnymi
- Niezbędne informacje osobiste, które nie przytłaczają odbiorcy
- Obsługa mediów społecznościowych
Less code, więcej designu
Kwestie formatowania
W przeciwieństwie do stron internetowych, większość podpisów email nie zawiera zewnętrznego pliku CSS lub sekcji stylów w części HEAD dokumentu. Zasadniczo, CSS jest warstwą opisującą jak kod HTML powinien być prezentowany – przy użyciu jakich kolorów, rozmiarów czcionek/rodzin i więcej. Nawet gdyby podpisy email zawierały zewnętrzny CSS, nie zadziałałoby to, ponieważ niektóre klienty email całkowicie ignorują CSS. Najlepszym sposobem na uzyskanie wiarygodnych rezultatów jest upewnienie się, że używasz jak najmniejszej ilości kontenerów HTML i umieszczasz reguły CSS wewnątrz każdego kontenera (używając atrybutu style). Nie oczekuj, że wewnętrzne kontenery będą dziedziczyć reguły formatowania ze swoich patentów – po prostu zdefiniuj te reguły bezpośrednio. Na przykład, jeśli chodzi o tabele, umieść swoje reguły formatowania tekstu wewnątrz elementu <TD> i nawet nie myśl o wstawianiu do środka znacznika <P>. Po pierwsze, nie jest on w ogóle potrzebny (do zbytniego komplikowania podpisu bez powodu). Po drugie, niektóre klienty poczty (szczególnie Outlook) mogą „zapomnieć” o formatowaniu tekstu użytego w elemencie TD, pozostawiając treść niesformatowaną i wyświetlaną w domyślnych czcionkach (np. Times New Roman) – więc zdecydowanie nie jest to coś, co chcesz osiągnąć. Poniższy zrzut ekranu pokazuje czcionkę podpisu zmienioną na Times New Roman po wysłaniu odpowiedzi.
Podczas komponowania podpisu pamiętaj, że nawet różne wersje Outlooka lub innych klientów poczty mogą lub nie mogą obsługiwać niektórych podstawowych atrybutów CSS/HTML. Tutaj jest dobre miejsce, aby dowiedzieć się, które atrybuty są rozpoznawane.
Inną rzeczą jest to, że powinieneś skomponować swój podpis ręcznie lub za pomocą edytora zoptymalizowanego do tego celu – większość edytorów WYSIWYG (szczególnie Outlook i Word) dodaje nieoficjalny kod CSS i HTML, który sprawia, że Twój podpis wyświetla się idealnie dla nich, pozostawiając go rozbitym dla reszty klientów poczty. Innymi słowy, kopiowanie zawartości podpisu z Worda nie jest dobrym pomysłem – jest to dobry edytor dokumentów, ale zdecydowanie nie jest to narzędzie stworzone do tworzenia podpisów email.
Podpisy z co najmniej dwoma kolumnami
Są dwa najlepsze podejścia do tworzenia podpisu, w zależności od typu, który wybrałeś. Dla układów, które są szersze lub bardziej zaawansowane, możesz osiągnąć najlepsze rezultaty używając tabel HTML. Stare dobre tabele pozwalają na uzyskanie niezawodnego i spójnego układu na dosłownie każdej platformie. Dzieje się tak dlatego, że nie ma wielu sposobów na ich interpretację, w przeciwieństwie do kontenerów <DIV>. Właściwie większość klientów poczty elektronicznej nie obsługuje poprawnie właściwości float dla kontenerów HTML, pozostawiając całą zawartość uszkodzoną. Co więcej, należy pamiętać, że każdy klient poczty elektronicznej wbija swoje wiosło w kod HTML (podczas odpowiadania lub przekazywania wiadomości dalej), czyniąc kod źródłowy czystym jak błoto.
Najlepiej jest unikać tych implikacji na samym początku. Widzieliśmy wiele sytuacji, w których użytkownicy chcieli, aby pierwszy wiersz tabeli składał się z dwóch kolumn, a drugi z dwóch połączonych kolumn. W większości przypadków komórki nie miały pożądanego rozmiaru. Najlepszym rozwiązaniem byłoby stworzenie dwóch tabel jedna po drugiej, tak jak na obrazku poniżej.
Ostatnią rzeczą, o której chcemy tutaj wspomnieć jest to, że nie powinieneś używać tabel, które są szersze niż 600 pikseli, ponieważ może to spowodować powiększenie całego emaila na niektórych urządzeniach (porozmawiamy o tym później).
Podpisy z jedną kolumną
Inne podejście może być użyte, jeśli twój podpis składa się z elementów pojawiających się jeden pod drugim. W takim przypadku lepiej pozostać przy jednym kontenerze – w zasadzie powinien wystarczyć jeden akapit. Nie oznacza to oczywiście, że nie można inaczej sformatować poszczególnych części podpisu – wystarczy użyć do tego znaczników <SPAN>. A jeśli chcesz przerwać linię, zawsze używaj znacznika <BR> zamiast tworzyć nowy akapit. Aby to zrobić, możesz po prostu nacisnąć Shift+Enter w większości edytorów WYSIWYG (włączając w to te używane w produktach CodeTwo). Używając tak podstawowej składni HTML, możesz uzyskać najlepszy wygląd swojego podpisu email, także na urządzeniach mobilnych, zupełnie od ręki i bez bawienia się z media queries. Jeśli jednak musisz użyć więcej niż jednego akapitu, pamiętaj o wyraźnym zdefiniowaniu marginesów i spadów dla swoich akapitów. W przeciwnym razie możesz napotkać niechciane (zmniejszone/zwiększone) odstępy pomiędzy nimi. Na koniec, jedyny problem może się pojawić, jeśli wstawisz dość szeroki obrazek (ale nie martw się, zajęliśmy się tym w dalszej części artykułu).
Wsparcie dla urządzeń mobilnych
Zagłębmy się w temat wsparcia dla urządzeń mobilnych. Era maili, które są czytane tylko na komputerach stacjonarnych już się skończyła. Ponad połowa maili jest otwierana na urządzeniach mobilnych – telefonach i tabletach. Większość podpisów email nie jest zoptymalizowana dla platform mobilnych i może powodować problemy z renderowaniem całego emaila. Kluczem do zrozumienia tego problemu jest świadomość, że producenci urządzeń mobilnych doskonale zdają sobie sprawę z tego typu problemów, jednak ich rozwiązania są różne. Ta sama wiadomość i podpis mogą być wyświetlane w różny sposób w zależności od mobilnego systemu operacyjnego. Wszystkie te rozwiązania są jednak stosowane tylko w przypadku, gdy treść Twojego maila nie może być wyświetlona normalnie z powodu pewnych ograniczeń. Na przykład, jeśli Twój podpis jest szerszy niż szerokość ekranu, telefon komórkowy może ukryć część podpisu lub powiększyć całą wiadomość, aby wyświetlić ją na całej szerokości. Ale prawdziwym lekarstwem jest zaprojektowanie podpisu w taki sposób, aby klient poczty nie musiał korzystać z tych dodatkowych rozwiązań, aby poprawnie wyświetlić wiadomość.
Aby to osiągnąć, musisz zachować podpis tak wąski, jak to tylko możliwe, nie używając żadnych stałych wymiarów, chyba że są one naprawdę konieczne. Zastanów się również, co jest najlepsze – zawijać słowa i zachować dobry rozmiar czcionki (zachowanie domyślne), czy nie zawijać i pozwolić na powiększanie wiadomości (możesz dodać white-space: nowrap właściwość CSS).
Jeśli chodzi o dodanie banera lub szerokiego obrazka, możesz zauważyć, że taki obrazek może również powiększyć wiadomość, tak jak szeroka tabela. Dlatego rozważ użycie właściwości CSS max-width: 100%, aby automatycznie skalować ten obraz – twój mobilny klient poczty będzie utrzymywał go w takiej szerokości, w jakiej jest twój ekran.
Co więcej, niektórzy klienci poczty nie pozwalają na wyświetlanie tekstu mniejszego niż żądany rozmiar. Można to obejść (jak w tym artykule dla urządzeń z systemem iOS), ale zanim spróbujesz to zrobić, upewnij się, że naprawdę tego potrzebujesz. Innym częstym błędem jest nakładanie się tekstu podpisu (zwłaszcza w miejscu, gdzie znajduje się stopka). Wynika to z błędnie użytej właściwości line-height – te same wartości, które idealnie pasują na komputerze stacjonarnym, nie są po prostu dostosowane do urządzeń mobilnych. Właściwie w tym konkretnym przypadku wydaje się, że lepsze jest wrogiem dobrego i zalecamy unikanie używania tej właściwości, ponieważ domyślne ustawienia po prostu doskonale spełniają swoją rolę.
Jednakże problemy wymienione powyżej dotyczą tylko wiadomości w formacie HTML, podczas gdy większość urządzeń mobilnych używa zamiast tego formatu Plain Text (a więc e-maile są stemplowane tylko niesformatowanym tekstem). Dla niektórych z tych urządzeń, nie ma opcji konwersji wiadomości do formatu HTML. Na szczęście, niektóre rozwiązania firm trzecich (takie jak CodeTwo Email Signatures for Office 365 lub CodeTwo Exchange Rules Pro) mają wbudowaną tę funkcję, dzięki czemu możesz wykorzystać wszystkie zalety podpisów HTML, nawet jeśli email został wysłany w formacie Plain Text.
Dobrze podana informacja smakuje lepiej
Jest oczywiste, że treść, którą umieszczasz w podpisie musi być odpowiednia – Twój odbiorca nie może mieć wrażenia, że brakuje w nim jakiejś informacji o Twojej firmie. Z drugiej strony, podpis nie może być przytłaczający. Ostatecznie, rzeczywista wiadomość w mailu jest o wiele ważniejsza niż sam podpis.
Mając to na uwadze, możemy założyć, że każdy podpis powinien być spersonalizowany dla każdego użytkownika, ale jednocześnie powinien zachować wspólny wygląd, tak aby odbiorca wiedział, że maile pochodzą z tej samej firmy. Masz kilka sposobów na dostarczenie podpisów do każdej osoby. Najprostszym i najbezpieczniejszym sposobem jest wykorzystanie rozwiązań pozwalających na scentralizowane zarządzanie emailami (jak CodeTwo Email Signatures for Office 365 lub CodeTwo Exchange Rules Pro), gdzie możesz wykorzystać informacje zebrane z tenanta Office 365 lub lokalnego Active Directory. Jeśli nie posiadasz takiego środowiska, może to być prawdziwe wąskie gardło, ponieważ nie ma źródła, z którego można pobrać dane użytkowników, a podpisy poprzez obiekty Group Policy nie działają na niektórych platformach. Może to być więc ogromny ból głowy.
Oprócz tego trzeba wziąć pod uwagę, że niektóre dane osobowe mogą nie być wypełnione w przypadku niektórych użytkowników. Na przykład, osoba, która pracuje zdalnie może nie mieć podanego swojego bezpośredniego numeru. Zamiast tworzyć dziesiątki podpisów z/bez niektórych atrybutów Active Directory, możesz użyć znaczników RT dostępnych w programie CodeTwo, które ukryją niektóre części podpisu, jeśli brakuje danych w AD / Office 365.
Ponadto, aby uatrakcyjnić wygląd, użyj różnych rozmiarów i rodzin czcionek, a także różnych kolorów. Nie można jednak używać czcionek, które nie są domyślnie zainstalowane – zamiast nich może zostać wyświetlona brzydka alternatywa. I nawet nie próbuj używać śmiesznych rodzin czcionek, takich jak Comic Sans lub krzykliwych kolorów. W przeciwnym razie Twoi klienci uciekną i powiedzą swoim partnerom biznesowym, że Twoja firma ma najgorsze podpisy w sieci. Przykład dobrze zaprojektowanego podpisu email jest pokazany poniżej.
Ostatni, ale nie najmniej ważny – używaj tylko popularnych formatów obrazów jak JPEG lub PNG i albo zmień ich rozmiar do pożądanego rozmiaru przed umieszczeniem ich w podpisie lub przeskaluj je w dół używając zarówno HTML jak i CSS.
Media społecznościowe przybliżają Cię do Twoich klientów
W dzisiejszych czasach, platformy mediów społecznościowych są jednym z najlepszych miejsc do poprawy Twojego wizerunku w sieci. Dlaczego więc nie dać znać swoim klientom, że masz tam założone oficjalne profile? Dobrym rozwiązaniem będzie umieszczenie małej ikonki z logo wybranej platformy social media, która będzie linkować bezpośrednio do Twojego profilu. Oczywiście w podpisie email możesz umieścić dowolną ilość linków do mediów społecznościowych. Niektóre edytory dostępne w scentralizowanych narzędziach do zarządzania pocztą elektroniczną mogą uczynić ten proces znacznie łatwiejszym niż ręczne łączenie linków z ikonami. Co więcej, pozwalają one również na wykorzystanie danych użytkowników (np. przechowywanych w Active Directory) do tworzenia potrzebnych linków. Dzięki temu możesz dodać link nie tylko do wspólnego profilu firmy, ale także do kont poszczególnych użytkowników na wybranych platformach społecznościowych.
Podczas linkowania ikon do platform społecznościowych upewnij się jednak, że używasz formatu PNG lub JPG obrazu oraz że zastosowałeś atrybut border=0 dla samego obrazu. W przeciwnym razie może pojawić się niechciana niebieska obwódka wokół całego obrazu.
Dodatkowo, dobrym pomysłem jest dodanie klikalnego banera do podpisu, który łączy się z Twoim wydarzeniem lub aktywnością, która może być później udostępniona wśród Twoich klientów. W ten sposób można promować swoje co ważne kampanie marketingowe firmy prawie bez wysiłku.
Podsumowując, teraz powinieneś wiedzieć, jak zaprojektować dobry podpis e-mail i sprawiają, że wyglądają spójne nawet na platformach mobilnych, bez konieczności czytania ogromnie mały tekst z powodu powiększania wiadomości, co może być prawdziwy ból. Kluczem jest utrzymanie projektu tak prostym, jak to tylko możliwe i użycie starych, dobrych metod, zamiast bawić się w zaawansowane kody CSS, które mogą być po prostu ignorowane przez klientów poczty. Istnieją w zasadzie dwa rodzaje podpisów, które są najlepsze do wykorzystania: poziomy, umieszczony w tabeli HTML, który nie jest jeszcze zbyt szeroki, i pionowy, który wyświetla szczegóły jeden pod drugim.
Jeśli chodzi o dodawanie podpisów do wiadomości e-mail wysyłanych do klientów, przy użyciu scentralizowanych rozwiązań podpisu e-mail jest najlepszym sposobem, aby to zrobić. Dzieje się tak dlatego, że rozwiązania te, wykorzystując informacje osobiste przechowywane w Active Directory lub Office 365, mogą być używane do tworzenia indywidualnych podpisów dla każdego z Twoich użytkowników, a nawet wstawiania spersonalizowanych linków do mediów społecznościowych. Kolejną ważną rzeczą, na którą warto zwrócić uwagę jest to, że rozwiązania te mogą być wykorzystane do łatwego tworzenia banerów informujących odbiorców o ważnych wydarzeniach firmowych.
Nie wahaj się wypróbować CodeTwo Email Signatures for Office 365 oraz CodeTwo Exchange Rules Pro za darmo i wykorzystaj ich edytory WYSIWYG do stworzenia spójnego i dobrze wyglądającego podpisu email.