Layout html e-mailek
Alapok elrendezés html e-mailek
Bármilyen web developer előbb-utóbb szembesül annak szükségességét, hogy szedése betűk levelek és értesítések az oldalról. Ez nem csak az online boltok, ahol van sürgősen szükség van egy kényelmes és kívánatos, gyönyörű leveleket értesítést a rendelés állapota, hanem más oldalakon, hogy a lehetőséget, hogy regisztráljon vagy iratkozz fel a hírlevélre.
Mint látható, a magyar szegmens az interneten részletesebb cikkeket ebben a témában nem annyira - többnyire nagyon általános ajánlásokat. És ahogy a közelmúltban vette fel ezt a témát, nem tudom kihagyni a lehetőséget, hogy beszéljen egy kicsit az olvasóknak =)
Itt fogunk beszélni közönséges leveleket.
Főbb feladatok:
Van elég sok árnyalatok, hogy fontolja meg.
1. Doctype:
A levél kell a doctype:
kódolás is lehetséges, de jobb, ha utf-8
2. A táblázat elrendezés:
Használjon táblázatos elrendezést.
Így lehetővé kell tenni, hogy egy egyszerű szerkezet táblázatokat. megpróbálják elkerülni kombinálásával sejtek (colspan. rowspan). Komplex táblázatok Outlook nem mindig jelennek meg megfelelően. Ezért jobb felhasználása a beágyazott táblázatok.
Minden írásban be kell csomagolni egy táblázat szélessége 100%, és a fehér háttér színe (bgcolor = „# ffffff”) (vagy a háttérszínt megfelelő design a levél)
És ne felejtsük el megadni align és valign sejtekben.
3. A szöveg és linkek:
Meg lehet változtatni a vagy . Ebben az esetben, ,
Amikor így a szöveg minden speciális karakterek helyébe a megfelelő kód:
Beszél a design a szöveg, gyakran szembesülnek azzal a problémával, lógó elöljárók. Hogy oldja meg, használjon nem törhető szóköz karakter:
És ne felejtsük el a kötőjel . ha hirtelen meg kell átadni a padlón. Ez különösen hasznos a nagyon hosszú linkeket, hogy tönkreteheti a mintát.
4. Képek:
Meg mindig figyelembe kell venni. hogy a felhasználó feltölt egy képet nem mindig olyan hézag levél kép nélkül is fontos. Mindig nézd meg, hogyan fog kinézni a levél kapcsolat nélküli üzemmód a képeket.
5. Háttér kép:
bgcolor = "# cccccc" background = "img / bg.png" style = "background-image: url (img / bg.png)"
És erőt Outlook megjelenítéséhez háttereket, szerkezete a következő:
6. Stílusok és CSS:
A fejléc nem adja stílusok Szinte minden webes felületek figyelmen kívül hagyni. Úgy kell felírni, mint inlaynovye a parametrestyle. Ez nem használható a rövid formában, mint például: border: 1px solid # 000000:
A helyes változat:
Igen, a szín is nem képes csökkenteni a (poszt #fff helytelen).
Horizontális és vertikális tér
Vagy a határon háttér színe.
7. kidolgozása levélsablonba
Összefoglalva, alkotunk levélsablonba: