Designtips vid mallar

Att få till det där snygga och perfekta utskicket är i grunden en enkel sak men på grund av varierande CSS-stöd i olika mailklienter kan det vara bra att vara medveten om en del detaljer. När vi skapar upp mallen åt er, så er vi till att den är responsiv och fungerar bra i alla enheter (desktop, mobil, padda etc). För att få ditt utskick att fungera bra i så många mailklienter och enheter som möjligt hänvisar vi er till punkterna nedan:

  • Om du vill ha en skräddarsydd mall från oss är det bra om vi får underlaget som ett Figma projekt. Det gör att vi kan få ut typsnitt, storlekar och marginaler direkt från underlagen. Eller om ni vill utgå från vår Photoshop mall.
  • När vi får in underlaget från dig, kommer vi vid detta läge informera om eventuella tekniska restriktioner.
  • Vi kommer sedan kommunicera eventuella korrigeringar som du som kund behöver göra i underlaget.
  • Maxbredden på ditt email bör inte överstiga 660 pixlar. Då fungerar det bra i alla mailklienter.
  • För att bilder ska se bra ut i mindre enheter är det bra om de har en maxbredd på 640 pixlar.
  • Endast vanliga webbtypsnitt som Times New Roman, Arial och Verdana stöds i text. Det går att använda exempelvis Google Fonts men stödet är inte 100%. Läs mer om webbsäkra typsnitt.
  • Eftersom mallarna görs i tabeller är det bra att utgå från ett rutnät/grid, där varje block passar oberoende av blocket ovan eller under.
  • De flesta mailklienter är inte kompatibla med bakgrundsbilder så använd bakgrundsfärger istället.
  • Stödet för video i email är litet och risken att ditt utskick klassas som spam ökar om det innehåller Flash och/eller JavaScript. Använd istället en animerad gif-bild eller länka en bild på videospelaren till videon. För ett utförligt exempel, se vårt blogginlägg om video i nyhetsbrev
  • Tänk på att CSS3 och HTML5-delar som till exempel border-radius, box-shadow eller @font face inte har något större stöd.
  • De flesta mailklienter blockerar automatiskt bilder och ersätter dem med en tom ruta. Så när du laddar upp bilder till ditt utskick, glöm inte att sätta en alt-text på bilden så den eventuellt tomma rutan får en beskrivande text.
  • Text & bilder som ligger över en annan bild fungerar inte.
  • Det finns även möjlighet att ha darkmode i sin mall, detta är ett extra tillägg i mallen. 
  • Låt inte dina prenumeranter behöva ladda in stora email. Tänk därför på storleken på bilder. Några 100kb per bild funkar fint.Vid frågor om mallar och restriktioner kontakta oss på support@rule.se
  • Designmaterialet skickas till support@rule.se eller laddas upp direkt i appen.

Behöver du mer hjälp? Kontakta oss Kontakta oss