Kostenlos testen Login
Home » Newsletter Design Guide

Newsletter Design Guide

Sie möchten, dass Ihr Newsletter ansprechend aussieht und die Empfänger begeistert? Ein gutes Newsletter Design aktiviert die Leser und sorgt für gute Ergebnisse in Form von Klicks und Conversions.

Wie die grafische Gestaltung eines Newsletters gelingt

Bei HTML-Newslettern ist die Gestaltungsfreiheit zum Glück beinahe grenzenlos. Der Newsletter kann aus verschiedenen Bildern, Texten und Links frei zusammengestellt werden.

Mithilfe von Formatierungen, Spalten und Personalisierungen kann das Design ganz nach Wunsch angepasst werden. Auf dieser Seite finden Sie Newsletter-Design-Tipps und erfahren, wie die grafische Gestaltung von Newslettern mit Newsletter2Go funktioniert.

Newsletter Design

Tipps zur grafischen Gestaltung Ihres Newsletters

Aufbau eines Newsletter-Designs

1. Link zur Webversion

Möglichst direkt am Anfang des Newsletters sollte ein gut sichtbarer Link zur Webversion eingebaut werden. Falls der Nutzer Darstellungsprobleme hat oder die Bilder nicht angezeigt werden, öffnet sich der Newsletter nach einem Klick auf diesem Link im Browser. Die Browserversion ist eine gute Sicherung, da sie weniger anfällig für Unterschiede in der Newsletter-Darstellung als die verschiedenen E-Mail-Clients ist.

2. Absender-Logo

Es ist wichtig, dass der Empfänger auf den ersten Blick erkennen kann, von wem der Newsletter stammt. Ein klar erkennbares Firmenlogo erleichtert die Wiedererkennbarkeit und sorgt für mehr Vertrauen. Außerdem bleibt Ihre Marke den Empfängern so besser im Gedächtnis. Es ist sinnvoll, auf das Logo einen direkten Link zur Website zu setzen.

3. Teaserbild

Das Teaserbild entscheidet, ob der Empfänger sich den restlichen Newsletter ansieht oder nicht. Richtig eingesetzt, sagt ein Bild mehr als tausend Worte. Ein Foto an erster Stelle des Newsletters fängt die Aufmerksamkeit der Leser ein und macht sie neugierig auf den restlichen Inhalt. Das Foto sollte professionell sein und perfekt zum Inhalt des Newsletter passen. Wenn Text im Teaserbild genutzt wird, sollte dieser sparsam eingesetzt werden und nicht zu klein sein.

4. Inhalt

Als nächstes folgen Texte, Bilder und Links, die den eigentlichen Inhalt des Newsletters bilden. Hier kommt es vor allem auf Klarheit und Übersichtlichkeit an. Der Newsletter sollte keinesfalls mit Inhalten überladen werden. Wählen Sie einheitliche Schriftarten, lassen Sie genügend Freiraum und nutzen Sie aussagekräftige Bilder. Eine klare Struktur hilft dem Leser dabei, den Überblick zu behalten und Ihre Inhalte leichter zu erfassen.

5. Social Media-Links

Es lohnt sich immer, seine Reichweite zu vergrößern. Deshalb sollte man, falls vorhanden, aus dem Newsletter direkt auf die eigenen Social Media-Kanäle verlinken und die Empfängern einladen, diesen zu folgen.

6. Impressum/Kontakt

Jeder Newsletter muss das Impressum des Absenders enthalten. Auch wenn in manchen Fällen ein Link zum vollständigen Impressum ausreichend ist, sollten einige wichtige Angaben immer direkt im Newsletter stehen. Dazu gehört der Name und der Anschrift des Absenders, der Name eines Vertretungsberechtigten und Ansprechpartners und die Kontaktinformationen mit einer gültigen Telefonnummer und E-Mail-Adresse.

Begeta Newsletter Desktop Version

7. Abmeldelink

Die Empfänger müssen sich jederzeit ohne Hindernisse vom Newsletter abmelden können – so will es der Gesetzgeber. Fügen Sie deshalb jedem Newsletter unbedingt einen funktionsfähigen Abmeldelink hinzu. Nach dem Klick auf den Abmeldelink sollte der Empfänger sofort abgemeldet werden, ohne die Abmeldung nochmals bestätigen zu können. Falls Sie mehrere Newsletter versenden, können Sie an dieser Stelle auch einen Link zu den Newsletter-Präferenzen einfügen. Die Empfänger können sich dann von allen Newslettern separat an- und abmelden.

