HTML e-mail háttérszín: A kódolásuk legjobb módja

A háttérszínek kódolása egyszerű feladatnak tűnik? Az igazság? Még ennek a kisebb stílusnak is van néhány buktatója, és néhány szempontot meg kell fontolni, hogy az e-mail kliensek egyenletes megjelenítést kapjanak.

És nem csak a fejlesztőknek kell megnyugtatniuk az inbox isteneket. A Dark Mode lendületével még több olyan környezettel kell számolni, amelyek közül néhány megköveteli az e-mail tervezőktől, hogy fokozott körültekintéssel járjanak el a háttérszínek alkalmazásakor.

Ebben a blogbejegyzésben megtudhatja:

Miért érdemes a háttérszíneket használni az e-mailben?

A háttérszínstratégia helyreállítása néhány igényt elégít ki az e-mail program emelésével kapcsolatban. Technikai szempontból a háttérszínek megvalósítása nem tölt be semmilyen betöltési időt az e-mailekbe, és akkor is láthatók, ha a képeket kikapcsolják. Segíthetnek a tartalom elkülönítésében, az üzenetküldésben vagy az e-mailek megkülönböztetésében az előfizető postaládájában, ezáltal növelve a közönség elkötelezettségét.

Tűnjön ki a beérkező levelek között

Létrehozhat egy hatásos nyitási élményt – például ezt az e-mailt Fülszöveg.

A hős terület ütést üt. A merész narancssárga háttér hatással van azáltal, hogy ellentétben áll a logó kékjével, emelve a márka identitását. Amint az olvasó végiggörgeti a hős területét, a másodlagos tartalom fehér alapon ül, ideális olvasási élményt kínálva a nagyobb példányszámok számára.

Válassza szét a szakaszokat

Ha hosszú e-mailt kapott, a szín nagyszerű módja a különböző tartalmi blokkok vizuális elválasztásának, így emészthetőbbnek érzi magát.

Promóciós e-mailek a kávéházi óriástól Starbucks meglehetősen hosszú lehet, több promócióval egy e-mailen belül. A szakaszok egymástól való elkülönülésének elősegítése érdekében különböző háttérszíneket használnak.

Emelje a márka identitását

A színátmenetek a Marketing Ügynökség részét képezik 1973 Kftmárkanevét, ezért gyakran talál merész lineáris gradienseket az e-mailjeik hátterében. A háttérgradiensek dinamikusabbá tehetik a kompozíciókat, sőt az előfizetőt is görgetésre ösztönzik.

Tehát mi a legjobb módja annak, hogy ezeket a technikákat beépítse az e-mail fejlesztésébe? Megkérdeztem csapattársamat és a Litmus e-mailek fejlesztőjét, Carin Slater, hogy a szilárd és a gradiens háttér kódolásának alacsony szintje legyen.

Hogyan kódoljunk egy szilárd HTML e-mail háttérszínt

A háttérszínek többféleképpen és több helyen is kódolhatók. De az egyes módszerek nem egyformán támogatottak az e-mail kliensek körében. Itt van egy gyors ábra arról, hogy melyik háttérstílus-kód és színkód-módszer működik a legnépszerűbb e-mail klienseknél.

E-mail kliens támogatás a háttérszínekhez

Mindannyian tudjuk, hogy az e-mail kliensek kissé személyeskedők lehetnek. Tehát mi a legjobb módja a háttérszínek kódolásának, így az minden e-mail kliensben működik? Végigvezetem az ajánlásunkat és miért.

1. Használjon táblázatokat és táblázat cellákat

A HTML-ben négy olyan hely van, amelyhez háttérszínt adhat:

A háttérszín hozzáadásának legbiztonságosabb helye egy asztal vagy egy táblázatcella.

A címkét törli a Yahoo és az AOL, így az ott alkalmazott háttérszín nem jelenik meg ezekben az e-mail kliensekben. És egy szín elhelyezése egy csomagoló

után a törzs után mindenhol működne, kivéve az Outlook klienseket, mivel nem támogatják az

címkéket az e-mailekben.

