Förstå teckensnitt i e-post

Du kommer att lära dig 

Lär dig mer om möjligheterna och begränsningarna med att använda typsnitt online och hur du skickar e-post som passar ditt varumärke. 

Hur typsnitt fungerar

Teckensnitt är representationer av text och kan användas i tryckt form eller online media. Du kanske känner till några av de vanligaste teckensnitten, som Arial eller Times New Roman, men det finns tusentals andra teckensnitt som du kan använda för att kommunicera och representera ditt varumärke. 

Med online media (som webbplatser eller e-post) är alternativen för teckensnitt nästan obegränsade. Men när du delar din skapelse med någon annan kanske den inte ser exakt likadan ut, eftersom alla enheter inte har tillgång till samma teckensnitt. 

Det finns två huvudsakliga sätt för en enhet att komma åt och använda ett teckensnitt: systemteckensnitt (dvs. teckensnitt som finns i butiken på den enhet du använder) och webbteckensnitt (dvs. teckensnitt som laddas från en extern server)

Om systemteckensnitt

Datorer och telefoner levereras förinstallerade med en mängd olika teckensnitt. Det finns några vanliga installerade teckensnitt (de flesta enheter levereras med Georgia och Verdana, till exempel), men enheter kan variera mycket i vad de inkluderar som standard. Teckensnitt som används av de flesta enheter kallas "webbsäkra" teckensnitt. 

Om webbteckensnitt

Till skillnad från webbsäkra teckensnitt laddas webbtypsnitt från en extern server samtidigt som det innehåll du tittar på. Anpassade teckensnitt är i allmänhet webbteckensnitt. Om du använder ett webbtypsnitt vill du också ange ett webbsäkert reservtypsnitt, om en viss enhet inte kan ladda ditt webbtypsnitt. 

Om reservteckensnitt

När du tittar på något online, oavsett om det är en webbsida eller ett e-postmeddelande, finns det CSS (kod som används för att formatera innehåll online) bakom kulisserna som talar om för din enhet vilket teckensnitt som ska visas. Om enheten inte kan komma åt teckensnittet kontrolleras CSS efter ett "reservteckensnitt" (ett eller flera teckensnitt som valts ut av den person som skapat webbplatsen eller e-postmeddelandet och som ska användas om det föredragna teckensnittet inte är tillgängligt). Reservteckensnitt bör vara webbsäkra teckensnitt som de flesta enheter kan använda. De ger dig mer kontroll över hur ditt meddelande visas när någon tittar på det på en enhet som inte har support anpassade/webbteckensnitt. 

Om det inte finns något reservteckensnitt tillgängligt, eller om reservteckensnittet inte stöds av den enhet som används, kommer enheten att använda ett standardteckensnitt, som Arial eller Times New Roman. Standardteckensnitt varierar mycket mellan olika enheter och appar. 

Hur typsnitt fungerar i e-post

Vissa e-postkunder support webbtypsnitt, men andra gör det inte. När någon öppnar din e-post i en inkorg eller enhet som inte har support webbtypsnitt, kommer de att se att ett standardtypsnitt används istället. Du kan styra vilka systemteckensnitt som ska användas som säkerhetskopior genom att ange ett reservteckensnitt.

Om någon öppnar ditt e-postmeddelande på en enhet som stöder webbteckensnitt laddas teckensnittet från den URL som anges i e-postmeddelandets CSS. Om enheten kan komma åt teckensnittet visas det, annars går den vidare till reservteckensnitten. 

Följande e-postklienter support webbtypsnitt (anpassade): 

• Apple Mail
• iOS Mail (standardwebbläsaren för e-post på iOS)
• Google Android (utom Android 2.3, som inte support @import-metoden som används av Google- och Adobe-teckensnitt)
• Samsung Mail (Android 8.0)
• Outlook för Mac

Observera att Gmail, som är en av de största e-postklienterna, i allmänhet inte använder support webbtypsnitt. Det finns dock ett undantag: Gmail gör support Roboto. 

Optimera teckensnitt i din e-post

Det bästa sättet att se till att din e-post ser konsekvent ut på alla enheter är att använda ett webbsäkert typsnitt. Klaviyostandardteckensnitt är i allmänhet webbsäkra. Hitta de teckensnitt som Klaviyo tillhandahåller i: 

• Innehåll > Bilder & Varumärke > Varumärkestillgångar
• Fliken Stilar i din e-post
• Stilavsnittet i ett e-postblock som innehåller text 
• Fliken Stilar i redigeraren för registreringsformulär 

Tips för användning av anpassade teckensnitt

Om du föredrar att använda ett anpassat typsnitt kan du använda tipsen nedan för att se till att din e-post ser bra ut på alla enheter. 

Använd reservteckensnitt

Välj ett webbsäkert reservtypsnitt som matchar ditt anpassade typsnitt så nära som möjligt. Du kan välja ett reservteckensnitt bland Klaviyo:s standardteckensnitt när du konfigurerar det anpassade teckensnittet.

Använd text i bilder

Även om en e-post med enbart bilder kan skada din leveransbarhet kan du strategiskt använda en kombination av text i bilder och text i textblock för att skapa en e-post som överensstämmer med ditt varumärke. Välj ett anpassat typsnitt för dina rubriker och uppmaningar (CTA) och kombinera det med ett webbsäkert typsnitt för brödtexten. 

Använd bilder som innehåller ditt varumärkesspecifika typsnitt för markerad text och se till att lägga till alt-text när du lägger till bilderna i din e-post. Använd sedan det webbsäkra teckensnittet på resten av texten i din e-post. Resultatet blir en varumärkesanpassad e-post som matchar din webbplats, samtidigt som den är tillgänglig för dina prenumeranters inkorgar. 

Testa noggrant

Oavsett vilken metod du väljer bör du testa din e-post noggrant, särskilt när du använder en ny design. Skicka e-posten till dig själv på flera enheter för att se till att du är nöjd med hur den visas på varje enhet. Du kan också använda e-posttestprogram som Litmus eller e-post on Acid för att testa med ett bredare utbud av enheter. 

Ytterligare resurser

• Hur lägger jag till egna teckensnitt i e-postmallar?
• Bästa praxis för att skapa tillgängliga e-postmeddelanden och formulär
• Så här ändrar du dina standardvarumärkesstilar i Klaviyo