Warum eine Navigationsleiste im Newsletter absolut sinnvoll ist?

Alle Elemente sollten beim Gestalten eines Newsletters sorgfältig durchdacht sein. Angefangen beim Absender und der Betreffzeile, die zusammen mit dem Preheader die erste Hürde im Posteingang darstellen, geht es weiter beim Öffnen des Mailings. Hier beginnt der richtige Spaß: Wie behalten Sie nun die Aufmerksamkeit der Leser?

Sei es der Header, die Navigationsleiste, der E-Mail-Body oder der Footer – nichts bleibt im E-Mail-Design dem Zufall überlassen. Dieses Mal beschäftigen wir uns mit der Navigationsleiste. Wo sollte sich diese im Mailing befinden? Wie kann sie aussehen? Oder lenkt sie eher vom eigentlichen Ziel ab, die folgenden fünf Tipps helfen Ihnen dabei die Navigation auf mehr Klicks zu trimmen.


Was ist überhaupt die Navigationsleiste? 

In vielen Mailings befindet sich im Kopfbereich eine Navigation oder ein Menü, welches auf die interessanten Rubriken der Webseite verlinkt. Sie verweist eigentlich nie auf interne Verlinkungen im Newsletter.

Meistens im Kopfbereich einer Mail, neben oder unter dem Logo befindet sich eine Navigationsleiste. Verlinkt sind hier die wichtigsten Kategorien oder Aktionen


1. E-Mail-Design: Wie eine Navigation bei unterdrückten Bildern aussieht 

Viele E-Mail-Clients unterdrücken Bilder standardmäßig. Sie müssen manuell vom Empfänger nachgeladen werden. Damit Ihre Navigation auf Anhieb verstanden wird, sollte sie als HTML-Text gestaltet werden. Um sie vom Rest abzuheben, können sie sie mit einer anderen Hintergrundfarbe versehen.Wenn Sie in der Navigation Grafiken verwenden, hinterlegen Sie einen leicht verständlichen ALT-Text. Dieser wird auch bei unterdrückten Bildern dargestellt.

Design-Tipp: Viele Email-Designer orientieren sich beim Look der Navigation an dem ihrer Webseite, um die Wiederererkennung zu erhöhen. Planen Sie regelmäßig kleine Änderungen am Design, der Stelle oder dem Wording mit ein.

Denn: Ein immer gleich bleibender Look wird irgendwann nicht mehr wahrgenommen. Diesen Gedanken nehmen wir später noch einmal unter  Punkt 5 „Testen“ auf. Es folgen hier zwei Ideen, wie das Menü im Header platziert werden kann.


Der Modehändler J.CREW  setzt bei diesem Beispiel die Navigation rechts neben das Logo.


Beim Papiershop Paperless wird das Logo in die Mitte gesetzt und rechts und links von je drei Menüpunkten flankiert.

Bei monothematischen Themen wie einer Webinar-Anmeldung oder dem vorstellen eines Produkts, geht die Tendenz mittlerweile eher in die Richtung die Navigation ganz wegzulassen. Der offensichtliche Grund ist: nicht vom Thema abzulenken. So gesehen bei einer Webinar-Einladung der Projekt-Management-Software Mavenlink.

Bei Kampagnen wie einer Umfrage oder einer Willkommensmail, kann die Navigation durchaus erscheinen.


Bei Webinar-Einladungen ist es das vorrangige Ziel, die Leser zur Anmeldung zur bewegen. lassen wir mittlerweile die Navigation ganz weg, um nicht vom Thema abzulenken.

Nehmen wir beispielsweise die Umfragemail „Penny for your thoughts „von Kate Spades, einem Modeshop aus New York. Wer gerade keine Lust hat oder die Idee überhaupt nicht mag, kann immer noch bei den Kategorien wie „New Arrivals“, „Handbags“ oder „Sale“ vorbeischauen.

Ähnlich verhält es sich bei einer Willkommensmail. Als Beispiel sei hier die Begrüßungsmail der Sportmodemarke FUNFIT erwähnt. Sie begrüßt neue Leser und stellt gleichzeitig die Marke vor. Was gibt es da Besseres, als die derzeit beliebten Kategorien ebenfalls mitanzuzeigen?

 

Bei Umfragen kann eine Navigation mit angezeigt werden. So gesehen beim Modeshop Kate Spade „Penny for your thoughts“.


…und bei der Willkommensmail von FUNFIT. Neben dem Design in Pastelltönen stechen die in Schwarz gehaltene Navigation und CTA’s ins Auge.


2. Zeigen Sie eine individuelle Navigation an

Je nachdem nach welchen Zielgruppen Sie unterscheiden können, richten Sie für jede eine eigene Navigation ein. Angefangen von Männer, Frauen, Kunden oder Nicht-Kunden bzw. Nicht-Registrierte und Registrierte oder Interessenten. Kunden sehen z.B. gleich das Login oder ihre Wunschliste und Nicht-Kunden sehen, wie sie sich registrieren können.

Zeigen Sie passend zur Zielgruppe eine andere Navigation an. Beim Optivo Newsletter sehen Kunden z. B. Zusatzprodukte und Case Studies.


Interessierte hingegen machen wir auf den Know-how-Bereich und das Consulting-Angebot aufmerksam. Wer mag, kann den Newsletter abonnieren und beobachten wie er sich entwickelt.

