Hvordan bruke CSS i en HTML-e-post
Bruk av inline styling i HTML e-poster er ganske vanlig. Flytte oppmerksomheten til mottakeren med en iøynefallende og estetisk tiltalende layout kan hjelpe skille meldingen fra de mange "spam" e-poster den gjennomsnittlige brukeren mottar. Men ved å bruke Cascading Style Sheets (CSS) i HTML e-poster er en notorisk frustrerende oppgave, som nesten alle populære e-postklient og nettleser gjengir inline styling annerledes. Overholdelse av noen viktige regler vil sikre kryss klient kompatibilitet i meldingen.
Bruksanvisning
1 Design din e-post i en tabell format i stedet for å bruke <div> tagger. De fleste web-baserte e-postklienter strippe <div> tagger ut av meldingen før rendering det.
2 Fjern eventuell tekst oppå et bilde som du har tenkt å være statisk kopi snarere enn en del av bildet. Mange e-postklienter støtter ikke bakgrunnsbilder i tabellceller.
3 Fjern alle stilelementer med unntak for de som brukes til å formatere utseendet på tekst og festet til <font> koder. Ikke bruk padding, for å marginene eller noe annet plassere tekst annet enn tomme tabellceller, som mange kunder ikke kjenner posisjonering stilelementer.
4 Fjern nestede tabeller eller rowspans og colspans i den samme tabellen. Noen e-postklienter tildele ekstra fører til kopi av en melding, hvilket betyr at bruken av disse vil resultere i en ødelagt grafisk utforming. Der det er mulig, bruke én rad, tabeller stablet oppå hverandre.
5 Sett en link i meldingen, slik at mottakeren kan vise en webversjon av meldingen. Dette vil tillate deg å ha en ren versjon som ser ut akkurat slik du vil ha det til, samt gi deg muligheten til å inkludere elementer du ikke kan inkludere i en e-post, for eksempel interaktive medier.
Hint
- Standardene for kompatibiliteten av CSS i HTML e-poster er i stadig endring med hver ny versjon av den populære e-postklienter. Denne listen er på ingen måte en garanti for at en melding vil se det samme til alle som ser det, men å følge disse reglene vil få deg det meste av veien der.