Grundlegendes zu Schriftarten in E-Mails

Übersicht

Erfahre mehr über die Möglichkeiten und Einschränkungen der Verwendung von Schriftarten online und darüber, wie du E-Mails sendest, die zu deiner Marke passen.

So funktionieren Schriftarten

Schriftarten sind Darstellungen von Text und können in Print- oder Online-Medien verwendet werden. Vielleicht kennst du einige der gängigeren Schriftarten wie Arial oder Times New Roman, aber es gibt Tausende anderer Schriftarten, die du nutzen kannst, um deine Marke zu kommunizieren und zu repräsentieren.

Bei Online-Medien (z. B. Websites oder E-Mails) sind deine Schriftartoptionen nahezu unbegrenzt. Wenn du deine Kreation jedoch mit jemand anderem teilst, sieht sie möglicherweise nicht genau gleich aus, da nicht alle Geräte Zugriff auf dieselben Schriftarten haben.

Es gibt zwei grundlegende Möglichkeiten, wie ein Gerät auf eine Schriftart zugreifen und sie verwenden kann: Systemschriftarten (d. h. Schriftarten, die auf dem Gerät gespeichert sind, das du verwendest) und Webschriftarten (d. h. Schriftarten, die von einem externen Server geladen werden)

Über Systemschriftarten

Computer und Smartphones sind mit einer Vielzahl von Schriftarten vorinstalliert. Es gibt einige häufig installierte Schriftarten (die meisten Geräte haben zum Beispiel Georgia und Verdana), aber Geräte können sich stark darin unterscheiden, was sie standardmäßig enthalten. Schriftarten, die von den meisten Geräten verwendet werden, werden „websichere“ Schriftarten genannt.

Über Webfonts

Im Gegensatz zu web-sicheren Schriftarten werden Webfonts gleichzeitig mit den Inhalten, die du dir ansiehst, von einem externen Server geladen. Benutzerdefinierte Schriftarten sind in der Regel Webfonts. Wenn du eine Webschriftart verwendest, solltest du auch eine web-sichere Fallback-Schriftart festlegen, falls ein bestimmtes Gerät deine Webschriftart nicht laden kann.

Über Fallback-Schriftarten

Wenn du online etwas ansiehst, egal ob eine Webseite oder eine E-Mail, gibt es im Hintergrund CSS (Code, der zum Gestalten von Online-Inhalten verwendet wird), das deinem Gerät mitteilt, welche Schriftart angezeigt werden soll. Wenn dein Gerät nicht auf die Schriftart zugreifen kann, prüft es das CSS auf eine „Ersatzschriftart“ (eine Schriftart oder mehrere Schriftarten, die von der Person ausgewählt wurden, die die Webseite oder E-Mail-Nachricht erstellt hat, damit sie verwendet werden, falls die bevorzugte Schriftart nicht verfügbar war). Ersatzschriftarten sollten websichere Schriftarten sein, die die meisten Geräte verwenden können. Sie geben dir mehr Kontrolle darüber, wie deine Nachricht angezeigt wird, wenn jemand sie auf einem Gerät ansieht, das keine benutzerdefinierten/Web-Schriftarten unterstützt.

Wenn keine Ausweichschriftart verfügbar ist oder wenn die Ausweichschriftart vom verwendeten Gerät nicht unterstützt wird, verwendet das Gerät eine Standardschriftart wie Arial oder Times New Roman. Standardschriftarten variieren je nach Gerät und App stark.

So funktionieren Schriftarten in E-Mails

Manche E-Mail-Clients unterstützen Webfonts, andere jedoch nicht. Wenn jemand deine E-Mail in einem Posteingang oder auf einem Gerät öffnet, das keine Webfonts unterstützt, wird stattdessen eine Standardschriftart angezeigt. Du kannst steuern, welche Systemschriftarten als Backups verwendet werden, indem du eine Fallback-Schriftart festlegst.

Wenn jemand deine E-Mail auf einem Gerät öffnet, das Webfonts unterstützt, wird die Schriftart über die in der CSS deiner E-Mail angegebene URL geladen. Wenn das Gerät auf die Schriftart zugreifen kann, wird es sie anzeigen; andernfalls wechselt es zu den Fallback-Schriftarten.

Die folgenden E-Mail-Clients unterstützen Web-(benutzerdefinierte) Schriftarten:

• Apple Mail
• iOS Mail (der Standard-E-Mail-Browser auf iOS)
• Google Android (außer Android 2.3, das die @import -Methode, die von Google und Adobe Fonts verwendet wird, nicht unterstützt)
• Samsung Mail (Android 8.0)
• Outlook für Mac

Beachte, dass Gmail, einer der größten E-Mail-Clients, Webfonts in der Regel nicht unterstützt. Es gibt jedoch eine Ausnahme: Gmail unterstützt Roboto.

Schriftarten in deinen E-Mails optimieren

Die beste Möglichkeit, um sicherzustellen, dass deine E-Mail auf allen Geräten einheitlich aussieht, ist die Verwendung einer Websafe-Schriftart. Klaviyos Standardschriftarten sind in der Regel web-sicher. Du findest die Schriftarten, die Klaviyo bereitstellt, unter:

• Inhalt > Bilder und Marke > Markenwerte
• Der Tab Styles deiner E-Mails
• Der Abschnitt Styles aller E-Mail-Blöcke, die Text enthalten
• Der Tab Styles im Editor für Anmeldeformular

Tipps zur Verwendung benutzerdefinierter Schriftarten

Wenn du lieber eine benutzerdefinierte Schriftart verwenden möchtest, nutze die folgenden Tipps, um sicherzustellen, dass deine E-Mails auf allen Geräten gut gestaltet aussehen.

Fallback-Schriftarten verwenden

Wähle eine web-sichere Fallback-Schriftart aus, die so gut wie möglich zu deiner benutzerdefinierten Schriftart passt. Du kannst beim Konfigurieren der benutzerdefinierten Schriftart eine Fallback-Schriftart aus Klaviyos Standardschriftarten auswählen.

Text in Bildern verwenden

Auch wenn eine E-Mail, die nur aus Bildern besteht, deiner Zustellbarkeit schaden kann, kannst du strategisch eine Kombination aus Text in Bildern und Text in Textblöcken verwenden, um eine E-Mail zu erstellen, die zu deiner Marke passt. Wähle eine benutzerdefinierte, markenspezifische Schriftart für deine Überschriften und Call-to-Actions (CTAs) und kombiniere sie mit einer web-sicheren Schriftart für deinen Fließtext.

Verwende Bilder, die deine Markenschriftart für ausgewählten Text enthalten, und achte darauf, Alt-Text hinzuzufügen, wenn du die Bilder zu deiner E-Mail hinzufügst. Wende dann die websafe Schriftart auf den restlichen Text in deiner E-Mail an. Das Ergebnis ist eine markenkonforme E-Mail, die zu deiner Website passt und gleichzeitig für die Posteingänge deiner Abonnent*innen barrierefrei ist.

Teste gründlich

Unabhängig davon, welche Methoden du auswählst, teste deine E-Mails gründlich, besonders wenn du ein neues Design verwendest. Sende die E-Mail an dich selbst auf mehreren Geräten, um sicherzustellen, dass du mit der Darstellung auf jedem Gerät zufrieden bist. Du kannst auch E-Mail-Testprogramme wie Litmus oder Email on Acid verwenden, um mit einer größeren Bandbreite an Geräten zu testen.

Weitere Ressourcen