Die Auswahl der Schriftart trägt dazu bei, deine Markenidentität zu vermitteln und die Lesbarkeit deiner E-Mails zu verbessern. Mit Brevo kannst du zwischen einer Reihe von Schriftarten wählen, mit denen du ansprechende E-Mails erstellen kannst, die bei deinem Publikum Anklang finden und deine Markenbekanntheit steigern.

❓ Welche Schriftarten können für mein E-Mail-Design verwendet werden?

Bei der Gestaltung deiner E-Mail kannst du Folgendes verwenden:

Eine websichere Schriftart ist eine Schriftart, die wahrscheinlich auf der überwiegenden Mehrheit der Geräte der Benutzer:innen verfügbar ist. Sichere Schriftarten können als Fallback-Schriftarten verwendet werden, wenn die ursprünglich ausgewählten Schriftarten vom Gerät deiner Empfänger:ins nicht unterstützt werden. Indem du sichere Schriftarten als Fallback-Schriftarten wählst, kannst du das Risiko von Problemen bei der Darstellung von Schriftarten vermeiden und sicherstellen, dass deine E-Mails unabhängig von dem Gerät, auf dem sie gelesen werden, ihre Wirkung behalten.

Google Fonts ist eine Bibliothek mit kostenlosen Open-Source-Schriftarten, die von Google bereitgestellt werden und heruntergeladen werden können, um sie in deinen verschiedenen digitalen Projekten zu verwenden. Google Fonts werden von den folgenden E-Mail-Clients unterstützt:

Apple Mail
iOS Mail
Google Android

Samsung Mail (Android 8.0)
Outlook für Mac
Outlook App

Mit Brevo kannst du deine eigenen Schriftarten im E-Mail-Editor verwenden, um E-Mails mit deiner Markenidentität zu gestalten und so die Konsistenz und den Wiedererkennungswert deiner Marke über alle deine Kommunikationskanäle hinweg zu gewährleisten.

Um eine benutzerdefinierte Schriftart im Brevo-E-Mail-Editor zu verwenden, kannst du entweder:

🌐 Eine Schriftart von öffentlichen Websites verwenden

Suche und wähle eine Schriftart aus einer öffentlichen Website-Schriftarten-Bibliothek wie Google oder Adobe Fonts API. Sobald du eine Schriftart ausgewählt hast, kopiere den Link zur CSS-Datei der Schriftart. Dieser Link enthält die Stile und Variationen der Schriftart und sollte ähnlich sein wie dieser:

https://fonts.googleapis.com/css2?family=Your+Font+Name:ital,wght@0,100;1,200&display=swap
oder
https://use.typekit.net/xxxxxxx.css

💻 Verwende eine Schriftart aus einer CSS-Datei, die sich auf deinem eigenen Server befindet

❗️ Wichtig

Wenn du dich nicht sicher bist, wie die folgenden Schritte auszuführen sind, bitte deinen Webentwickler, dir den Link zu der CSS-Datei zu geben, die deine benutzerdefinierte Schriftart enthält, und stelle sicher, dass die Datei der @font-face Regel folgt.

Eine benutzerdefinierte Schriftart aus einer CSS-Datei benutzen:

Lade die Datei mit deiner benutzerdefinierten Schriftart in eines deiner Serververzeichnisse hoch. Benutzerdefinierte Schriftdateien sind in der Regel im Format .woff, .woff2, oder .tff .
Stelle sicher, dass sie über eine direkte URL wie https://yourserver.com/fonts/your-custom-font.woff2 erreichbar ist.

Erstelle eine CSS-Datei mit einer @font-face Regel und füge den Link zu deiner benutzerdefinierten Schriftartdatei von oben in url ein. Beispiel:

@font-face {
font-family: 'Your Custom Font'; 
src: url('https://yourserver.com/fonts/your-custom-font.woff2') format('woff2'); 
font-weight: normal; 
font-style: normal;
}

Lade die CSS-Datei in eines der Verzeichnisse deines Servers hoch.
Rufe anhand deiner Domäne und des Speicherorts der CSS-Datei die URL zu deiner CSS-Datei ab.
Wenn deine Domäne zum Beispiel thegreenyoga.com lautet, sich deine CSS-Datei im CSS-Verzeichnis befindet und die CSS-Datei thegreenyoga-font heißt, sollte die URL deiner CSS-Datei lauten: https://thegreenyoga.com/css/thegreenyoga-font.css

Sobald du den Link zu der CSS-Datei kopiert hast, die deine benutzerdefinierte Schriftart enthält, folge dem Prozess ➕ Add a custom font (Eine benutzerdefinierte Schriftart hinzufügen) unten. Der Link sollte das Format http:// haben.

💡 Gut zu wissen

Importierte Google-Schriftarten und benutzerdefinierte Schriftarten werden möglicherweise nicht von allen E-Mail-Clients, Browsern oder Systemen unterstützt. Wir empfehlen dir, Fallback-Schriftarten einzurichten, um nicht unterstützte Google-Schriftarten und benutzerdefinierte Schriftarten auf einigen Geräten zu ersetzen.

Erste Schritte

Du kannst deine Markenbibliothek so einrichten, dass jedes neue Template, das du auswählst, die Eigenschaften deiner Marke übernimmt, z. B. das Logo, die Farben, die Schriftarten und Social-Media-Links. Weitere Informationen findest du im entsprechenden Artikel Deine E-Mails mithilfe der Markenbibliothek automatisch mit deinen Marken-Assets gestalten.

🔤 Hinzufügen von Schriftarten zum E-Mail-Editor

Bei der Gestaltung deiner E-Mail werden sichere Schriftarten standardmäßig in den Dropdown-Listen für die Schriftauswahl angezeigt. Du kannst jedoch alle Schriftarten (Google-Schriftarten, sichere Schriftarten und benutzerdefinierte Schriftarten) hinzufügen und mischen. Du kannst auch Fallback-Schriftarten einrichten, die für deine Überschriften und Absätze verwendet werden, wenn die ursprünglich ausgewählten Schriftarten vom Gerät deiner Empfänger:innen nicht unterstützt werden.

So fügst du Schriftarten hinzu und richte sie ein:

Klicke im E-Mail-Editor in der linken Seitenleiste auf Style (Stil) und erweitere Text Appearance (Schriftbild).
In der Dropdown-Liste Paragraph (Absatz) und Headings (Überschriften) kannst du Safe fonts (Sichere Schriftarten) auswählen, die standardmäßig verfügbar sind. Du kannst aber auch Google-Schriftarten oder benutzerdefinierte Schriftarten hinzufügen, indem du auf + Add web fonts (+ Web-Schriftarten hinzufügen) ⬇️ klickst.
Du wirst auf die Seite Add fonts (Schriftarten hinzufügen) weitergeleitet. Du hast folgende Möglichkeiten:
🖱️ Google-Schriftarten auswählen
1. Klicke auf das Dropdown-Menü Font name (Name der Schriftart).
2. Wähle die gewünschte(n) Schriftart(en) aus der vorhandenen Liste aus oder gib einen Schriftartnamen ein, um in der Google-Schriftartenbibliothek danach zu suchen.
3. Optional: Füge Fallback-Schriftarten hinzu, falls deine benutzerdefinierten Schriftarten vom E-Mail-Client deiner Empfänger:innen nicht unterstützt werden. Wähle im Abschnitt Fallback font (Fallback-Schriftart) die Fallback-Schriftart(en) aus, die du für deine Überschriften und andere Texte verwenden möchtest.
4. Klicke auf Add selected fonts (Ausgewählte Schriftarten hinzufügen).
➕ Eine benutzerdefinierte Schriftart hinzufügen
1. Klicke auf der Seite Add web fonts (Webschriftarten hinzufügen) auf die Registerkarte Custom font (Benutzerdefinierte Schriftart) und dann auf + Add custom font (+ Benutzerdefinierte Schriftart hinzufügen).
2. Gib in das Feld Web font link (Web-Schriftarten-Link) die URL der Schriftart ein.Um mehr darüber zu erfahren, wie du die URL deiner Schriftart abrufen können, lies die Informationen auf der Registerkarte (Custom font) Benutzerdefinierte Schriftart in Welche Schriftarten können für mein E-Mail-Design verwendet werden?.
3. Wähle im Dropdown-Menü Font name (Name der Schriftart) den Namen aus, den du für deine Schriftart verwenden möchtest. Wir zeigen automatisch die Namen an, die in der CSS-Datei definiert sind, in der die Schriftart gespeichert ist.
4. Klicke auf Add to list (Zur Liste hinzufügen).
5. Wähle auf der Registerkarte Custom font (Benutzerdefinierte Schriftart) die benutzerdefinierte Schriftart aus, die du gerade hinzugefügt hast, um sie in deiner Liste der Schriftarten zu speichern.
Optional: Füge Fallback-Schriftarten hinzu, falls deine benutzerdefinierten Schriftarten vom E-Mail-Client deiner Empfänger:innen nicht unterstützt werden. Wähle im Abschnitt Fallback font (Fallback-Schriftart) die Fallback-Schriftart(en) aus, die du für deine Überschriften und andere Texte verwenden möchtest.
Klicke auf Add selected fonts (Ausgewählte Schriftarten hinzufügen).

🎉 Du kannst jetzt die Schriftart(en), die du hinzugefügt hast, aus allen Dropdown-Listen zur Auswahl von Schriftarten im E-Mail-Editor auswählen und auf jeden Text in deiner E-Mail anwenden.

✍️ Bearbeiten oder Löschen einer Schriftart

So bearbeitest du die hinzugefügten Schriftarten:

Klicke im E-Mail-Editor in der linken Seitenleiste auf Style (Stil) und erweitere Text Appearance (Schriftbild).
Scrolle in den Einstellungen für Text Appearance (Schriftbild) nach unten und klicke auf + Add web fonts (+ Web-Schriftarten hinzufügen).
Du wirst auf die Seite Add fonts (Schriftarten hinzufügen) weitergeleitet. Von dort aus kannst du deine Schriftarten bearbeiten oder löschen:
Google-Schriftart Benutzerdefinierte Schriftart Fallback-Schriftarten

Deaktiviere die Google-Schriftarten, die du nicht mehr in deinen Dropdown-Listen für die Schriftauswahl haben möchtest.
- Deaktiviere die benutzerdefinierten Schriftarten, die du nicht mehr in deinen Dropdown-Listen für die Schriftauswahl haben möchtest.
- Klicke auf das Symbol für Bearbeiten, um den Link oder den Namen deiner benutzerdefinierten Schriftart zu bearbeiten.
- Klicke auf das Papierkorbsymbol, um die benutzerdefinierte Schriftart dauerhaft aus dem E-Mail-Editor zu löschen.
Wähle aus den Dropdown-Listen eine andere Schriftart aus, um die ursprünglich ausgewählte Fallback-Schriftart zu ersetzen.
Klicke auf Add selected fonts (Ausgewählte Schriftarten hinzufügen).

⏭ Nächste Schritte

🤔 Sie haben eine Frage?

Wenden Sie sich bei Fragen an unser Support-Team: Erstellen Sie einfach ein Ticket über Ihr Konto. Wenn Sie noch kein Konto haben, können Sie uns hier kontaktieren.

Wenn Sie Unterstützung bei einem Projekt mit Brevo suchen, können wir Sie mit dem richtigen zertifizierten Brevo-Expertenpartner zusammenbringen.

Füge Google-Schriftarten, benutzerdefinierte Schriftarten und Fallback-Schriftarten zu deinem E-Mail-Design hinzu