Dlaczego stopka wygląda idealnie w jednej skrzynce, a w innej jest zepsuta? Logo jest ogromne. Kolory zniknęły. Współpracownik widzi surowy kod zamiast nazwy firmy.
Stopki e-mail w HTML używają sformatowanego znacznika do kontroli układu, linków i obrazów w bloku kontaktowym. Dają większą kontrolę nad wyglądem niż czysty tekst. Zachowują się też inaczej w różnych programach pocztowych, więc warto zrozumieć kompromisy, zanim się zdecydujesz.
Czym jest stopka e-mail w HTML?
Stopka e-mail w HTML to blok kontaktowy zbudowany ze znaczników, a nie ze zwykłych znaków. Może zawierać logo jako obraz, stylizowany tekst i klikalne linki do strony lub profili społecznościowych. Program pocztowy przechowuje kod i wstawia go pod każdą wiadomością.
Stopki HTML wyglądają bliżej mini strony internetowej niż wpisanego bloku adresowego. Ten wizualny szlif wspiera rozpoznawalność marki w połączeniu z domeną z rozdziału tworzenie adresów e-mail na własnej domenie.
Czym stopki HTML różnią się od czystego tekstu
Stopki z czystego tekstu używają tylko podziałów linii i prostych znaków. Każdy program wyświetla je tak samo. Stopki HTML dodają elementy projektu, ale mogą wyglądać z innymi odstępami, czcionkami lub brakującymi obrazami, zależnie od aplikacji odbiorcy.
HTML sprawdza się, gdy potrzebujesz logo, koloru marki lub kilku ikon z linkami. Czysty tekst sprawdza się w krótkich odpowiedziach wewnętrznych lub rolach, w których szybkość liczy się bardziej niż wygląd. Wiele zespołów trzyma obie wersje w swoim szablonie stopki e-mail.
Jak zbudować stopki HTML, które się sprawdzają
Programy pocztowe to nie przeglądarki. Usuwają lub ignorują wiele standardowych technik webowych. Trzymaj się prostych, przetestowanych wzorców.
1. Używaj stylów inline
Stosuj kolor i rozmiar czcionki bezpośrednio na każdym elemencie. Zewnętrzne arkusze stylów często są usuwane. Style inline działają w większej liczbie programów niż CSS oparty na klasach.
2. Hostuj obrazy na własnej domenie
Linkuj pliki logo z serwera swojej strony, a nie z tymczasowych linków do przesłanych plików. Obrazy na Twojej domenie ładują się niezawodnie i pasują do sygnału zaufania z rozdziału profesjonalny e-mail a Twoja strona.
3. Utrzymaj prosty kod
Unikaj tabel zagnieżdżonych w tabelach, własnych czcionek i dużych obrazów tła. Jedna prosta tabela z logo i wierszami tekstu pokrywa większość potrzeb marki. Przetestuj, wysyłając do siebie i otwierając wiadomość na telefonie.
Kiedy wybrać HTML zamiast czystego tekstu
Wybierz HTML, gdy wytyczne marki wymagają logo i koloru w każdej wiadomości wychodzącej. Wybierz czysty tekst, gdy zespół wysyła dużo krótkich odpowiedzi albo gdy priorytetem są dostarczalność i szybkość ładowania.
Jeśli używasz HTML, zawsze przygotuj zapasową wersję z czystego tekstu dla programów, które usuwają formatowanie. Rozdział formatowanie bloku stopki e-mail omawia zasady układu stosowane w obu formatach.
Najczęściej zadawane pytania
Czy potrzebuję umiejętności programowania, by stworzyć stopkę e-mail w HTML?
Podstawowe stopki HTML używają prostych znaczników linków i obrazów, które można skopiować z szablonu. Nie potrzeba zaawansowanych umiejętności programowania. WEMASY pomaga hostować pliki logo na Twojej domenie przez kreator stron.
Dlaczego obrazy znikają w niektórych stopkach e-mail w HTML?
Niektóre programy pocztowe domyślnie blokują obrazy, dopóki odbiorca ich nie zezwoli. Hostuj obrazy na własnej domenie i utrzymuj małe rozmiary plików. Zawsze dodawaj tekst alternatywny z nazwą firmy, żeby tekst był widoczny, gdy obrazy są zablokowane.
Czy stopki e-mail w HTML mogą spowalniać moje wiadomości?
Duże obrazy i ciężki znacznik wydłużają czas ładowania, zwłaszcza w sieciach mobilnych. Kompresuj pliki logo i ogranicz liczbę obrazów z linkami. Lekki blok wysyła się szybciej i wygląda bardziej profesjonalnie.
Czy wklejać kod HTML bezpośrednio do programu pocztowego?
Większość firmowych programów pocztowych ma edytor stopki, który przyjmuje wklejony HTML lub edytor wizualny. Wklej kod, zapisz i wyślij wiadomość testową. Zajrzyj do rozdziału czym jest program pocztowy, by zrozumieć, jak Twoje narzędzie obsługuje stopki.
Czy stopki e-mail w HTML są bezpieczne w użyciu firmowym?
Stopki HTML są bezpieczne, gdy kontrolujesz kod i samodzielnie hostujesz obrazy. Unikaj wklejania stopek z nieznanych źródeł. Trzymaj się szablonów, które Twój zespół tworzy i sprawdza wewnętrznie.
Jak stopki HTML łączą się z zasadami projektu marki?
Zastosuj to samo logo, kolory i wybory czcionek z księgi marki. Rozdział dobre praktyki projektowania stopki e-mail omawia zasady wizualne obowiązujące w HTML i czystym tekście.