Arbeidet med layout i et nyhetsbrev er mye mer begrenset enn når man setter opp en vanlig webside. Nyhetsbrev bør holdes så enkelt som mulig, og ikke ha som mål å duplisere vanlige nettsteder i form av funksjonalitet og design.

Epostklienter er rett og slett ikke like utviklet som nettlesere, og de har begrenset støtte for avansert HTML og CSS. I tillegg rendrer de også veldig forskjellig, slik at noe som fungerer i en klient fungerer ikke nødvendigvis i en annen. Derfor er det alltid viktig å teste malene grundig. Isave AS tester malene gjennom Email On Acid.

Det er også blitt svært viktig å tilpasse designet til alle typer plattformer. (PC-skjermer i forskjellige størrelser, nettbrett, mobil osv). Det er dette vi kaller for responsivt design.

Du finner vår e-postklient test (Email on Acid) over forhåndsvisningen av nyhetsbrevet. Dette vil åpne seg i et nytt vindu.

Hvordan bør nyhetsbrevet se ut?
Epostutsendelser må være enkle og lette å forstå. En konsentrert utgave av teksten som du ønsker å spre. Bruk heller landingssider koblet fra nyhetsbrevet dersom det er mye tekst som skal formidles.

Toppbanner
Toppbanneren er ofte det første som møter deg når man åpner nyhetsbrev. Med design tilpasset mobil er det viktig at dette ikke blir for mye fjas. Det er viktig at budskapet i eposten kommer frem i første skjermbilde også på mobilen og dersom toppbanneren tar for mye plass vil dette bli skjøvet ned. Lag en toppbanner som er konkret og tydelig.

Overskrift
Under toppbanner bør det komme en tydelig overskrift som forteller hva nyhetsbrevet inneholder. Overskriften må altså være beskrivende og konkret.

Spalter
Det er å anbefale en spalte i nyhetsbrev fordi man da styrer leseren til å lese sakene i prioritert rekkefølge. Ved mindre nyttige nyheter kan man vurdere 2-spalter.

Footer
Det er lovpålagt etter markedsføringsloven å ha avmeldingslenke i alle utsendelser. Dette legges ofte i footeren. Les mer om lover for epost og SMS markedsføring.

Bilder i nyhetsbrev
Ikke alle epostklienter laster ned bilder automatisk. Dette betyr at bruker selv må klikke på ”last ned bilder”. Det er derfor viktig at nyhetsbrevet ser noenlunde bra ut og er leselig selv om bilder ikke vises. Dette betyr for eksempel at det er veldig dumt å putte viktig informasjon på bilder.

Tekst i nyhetsbrev
1. Fontstørrelsen i et nyhetsbrev bør ikke være på under 10 px, helst 12 px.
2. Bruk websikre fonter. Dette er fonter som epostklientene støtter. De websikre fontene er: Arial, Trebuchet, verdana, Comic Sans MS, Courier, New Georgia, Impact og Times new roman. Dersom man absolutt vil bruke andre fonter er det mulig å legge de inn som bilder (men pass på at bilder ikke alltid vises), eller man kan importere fonten og bruke en websikker font som støttefont for de klientene hvor den andre fonten ikke fungerer. Merk at dette er i de fleste klienter.
3. Bare bruk farge og understreking på lenker i brødtekst. Tekst med understreking vil ofte bli feiloppfattet som lenker.
4. Ikke legg viktig tekst i bilder.
5. Tekstlinjer bør ikke være mer enn ca 55 tegn i bredden.

Mobiltilpasset design
Over 50 % av dagens epost blir åpnet på mobil eller nettbrett. Det er ikke lenger noen unnskyldninger for å ikke lage design som er tilpasset for alle plattformer. Dette er litt mer komplisert, men dersom man lurer seg unna, lurer man bare seg selv ved at designet ikke er brukervennlig og brukere vil la være å lese eposten.

Dette er viktig å tenke på ved mobiltilpasset design:

1. Si det viktigste først
Det er ikke så god plass og det er viktig at budskapet kommer frem i første skjembilde. Prøv å plassere viktig call-to-action element i første skjermbilde.

2. Juster teksten spesielt for mobil
Det anbefales å ha en tekststørrelse på hvertfall 13 px på mobil.

3. Knapper bør være minst 44×44 px
For at knapper skal være enkle å trykke på bør de være minst 44×44 px som er ca like stort som en tommel.

4. Ha konkret innhold
Når det er lite plass må man være nøye med innholdet. Skjul det som er unødvendig og gå nøye gjennom teksten for å passe på at det er relevant og konkret nok. For mye tekst vil føre til at brukere ikke orker å lese.

5. Keep it simple
Mobilvisningen av en epost bør aldri være noe annet enn 1-spalte. Ellers vil tekst og bilder bli veldig smått og vanskelig å se. Det blir heller ikke særlig pent, men rotete. Brukerne er vandt til 1-spalte på mobil og det er dette som er mest brukervennlig og forståelig.

Disse elementene skaper ofte trøbbel i nyhetsbrev
1. Bakgrunnsbilder
2. Bilder og tekst som overlapper
3. Grafikk som brukes til å bygge en ramme rundt en boks
4. Flash
5. Skjemaer
6. Mer enn to kolonner ved siden av hverandre
7. Nyhetsbrev med bredde større enn 640px

Koding av design i nyhetsbrev
For å sikre maksimal kompabilitet med e-postklienter er det nødvendig å bygge opp malen med HTML-tabeller.

CSS må brukes med forsiktighet. CSS legges inline og/eller lokalt i-taggen. Her er en liste over hva som fungerer og ikke av CSS i de ulike e-postklientene.

Trenger du hjelp med ditt e-postdesign, ta kontakt med oss i Isave AS, så hjelper vi deg gjerne! Vi tilbyr ferdige generiske maler eller vi kan hjelpe til med å lage egne tilpassede maler for din bedrift.

Relaterte lenker:
Bilder i responsive maler
Legge inn eDM mal
Hva sier loven om epost og SMS markedsføring