HTML, oder Hypertext Markup Language, ist der Code, der verwendet wird, um die Grundstruktur einer Website zu erstellen. So wie du mit HTML das Erscheinungsbild einer Website vollständig anpassen kannst, hast du mit HTML-E-Mails mehr Kontrolle über die Struktur deiner E-Mails. Du kannst die Schriftart ändern, das Layout deiner E-Mails anpassen und sogar Grafiken und Buttons mit dem richtigen HTML-E-Mail-Format verwenden.
Eine Kurzanleitung zum Erstellen von HTML‑E‑Mails
HTML wird häufig als ein abschreckender Aspekt des E‑Mail‑Marketings aufgefasst. Das muss aber nicht so sein. Erfahre, wie du deine HTML‑Kenntnisse verfeinern kannst, um deine Marketing‑E‑Mails zu optimieren.
Das einzige Problem ist, dass das Schreiben von HTML-E-Mails nicht so einfach ist, wie es klingt. HTML-E-Mail-Vorlagen können hilfreich sein, man muss jedoch sicherstellen, dass deine E-Mails auf unterschiedliche Auflösungen reagieren und mit verschiedenen E-Mail-Clients funktionieren. Außerdem willst du die Leser nicht mit langen Ladezeiten abschrecken. Wenn du deine E-Mails mit HTML überarbeiten möchtest, findest du hier eine Kurzanleitung zu HTML für E-Mails.
Wie man HTML-E-Mails verfasst
Du fragst dich vielleicht, wie man eine HTML-E-Mail erstellt? Die Lektüre einiger Anleitungen zu den HTML-Grundlagen kann helfen, aber das Schreiben von HTML-E-Mails unterscheidet sich ein wenig von der Verwendung von HTML zur Erstellung einer Website. Das Erste, was du tun musst, wenn du eine HTML-E-Mail schreibst, ist den DOCTYPE festzulegen, der die HTML- und CSS-Regeln festlegt, die beim Lesen von HTML befolgt werden. Einige E-Mail-Clients überschreiben jedoch das DOCTYPE und verwenden ihre eigenen Regeln für HTML.
Als nächstes kommt der Abschnitt <head>, in dem du deinen Titel und andere wichtige Informationen zu deiner E-Mail eingibst. Zumindest sollte dein Head-Tag einen <title>-Tag enthalten, der mit einem </title>-Tag abgeschlossen werden sollte. Du kannst auch ein Meta-Tag verwenden, um Metadaten im Abschnitt <head> zu definieren. Sobald du mit diesem Abschnitt fertig bist, sollte er mit </head> geschlossen werden.
Beachte, dass bestimmte Tags und Elemente möglicherweise nicht mit bestimmten E-Mail-Providern funktionieren. Mehrere E-Mail-Anbieter gestatten die Verwendung des <style> -Tags im Kopf einer E-Mail nicht, während Gmail das <style> -Tag im Textkörper einer E-Mail nicht zulässt. Es ist auch wichtig, einen E-Mail-Marketing-Leitfaden für Best Practices zu befolgen, denn wenn du das Layout einer E-Mail änderst, bedeutet das nicht, dass der Inhalt gut ist.
Nur-Text vs. HTML
Du hast vielleicht schon viel über reine Text-E-Mails im Vergleich zu HTML-E-Mails gehört, aber was ist der eigentliche Unterschied?
Plain-Text-E-Mails sind die einfachste Art von E-Mails, die du versenden kannst, weil sie nur einfachen Text enthalten. Diese E-Mails enthalten keine Bilder, Videos oder Schaltflächen. Der gesamte Text in einer reinen Text-E-Mail sieht in der Regel immer gleich aus, so dass es bei reinen Text-E-Mails keine wirklichen Anpassungsmöglichkeiten gibt. Plain-Text ist im Wesentlichen das, was du in Notepad bearbeitest, während HTML eher dem entspricht, was du in Microsoft Word oder einem Rich-Text-Editor schreibst. Plain-Text-E-Mails haben jedoch immer noch ihren Platz in der modernen Welt.
HTML-E-Mails werden mit Hypertext Markup Language-Code geschrieben, mit dem du Grafiken implementieren, Schaltflächen hinzufügen und Videos direkt in deine E-Mails einbetten kannst. Du kannst auch HTML-Tags verwenden, um das Aussehen der Schriftart anzupassen und um anzugeben, ob du eine andere Schriftart verwenden oder die Farbe oder Größe der verwendeten Schriftart ändern möchten. Überschriften, tiefgestellte und hochgestellte Tags ermöglichen noch mehr Anpassungen, wenn es darum geht, wie der Text in einer HTML-E-Mail aussieht.
Viele Menschen sind zwar nicht mit HTML-E-Mails vertraut, aber die What-You-See-Is-What-You-Get (WYSIWYG) Editoren, die viele E-Mail-Programme verwenden, bieten ähnliche Features. Genau wie du Text fett, unterstrichen oder kursiv mit Gmail gestalten kannst, kannst du HTML verwenden, um das Erscheinungsbild deiner E-Mails anzupassen. Der einzige wirkliche Nachteil dieser WYSIWYG-Editoren ist die Tatsache, dass deine E-Mails auf verschiedenen Geräten und E-Mail-Clients möglicherweise nicht gleich aussehen. Allerdings leisten die meisten der beliebten WYSIWYG-Editoren gute Arbeit, wenn man eine Kampagne erstellen möchte, ohne Programmieren zu lernen.
HTML-Best-Practices
Wenn du sicherstellen möchtest, dass du qualitativ hochwertige HTML-E-Mails schreibst, die auf mehreren Geräten und E-Mail-Clients lesbar sind, musst du dafür sorgen, dass sie den Best Practices entsprechen. Hier findest du einige Best Practices für das HTML-E-Mail-Format, die dir dabei helfen, das perfekte Format für deine E-Mail-Kampagne zu finden.
Reagiert auf die Bildschirmgröße
Es gab eine einfachere Zeit, in der die meisten Computermonitore mit einer Auflösung von 800 x 600 liefen, aber diese Zeiten sind lange vorbei. Heutzutage gibt es Telefone, Computer, Laptops und Tablets, die viel höhere Auflösungen unterstützen, und man kann sich auch nicht darauf verlassen, dass verschiedene Geräte dasselbe Seitenverhältnis verwenden.
Responsive Design bedeutet, dass deine E-Mails so gestaltet sind, dass sie gut aussehen, egal mit welcher Bildschirmauflösung sie angesehen werden. Du willst nicht, dass ein Teil deiner E-Mail abgeschnitten wird, weil er nicht auf den Bildschirm eines Nutzers passt, aber du willst auch nicht, dass Grafiken und Text so klein sind, dass sie schwer zu sehen sind. Du kannst das tun, indem du Tabellen und Bilder auf unterschiedliche Breiten einstellst, je nachdem, auf welcher Bildschirmgröße sie angezeigt werden. Es ist hilfreich, das HTML-E-Mail-Layout gründlich zu testen, bevor du es an deine Mailingliste sendest.
Ladezeit
Wenn das Laden einer E-Mail zu lange dauert, geben viele Leser einfach auf und fahren mit der nächsten E-Mail fort. Man könnte meinen, dass jeder über ein Gerät und eine Internetverbindung verfügt, die schnell genug sind, um problemlos E-Mails zu laden, aber das ist bei vielen Menschen nicht der Fall. Für Personen, die ein älteres Gerät verwenden oder eine Verbindung zum Mobilfunknetz herstellen, kann das Laden einer E-Mail voller Bilder, Videos und anderer Medieninhalte schwierig sein.
Das heißt nicht, dass du keine Medienelemente in deine E-Mails einbinden solltest, aber du musst dir der Ladezeiten bewusst sein und wissen, wie diese sich auf deine Bounce-Rate auswirken. Bei der Erstellung von HTML-E-Mails geht es nicht nur um minimale Ladezeiten, sondern auch darum, dass deine E-Mails gut aussehen.
Unterschied zwischen E-Mail-Providern
Eines der größten Probleme für Webentwickler ist, dass verschiedene Webbrowser denselben HTML- und CSS-Code unterschiedlich darstellen können. Das Gleiche gilt für HTML-E-Mail-Marketing und verschiedene E-Mail-Clients. Deine E-Mail sieht zwar toll aus, wenn du sie gestaltest, aber einige E-Mail-Clients rendern Bilder oder Videos möglicherweise nicht richtig, oder sie bieten möglicherweise keine Unterstützung für die Schriftart, die du verwendest.
Wenn du eine HTML-E-Mail entwirfst, solltest du bedenken, dass es verschiedene E-Mail-Anbieter gibt. Das ist nicht nur eine Best Practice für das Schreiben von HTML-E-Mail-Formaten, sondern eine der wichtigsten Best Practices für E-Mail-Marketing im Allgemeinen.
Dadurch wird es für Abonnenten einfacher, Feedback zu den E-Mails zu geben, die sie erhalten haben. Wenn du viele Rückmeldungen darüber bekommst, dass Bilder nicht geladen oder E-Mails nicht richtig angezeigt werden, solltest du dein HTML-Layout ein wenig verändern, um etwas zu finden, das besser funktioniert.
Design für Mobilgeräte
Früher haben die meisten E-Mail-Nutzer über den Computer auf ihre E-Mails zugegriffen, sodass man sich nicht so viele Gedanken über die Gestaltung für verschiedene Geräte machen musste. Jetzt, wo das mobile Surfen die Nutzung von Desktop-PCs und Laptops überholt hat, ist die Gestaltung deiner E-Mails für Mobilgeräte wichtiger denn je. Du musst sicherstellen, dass deine E-Mails gut aussehen, egal ob sie auf einem Tablet, Laptop oder Smartphone angesehen werden.
Wenn du dein HTML-E-Mail-Format nicht so gestaltest, dass es mit Mobilgeräten funktioniert, verlierst du einen großen Teil deiner Zielgruppe für dein E-Mail-Marketing.
Führe Tests durch!
Sobald du glaubst, dass dein HTML-E-Mail-Format einsatzbereit ist, ist es an der Zeit, es zu testen. Du kannst versuchen, deine E-Mails an verschiedene Konten zu senden, die mit verschiedenen E-Mail-Clients verbunden sind, oder du kannst E-Mail-Testtools verwenden, um den Prozess zu vereinfachen. Wichtig ist, dass du deine E-Mails gründlich testest, bevor du sie an deine Mailingliste versendest.
Zusätzlich zum Testen kannst du die Leser um Feedback zum Format deiner E-Mails bitten. Wenn du mehrere Beschwerden darüber bekommst, dass ein Bild nicht richtig angezeigt wird oder eine E-Mail zu lange zum Laden braucht, ist das ein Zeichen dafür, dass du deine HTML-E-Mails für diesen Kunden besser gestalten musst.
HTML ist einfacher zu lernen als du denkst
Die meisten Menschen haben sich an die Verwendung von WYSIWYG-Editoren gewöhnt, aber ein gutes HTML-E-Mail-Format hat immer noch seinen Platz in der modernen Welt des E-Mail-Marketings. Das HTML-E-Mail-Design mag auf den ersten Blick etwas kompliziert erscheinen, aber es ist viel einfacher, wenn du erst einmal die Grundlagen kennst. Der Einsatz von Testtools und die Gestaltung für mobile Endgeräte können dir sogar dabei helfen, E-Mails zu vermeiden, die mit bestimmten Geräten oder E-Mail-Anbietern nicht funktionieren.
Wenn du dir nicht die Mühe machen willst, HTML-E-Mails zu erstellen, die für deine Mailingliste funktionieren, kann Mailchimp helfen. Mit HTML-Vorlagen für E-Mails und unzähligen tollen Tools für E-Mail-Marketing und Automatisierung ist Mailchimp deine Komplettlösung für E-Mail-Marketing. Wenn deine E-Mail-Marketingkampagne einen Schub braucht, probiere Mailchimp noch heute aus.
Hol dir den Leitfaden von Mailchimp für fortgeschrittenes E-Mail-Marketing
Baue dein Geschäft mit dem richtigen Wissen und den richtigen Strategien aus, um deine E-Mails zu verbessern, die Aufmerksamkeit deiner Zielgruppen zu gewinnen und Leads in treue Kunden zu verwandeln.