Sie benötigen ein Newsletter-Template in Ihrem Design? Gerne programmieren wir eine Vorlage nach Ihren Vorstellungen.

Übersicht: Newsletter Design mit der Software von Newsletter2Go

Schritt-für-Schritt-Anleitung zur Optimierung Ihres Newsletter-Designs

1. Schritt: Newsletter-Vorlage wählen

2. Schritt: Inhalte im Drag&Drop-Editor hinzufügen

3. Schritt: Newsletter Design personalisieren

4. Schritt: Pflicht-Elemente hinzufügen

Jetzt kostenlos testen

Ich akzeptiere die AGB und Datenschutzerklärung.

Wie Sie Ihr Newsletter Design optimieren

Newsletter-Layout

Conversion Centered Newsletter Design

Ein guter Newsletter soll vor allem eines: Seine Empfänger zu einer bestimmten Aktion bewegen. Meistens stehen dabei Conversions im Mittelpunkt, also Webshop-Käufe oder Registrierungen. Das gesamte Newsletter-Design sollte auf die Aktion, die der Leser vollziehen soll, ausgerichtet sein. Das bezeichnet man auch als Conversion Centered Design. Dazu gehört, dass die einzelnen Elemente des Newsletters so gestaltet sind, dass zur Conversion führende Call-to-Actions leicht zu finden sind. Indem man dem Leser eine visuelle Anleitung gibt, findet er leichter zum Ziel.

Above-the-Fold-Bereich

Essentiell beim Newsletter-Design ist der Above-the-Fold-Bereich (auch als Above-the-Scroll bezeichnet). Damit ist der Bereich des Newsletters gemeint, den der Leser beim Öffnen auf einen Blick sehen kann. Hier muss eindeutig erkennbar sein, worum es in dem Newsletter geht und was der Empfänger tun soll. Es gilt, die Aufmerksamkeit einzufangen, z.B. mit einem auffälligen und schönen Teaserbild. Der Leser muss unbedingt dazu angeregt werden, weiter zu scrollen und sich den restlichen Newsletter anzusehen.

Whitespace

Beim Layout des Newsletters sollte man immer darauf achten, genügend Abstand zwischen den einzelnen Elementen wie Bildern und Texten zu lassen. Ausreichend Whitespace sorgt dafür, dass man den Newsletter besser lesen und die Inhalte besser auseinander halten kann. Generell sollte der Newsletter nicht überladen werden, sondern sich möglichst auf ein Thema beschränken.

Responsive Newsletter Design

Zum Lesen von Newslettern werden viele verschiedene Endgeräte benutzt: Desktop-Rechner, PCs, Smartphones, Tablets und sogar Smartwatches. Auf jedem dieser Endgeräte soll der Newsletter lesbar sein und gut aussehen. Damit nicht für jedes Endgerät und jede Bildschirmgröße ein eigenes Newsletter-Design entwickelt werden muss, sollten Newsletter im Responsive Design angelegt werden. Dabei werden Attribute hinterlegt, die festlegen, wie der Newsletter je nach Endgerät angezeigt wird. Verwendet man eine responsive Newsletter-Vorlage, kann man sicher sein, dass der Newsletter immer richtig dargestellt wird. Die Newsletter-Templates, die Sie in der Newsletter-Design-Software von Newsletter2Go finden, sind komplett responsive und für alle wichtigen Clients getestet.

Bilder im Newsletter

Dateigröße

Bilder, die im Newsletter verwendet werden, sollten natürlich von höchster Qualität sein. Es gilt dabei aber, auf die Dateigröße zu achten. Bilder im Newsletter müssen beim Empfänger geladen werden, damit sie angezeigt werden können. Die Dateigröße entspricht dabei aber nicht den tatsächlich angezeigten Maßen, sondern der Größe, in der das Bild hochgeladen wurde. Man sollte Bilder im Newsletter also unbedingt vor dem Upload verkleinern und genauso hochladen, wie sie im Newsletter verwendet werden. So vermeidet man lange Ladezeiten beim Empfänger und dass der Newsletter bei eingeschränkter Bandbreite gar nicht geladen wird.

Alt-Texte

Für den Fall, dass die Bilder nicht geladen werden, sollten auf jeden Fall Alt-Texte hinterlegt werden. Diese werden anstelle des Bildes angezeigt. Viele E-Mail-Clients und mobile Apps unterdrücken noch immer standardmäßig Bilder. Ohne Alt-Texte ist der Inhalt des Newsletters in diesem Fall oft nur schwer erkennbar. Im Idealfall gibt der Alt-Text den Inhalt des Bildes, das er beschreibt, exakt wieder.

