Häufige Fehler bei der Verwendung von HTML

Wenn du lieber deine eigene HTML-E-Mail-Vorlage erstellen möchtest, anstatt eine unserer vordefinierten Vorlagenoptionen zu verwenden, musst du bei der Erstellung deiner Inhalte ein paar Punkte beachten.

In diesem Artikel erklären wir einige häufige Fehler bei der Verwendung von HTML-Codes und wie du sie vermeidest.

Bilder, Links und Grafiken

Deine HTML-E-Mail ist eine einzige große Grafik

Die meisten E-Mail-Programme blockieren standardmäßig das automatische Herunterladen von Bildern, was dazu führen kann, dass deine Empfänger deine E-Mail löschen oder sie sogar als Spam markieren. Als allgemeine Richtlinie empfehlen wir ein Verhältnis von 80 Prozent Text zu 20 Prozent Bildern in einer E-Mail. Allerdings verwendet jeder Spam-Filter andere Maßstäbe für ein ausgewogenes Verhältnis von Grafiken und Text.

Wenn ein Großteil deines E-Mail-Inhalts in einer einzigen Grafik enthalten ist, solltest du Text zur Fußzeile hinzufügen, z. B. deinen Link zum Abbestellen, deine physische Adresse und die Berechtigungserinnerung. So kannst du das Verhältnis von Text zu Bild ausgleichen.

Auf einem lokalen oder privaten Server gehostete Bilder

Wenn du auf einem Staging-Server oder Netzwerklaufwerk arbeitest, hat die allgemeine Öffentlichkeit keinen Zugriff auf diese Server und die Bilder werden als fehlerhaft angezeigt.

Damit deine Bilder korrekt in deiner E-Mail dargestellt werden, musst du sie alle auf einen öffentlichen Server hochladen und dort hosten. Alternativ kannst du das Content-Studio verwenden, um Bilder hochzuladen und sie in Mailchimp zu hosten.

Bilder und Hyperlinks verwenden keine absoluten Pfade

Absolute Pfade für Bilder und Dateien enthalten neben dem Dateinamen auch deine Serverinformationen, damit externe Anwendungen die Datei finden und darauf zugreifen können. Hoste deine Bilder immer auf deinem Server und benutze absolute Pfade, die zurück zu deinem Server verweisen.

Anstatt also ein Bild wie dieses zu programmieren:

<img src="/images/photo.gif">

solltest du es so programmieren:

<img src="http://www.mysite.com/email/images/photo.gif ">

Das gleiche gilt für Hyperlinks. Anstelle eines solchen Links:

<a href="index.html" shape="rect">Cliquez ici</a>

programmierst du den Link wie folgt:

<a href="http://www.mysite.com/index.html" shape="rect">Cliquez ici</a>

Wenn du deine E-Mails lokal mit einem WYSIWYG-Editor programmierst, solltest du sicherstellen, dass alle <img/>-Tags absolute Pfade verwenden. Es ist empfehlenswert, zu Beginn deines Projekts alle Grafiken deiner E-Mail auf deinen Server hochzuladen, damit du von Anfang an absolute Pfade hast.

Vorschau und Test

Kampagne wurde nicht vollständig getestet

Bevor du deine E-Mail sendest, solltest du sie gründlich testen. Wir empfehlen, Test-E-Mails an alle gängigen E-Mail-Anbieter wie Yahoo, Hotmail und Gmail zu schicken. Wenn du weißt, dass deine Kontakte andere E-Mail-Anbieter verwenden, solltest du diese ebenfalls in deinen Test mit einbeziehen. Verwende unser Tool Inbox Preview, um eine Vorschau deiner E-Mail zu erstellen. Diese zeigt dir, wie deine E-Mail in verschiedenen E-Mail-Clients dargestellt wird. Alternativ kannst du dir auch unsere Tipps zum Testen von Kampagnen durchlesen.

Von einem Webdesigner erstellte E-Mails wurden nicht getestet

Wenn eine andere Person deine E-Mail erstellt hat und du den Code einfügst, den diese Person dir gegeben hat, solltest du dir selbst trotzdem immer noch einmal eine Test-E-Mail schicken. So ist sichergestellt, dass am Ende alles so aussieht, wie es soll. Achte darauf, dass die E-Mail nicht zu breit ist und zum Vorschaufenster der gängigen E-Mail-Programme passt. Teste die Bilder und Links, um sicherzustellen, dass sie wie gewünscht funktionieren und als absolute Pfade eingerichtet sind.

