Kodowanie HTML i CSS w wiadomościach e-mail

Spisie treści
Ci, którzy zajmują się e-mail marketingiem, powinni wiedzieć, jak tworzyć e-maile w html.
Zobaczymy kilka zaleceń dotyczących projektowania, kodowania i dostarczania wiadomości e-mail w formacie HTML oraz sprawienia, aby Twój Newsletter wyglądał dobrze w większości klientów poczty e-mail.
Wysyłanie e-maili z Newsletterów to dobra forma komunikacji między redaktorami a czytelnikami, ale jeśli zrobimy to również w formacie HTML, pozwoli nam to wzbogacić dokument o elementy wizualne uatrakcyjniające e-mail, bezpośredni dostęp do innych lokalizacji i Umożliwi nam dokonywanie pomiarów otwarć e-maili, śledzenie i liczenie odwiedzanych przez Ciebie linków, mierzenie zainteresowań czytelnika itp.
Wysyłając wiadomość e-mail w postaci zwykłego tekstu nie możemy korzystać ze wszystkich tych funkcjonalności, a wręcz przeciwnie, uzyskujemy inne korzyści, takie jak niższy poziom spamu poprzez nieuwzględnianie tagów HTML, dzięki czemu klienci poczty mogą łatwiej zwizualizować treść e-maila u wszystkich klientów.
Kodowanie HTML dla wiadomości e-mail może przysporzyć wielu kłopotów, ponieważ zarówno komputerowe, jak i internetowe klienty pocztowe nie są zgodne z żadnym standardem internetowym, nie interpretują dobrze kodu HTML i arkuszy stylów ani nie interpretują go na swój własny sposób. do otrzymanej wiadomości e-mail, więc projekt wiadomości e-mail, którą otrzymuje odbiorca, może się znacznie różnić od projektu redaktora, który wysłał tę wiadomość e-mail.
HTML przez CSSStaraj się używać znaczników HTML i ich właściwości tak często, jak to możliwe, zamiast arkuszy stylów, ponieważ wiele właściwości i selektorów CSS jest ograniczonych przez klientów WWW.
Korzystanie z tabel do układuTak, wracamy do stolików. Standardy internetowe mówią, że tabele nie powinny być używane do układania strony internetowej, ale nie jest to strona internetowa, ale e-mail i zaleca się ich używanie zamiastjeśli chcemy, aby nasz Newsletter dobrze się wyświetlał u większości czytelników poczty. A chodzi o to, że klienci poczty nie obsługują wielu właściwości niezbędnych do projektowania z podziałami.
Użyj atrybutów tabeli i komórki, aby wyświetlić tabelę zamiast korzystać z właściwości CSS. Na przykład przypisz border = "0", valign = "top", align = "left" (lub center), cellpadding = "0", cellpacing = "0" i tak dalej. Dzięki temu tabela będzie dobrze wyglądać w starych klientach poczty.
Użyj tabeli jako kontenera dla wszystkich tabel i elementów wewnętrznych (na przykład nagłówka, treści i stopki).
Staraj się nie zagnieżdżać zbyt wielu tabel i unikaj używania właściwości „colspan”, ponieważ ta właściwość nie jest dobrze rozumiana przez niektórych klientów stacjonarnych.
Rozmiar i rozdzielczość. Z pewnością jesteś przyzwyczajony do kodowania stron internetowych w przybliżeniu w rozdzielczości 800 × 600 lub 1024 × 768, ale w przypadku projektowania wiadomości e-mail w HTML może to nie działać zbyt dobrze, ponieważ większość klientów wyświetla wiadomość e-mail w rodzaju „panelu podglądu”, który jest zwykle częścią całkowitej dostępnej przestrzeni.
Najlepiej ustawić szerokość na około 500-600px lub podać rozmiar w procentach, tak jak zwykle to robię, aby dostosować się do dostępnej przestrzeni.
Korzystanie z kaskadowych arkuszy stylów (CSS)Użycie arkuszy stylów w dokumentach HTML dla poczty e-mail jest ograniczone i w zależności od klienta zezwoli na mniej lub więcej właściwości. W idealnym przypadku style powinny być stosowane do samego znacznika (style wbudowane), a nie deklarować klasy w znaczniku Head, tak jak na stronie internetowej…
Na przykład zaleca się używanie

zamiast

.
Jeśli używamy obrazów, lepiej użyć pełnej ścieżki do domeny, w której obraz jest hostowany.Podobał Ci się i pomógł ten samouczek?Możesz nagrodzić autora, naciskając ten przycisk, aby dać mu pozytywny punkt

Będziesz pomóc w rozwoju serwisu, dzieląc stronę ze swoimi znajomymi

wave wave wave wave wave