Eingebettete Bilder

Im Zweifelsfall können kleine Bilddateien wie Buttons auch eingebettet werden. Eingebettete Bilddateien werden immer angezeigt, sogar wenn keine Bilder geladen werden. Da sie den HTML-Code erheblich in die Länge ziehen und die Ladezeit des Newsletters verlängern, sollten jedoch nur die nötigsten Bilder eingebettet werden.

Inhalt des Newsletters

Personalisierte Produktbilder

Sollen im Newsletter Produkte verkauft werden, sind Produktbilder beinahe unverzichtbar. Diese sollten von hoher Qualität und ansprechend sein. Mithilfe eines Fotos können sich die Empfänger ein viel besseres Bild von den beworbenen Produkten machen. Damit man nicht jedes Bild einzeln in den Newsletter einfügen muss, kann die 1-Klick-Produktübernahme der Newsletter-Design-Software von Newsletter2Go genutzt werden. Produktbilder werden mit dieser Funktion automatisch in den Newsletter geladen. Mithilfe von dynamischen Produktbildern kann das Newsletter-Design personalisiert werden. Indem man für verschiedene Zielgruppen unterschiedliche Bilder hinterlegt, deckt man mit einem Newsletter eine breitere Leserschaft ab.

Call-to-Action

Entscheidend für den Erfolg eines Newsletters ist die Wahl des richtigen Call-to-Actions (CTA). Das bezeichnet die Handlungsaufforderung, der der Empfänger folgen soll. Call-to-Actions können beispielsweise „Produkt ansehen“, „Jetzt kaufen“ oder „Gutschein einlösen“ sein. Beim Newsletter-Design kommt es auf die Platzierung, Farbe und die Beschriftung des CTA an. Er sollte gut sichtbar sein, idealerweise im Above-the-Fold-Bereich. Außerdem muss er sich vom Rest des Newsletters gut abheben. Der Beschriftung kommt ein besonderer Stellenwert zu. Je spezifischer der CTA formuliert ist, desto wahrscheinlicher ist es, dass der Empfänger die gewünschte Aktion auch durchführt. Eine genaue Handlungsaufforderung wirkt besser als ein allgemeines „Hier klicken“.

Farben im Newsletter

Signalfarben

Die Wahl der Farben im Newsletter-Design sollte genau überdacht werden. Am besten entscheidet man sich bei der grafischen Gestaltung des Newsletters für ein Farbkonzept, das dem Corporate Design weitestgehend entspricht. Für CTAs werden tendenziell eher Signalfarben verwendet. Jede Farbe hat ihre eigene Wirkung und kann den Erfolg des Newsletter beeinflussen. So wirkt Gelb zum Beispiel optimistisch, während Rot energischer ist und Druck erzeugt. Orange hat eine anregende, aber auch aggressiv anmutende Wirkung. Kühle Farben wie Blau und Grün wirken ruhiger und strahlen Sicherheit und Entspannung aus. Schwarz hingegen strahlt Luxus aus.

Farbkontraste

Mithilfe von Kontrasten lässt sich die Farbwirkung noch verstärken. Ein kontrastreiches Newsletter-Design sorgt dafür, dass CTAs sich besser abheben und mehr auffallen. Dafür können verschiedene Arten von Kontrasten genutzt werden: Es gibt unterschiedliche Farbkontraste, z.B. den besonders auffälligen Komplementärkontrast, aber auch „sanftere“ Kontrastarten wie Hell-Dunkel-Kontraste und Intensitätskontraste.

Weitere Tipps zum Newsletter-Layout

Newsletter_Layout

Wie Sie E-Mails designen, die Ihre Empfänger begeistern: Mit schönen Newslettern erreicht man leicht die gewünschte Wirkung. Ein gutes Newsletter-Layout fängt die Aufmerksamkeit der Leser ein und sorgt für eine positive Assoziation mit Ihrer Marke. [Beitrag lesen]

Einführung Konversions-Optimierung

Wie kann man durch das Newsletter-Design die Konversionsrate steigern? Das Stichwort lautet „Conversion Centered Design“. Das Newsletter-Design soll es den Lesern so einfach wie möglich machen, das Conversion-Ziel zu erreichen. [Beitrag lesen]