Code und Software

Microsoft FrontPage, Word oder Publisher wurde zur Erstellung von HTML-Inhalten verwendet

Bei der Verwendung von Word, Publisher oder FrontPage zur Generierung von HTML-Inhalten wird möglicherweise zusätzlicher Code zu deiner E-Mail hinzugefügt. Dadurch kann es passieren, dass dein Design nicht ordnungsgemäß dargestellt oder deine E-Mail als Spam gefiltert wird. Verwende stattdessen einen einfachen Texteditor, um anschließend die Vorlage in Mailchimp zu importieren oder den Code in Mailchimp einzufügen.

JavaScript in HTML-E-Mails

In den meisten E-Mail-Programmen wird JavaScript aus Sicherheitsgründen blockiert. Achte darauf, dass dein Code kein JavaScript enthält (z. B. auf Schaltflächen zum Absenden von Formularen, in Links zu Pop-up-Fenstern oder in Programmen zum Vorladen von Bildern und Widgets). Wenn du HTML von einer vorhandenen Webseite kopierst, entferne sämtliches JavaScript aus dem Code. Unsere Campaign Builder entfernt sämtlichen JavaScript-Code, den wir erkennen können. Wir empfehlen jedoch dringend, deine Kampagne vor dem Senden sorgfältig zu testen, um sicherzustellen, dass sie richtig dargestellt wird.

Falsche Verwendung von CSS

Die meisten E-Mail-Programme entfernen HEAD- und BODY-Tags aus eingehenden E-Mails, um zu verhindern, dass eingebetteter CSS-Code die Seiten-CSS beeinträchtigt. Wir empfehlen dir, entweder Inline-CSS zu verwenden oder deinen CSS-Code direkt vor deinen Inhalten nach dem <BODY>-Tag einzubetten.

Compliance

Verwendung von Spam-Inhalten

Die meisten von uns erhalten Spam. Oft sind in Spam-Nachrichten Betreffzeilen komplett groß geschrieben, Buchstaben knallrot oder hellblau hervorgehoben oder es werden viele Ausrufezeichen verwendet und die Nachrichten wimmeln nur so von Phrasen wie „das Beste“, „Top“ oder „jetzt klicken“.

Achte darauf, dass deine Betreffzeilen kurz und aussagekräftig sind, halte deine Inhalte relevant, versuche, auf typische Werbeschlagworte zu verzichten, und vermeide auf jeden Fall Spam-Begriffe.

Kein Link zum Abbestellen

Alle über Mailchimp gesendeten Marketing-E-Mails müssen unseren *|UNSUB|* Tag enthalten. Es kann absolut keine Ausnahme von dieser Regel gemacht werden. Das Tag muss sowohl in HTML-E-Mails als auch in Plain-Text-E-Mails vorhanden sein.

Keine Berechtigungserinnerung

In allen unseren integrierten Vorlagen wirst du automatisch aufgefordert, eine Berechtigungserinnerung zu erstellen. Wenn du jedoch eine eigene Vorlage erstellst, musst du solch eine Berechtigungserinnerung zum Vorlagencode hinzufügen. Berechtigungserinnerungen teilen deinen abonnierten Kontakten kurz mit, wie sie sich für deine Marketing-Mitteilungen angemeldet haben, z. B. „Du erhältst diese E-Mail, weil du dich auf www.beispiel.de für unseren Newsletter angemeldet hast“. Berechtigungserinnerungen verhindern unzutreffende Missbrauchsbeschwerden, die dazu führen können, dass die Domain deines Unternehmens auf die Verweigerungsliste (manchmal auch als „Blacklist“ bezeichnet) gesetzt wird.

Keine Postanschrift

Gemäß dem US-amerikanischen CAN-SPAM-Gesetz müssen alle unsere Benutzer in allen über unsere Server gesendeten E-Mails eine gültige physische Postanschrift angeben. Die Anschrift wird automatisch eingefügt, wenn du unsere integrierten HTML-E-Mail-Vorlagen verwendest. Wenn du allerdings deine eigenen Vorlagen erstellst, musst du manuell eine physische Postanschrift hinzufügen.