Az e-mail ügyféltámogatás legszélesebb körének eléréséhez csomagolja be a teljes e-mailt egy 100% szélességű

címkébe, és tegye oda a háttérszínét. És használja a táblázat cellákat

az e-mail szakaszaihoz, így nagyobb rugalmasságot biztosít az egyes tartalmi blokkok színezésében. 2. Adjon színt CSS tulajdonsággal és HEX színkódokkal vagy RGB értékekkel A háttérszínek többféleképpen kódolhatók: A bgcolor HTML attribútum használata A CSS tulajdonság háttérszínének használata A CSS gyorsírás tulajdonságainak háttere A hatjegyű hexadecimális színkód használata A háromjegyű hexadecimális színkód használata RGB színértékek használata Ami az asztal vagy a táblázat cellájának háttérszínét illeti, CSS tulajdonságot kell használnia. A két CSS tulajdonságmódszer – háttérszín és háttér – tesztelésével azt tapasztaltuk, hogy mindkettőnek ugyanazok a következetes eredményei vannak, amíg csak színt ad hozzá (kép nélkül). Alapján caniemail.com, a háttér tulajdonság más célra történő felhasználása, csak szín hozzáadása, azt eredményezheti, hogy a színe nem jelenik meg. A bgcolor HTML attribútum nem járt jól az Outlook programban, a 3 jegyű HEX kódok inkonzisztens támogatásával. És az RGB és RGBA értékek használata a helytelen színt, vagy a szín teljes eldobását eredményezte. Itt van a háttérszíntesztünk az Outlook különböző módszereivel, így saját maga is láthatja: Más e-mail kliensekben a háromjegyű HEX kód renderelt, de az RGB és RGBA értékek helytelen színeket eredményeztek, amikor a bgcolor HTML attribútumra alkalmazták őket. Minden tesztelés után egy következtetésre jutottunk: Tartsa be a CSS tulajdonságait, és használjon 3 vagy 6 jegyű HEX kódokat vagy RGB értékeket. Azok az összes e-mail kliensnél dolgoztak. Az RGBA érték alfa opacitásának bevezetését az Outlook, a Web.de vagy a GMX.de nem támogatta, de egyébként megfelelő támogatást nyújtott. Tehát a végső kódnak ilyennek kell lennie, hogy kiszínezze a táblázat teljes hátterét: [ad_2] Forrás link 05:12 Üzlet/Marketing E-mail marketing feltételezések: Dupla feliratkozást kell használnom az összes regisztrációhoz Gadam | 2021.04.24. Read more Related View More 04:16 Read time Kiemelt Gadam | 2024.10.30. A sikeres DIY vállalkozás elindításához szükséges eszközök 07:35 Read time Üzlet/Marketing Gadam | 2024.09.17. A frissesség javítása: Hogyan javítják az innovatív tárolóedények az ételek minőségét az éttermekben? 02:26 Read time Üzlet/Marketing Gadam | 2024.07.25. Miért érdemes reklámajándékokat választani a céged számára? 02:15 Read time Üzlet/Marketing Gadam | 2024.05.04. Az üzleti rugalmasság kulcsa: Kiszervezés a hatékony munkaerő-menedzsment stratégiájában 02:54 Read time Üzlet/Marketing Gadam | 2023.11.08. Az iroda szerepéről a vállalatok mindennapjaiban (×) 03:37 Read time Üzlet/Marketing Gadam | 2023.08.16. Hogyan készítsek saját üzleti weboldalt? (×) 02:48 Read time Üzlet/Marketing Gadam | 2023.08.08. Egyszerű hozzáférhetőség mobil lépcső segítségével(×) 03:02 Read time Üzlet/Marketing Gadam | 2022.11.24. Díjnyertes logó készítés házilag 02:03 Read time Kiemelt Gadam | 2022.10.27. Milyen tonereket érdemes vásárolni a fenntartható irodába?(×) Minden jog fenntartva 2019-2022. Hogyankészítsek.Hu Adatvédelem Kapcsolat Szakértő vagyok/Cikket ajánlok Impresszum