Saisonale Anlässe: Verweisen Sie in Ihrer Navigation ebenfalls auf aktuelle Events oder Kampagnen wie Ostern, den Adventskalender oder Summer Sale. Tauschen Sie beliebte Produktkategorien aus wie Leuchten und Wohntextilien für den Winter.


Passen Sie die Navigation der jeweiligen Saison an. So gesehen beim Onlineshop der britischen Kaffeehäuser- und Geschenke-Shop-Kette Bettys.

Ebenso weist der Online-Blumenversand Blume2000 gleich in der Navigation prominent auf Halloween hin. Interessant sind zudem die Farbwelten oberhalb des Footers.


3. Navigation im Footer wiederholen

Nutzen Sie ebenfalls den Raum zwischen dem Inhalt und dem abschließenden Footer. Haben Empfänger bis zu diesem Bereich gescrollt, kann es sein, dass sie nichts Interessantes gefunden haben. Im schlimmsten Fall möchten sie sich sogar vom Newsletter abmelden. 

Deshalb schlagen wir Ihnen für diesen Bereich ein Sicherheitsnetz vor. Verlinken Sie, passend zur Zielgruppe, auf Kategorien, Marken oder aktuelle Landing Pages.

Bei diesem Newsletter von mini Boden wird gleich unter dem Logo eine Navigation angezeigt sowie eine weitere über dem Footer. Doppelt hält einfach besser. 

4. Steuern Sie den Blickverlauf auch in der Navigation

Überlassen Sie den Blickverlauf Ihrer Leser nicht dem Zufall – auch nicht bei der Navigation.  Steuern Sie die Blickpfade, in dem wichtigere Menü-Punkte nachrangigen hervorgehoben werden. Dies können unterschiedliche Kontraste wie Schwarz vs. Grau sein oder unterschiedliche Schriftgrößen.

Der Brautmoden-Shop BHLDN zeigt gleich zwei Navigationen an. Eine  allgemeinere und eine themenbezogene − getrennt werden Sie durch unterschiedliche Hintergrundfarben. Überhaupt ist dieses E-Mail-Design ein schönes Beispiel, wie man den Blickverlauf führen kann.


Bei diesem Beispiel von LOFT wird in der Navigation besonders der SUMMER GUIDE (hellblauer Button oben rechts) hervorgehoben.



5. Testen Sie unterschiedliche Varianten

Regelmäßige Tests ermöglichen es Ihnen, das Maximum aus Ihren Kampagnen herauszuholen. Ein Nachteil der Navigationsleiste ist, dass diese Links ebenfalls eine Chance bieten, vom Thema abzulenken. Deshalb empfiehlt es sich, auch die Navigation regelmäßig zu testen.

Was können Sie bei der Navigation testen?

  • Spielen Sie mit dem Wording: Testen Sie Synonyme. Versteht Ihre Leser englische Begriffe „New arrivals“?
  • Design: Testen Sie die Position − neben dem Logo, unter dem Logo oder über dem Footer. Behalten Sie ebenfalls das Design bei unterdrückten Bildern und bei mobilen Geräten im Kopf.
  • Zielgruppen: Zeigen Sie Männern ein anderes Menü als Frauen. Kunden können gleich zum Kundenkonto gelangen, während Nicht-Kunden sehen, dass sie sich registrieren können.

 

Jede Zielgruppe „tickt“ anders. Damit Sie nicht den Überblick verlieren, bereiten Sie einen Test-Plan vor. Planen Sie auch Wiederholungen mit ein. Denn: Was heute gut funktioniert, kann in sechs oder neun Monaten überholt sein. Ein Testart ist z.B. der A/B-Test: Die eine Hälfte der Empfängerliste bekommt eine Variante, die andere eine andere. Danach schaut man sich an, welche Version besser performt.

Die Fluglinie KLM zeigt hier zwei Reiter: einmal die Aktion und einmal die Startseite.  Nutzen Sie die Navigation gezielt als weiteres veränderbares Element. Testen Sie unterschiedliche Varianten, passend zum Angebot.

Bei diesem Beispiel erscheinen in der Navigationsleiste neben den Last-Minute-Angeboten alle Kontinente, die angeflogen werden. 

Abschließend sei angemerkt: Auch hinter so einem unscheinbaren Element wie der Navigationsleiste steckt noch Potential. Im Vergleich zeichnen sich ein paar Tendenzen ab, wo sie sich befinden sollte – im Header, neben oder unter dem Logo und über dem Footer − und wann sie weggelassen werden kann – bei Event-Einladungen. Ganz sicher können Sie sich sein, wenn Sie regelmäßig testen..

Ein Beispiel für ein Mailing mit Inhaltsverzeichnis ist der redaktionell gehaltene Newsletter von The British Shop.


Was ist eigentlich ein Inhaltsverzeichnis in einer E-Mail?

Neben einer Navigationsleiste kann es in einer E-Mail ein Inhaltsverzeichnis geben. In diesem werden Verlinkungen innerhalb der Mail angezeigt. Allerdings verschwindet dieses Element seit Jahren mehr und mehr. Ein wichtiger Grund ist sicherlich der, dass im E-Commerce jeder Klick nützlich sein sollte. Will sagen: Lieber auf einer Landing Page verweisen als auf einen Beitrag im Newsletter.  Mit hinein fließt auch das Nutzerverhalten: Über 60 % der Empfänger öffnen ihre Mailings mobil. Scrollen ist dabei angenehmer, als ein lustiges Hin-und-Her-Springen innerhalb der Mail.