Landing Page: Was ist das?

Eine Landing Page ist eine speziell gestaltete Webseite, die Nutzer aufrufen, nachdem sie auf eine Online-Werbung geklickt haben. Sie dient in der Regel dazu, die Nutzer auf bestimmte Aktionen aufmerksam zu machen und sie dazu zu bringen, eine bestimmte Handlung durchzuführen, wie zum Beispiel das Ausfüllen eines Formulars oder das Klicken auf einen Kaufbutton. Landing Pages werden häufig im Rahmen von Online Marketing Kampagnen eingesetzt, um Nutzer zu convertieren, also zu Kunden oder Leads zu machen. Sie können auch als Teil von Crossmedia Kampagnen eingesetzt werden, indem sie beispielsweise in klassischen Printwerbung oder TV-Spots beworben werden.

Home Page / Landing Page: Unterschied

Eine Homepage ist in der Regel die Hauptseite einer Website und dient als Einstiegsseite für Nutzer. Sie gibt in der Regel einen Überblick über das Unternehmen oder die Marke und verlinkt auf weitere Seiten der Website.

Eine Landing Page hingegen ist eine speziell gestaltete Webseite, die Nutzer aufrufen, nachdem sie auf eine Online-Werbung geklickt haben. Sie dient in der Regel dazu, die Nutzer auf bestimmte Aktionen aufmerksam zu machen und sie dazu zu bringen, eine bestimmte Handlung durchzuführen, wie zum Beispiel das Ausfüllen eines Formulars oder das Klicken auf einen Kaufbutton. Landing Pages werden häufig im Rahmen von Online-Marketing-Kampagnen eingesetzt, um Nutzer zu convertieren, also zu Kunden oder Leads zu machen.

Im Gegensatz zu einer Homepage, die in der Regel einen allgemeinen Überblick über das Unternehmen oder die Marke gibt, ist eine Landing Page auf ein spezifisches Ziel ausgerichtet und soll Nutzer dazu bringen, eine bestimmte Handlung durchzuführen.

Was macht eine Landingpage aus?

Eine Landing Page sollte auf die Ziele und Bedürfnisse der Nutzer abgestimmt sein und ihnen einen klaren Nutzen bieten. Sie sollte daher folgende Elemente enthalten:

• Eine klare Headline, die das Angebot oder den Nutzen des Produkts oder der Dienstleistung verdeutlicht
• Ein Call-to-Action-Button, der die Nutzer dazu auffordert, eine bestimmte Handlung durchzuführen (z.B. „Jetzt kaufen“, „Anmelden“, „Mehr erfahren“)
• Ein Formular, in dem Nutzer ihre Kontaktdaten hinterlegen können, um mehr Informationen zu erhalten oder ein Angebot anzufordern
• Eine Verbindung zu den sozialen Netzwerken des Unternehmens, um die Markenbekanntheit zu erhöhen und die Möglichkeit zu bieten, dass Nutzer die Landing Page teilen
• Eine Übersicht über das Angebot oder die Dienstleistung, die auf die Bedürfnisse der Nutzer abgestimmt ist
• Testimonials von zufriedenen Kunden, die das Vertrauen in das Unternehmen oder die Marke stärken
• Eine mobile Responsive Design, damit die Landing Page auch auf mobilen Geräten gut angezeigt wird

Es gibt noch viele weitere Elemente, die eine Landing Page enthalten kann, und die Auswahl hängt von den Zielen und der Zielgruppe einer Kampagne ab.

Landing Page im E-Mail Funnel Marketing

Um Leads einzusammeln, ist eine Landing Page also ein starkes Tool. Im Prozess steht die Landing Page immer zwischen 1) Werbung und 3) dem Lead (Eintrag in der E-Mail Liste).

Social Ad, Landing Page, E-Mail Marketing: Crossmedia

Crossmedia Marketing – Crossmedia Marketing streut eine Marketingbotschaft über Online Werbung, E-Mail Marketing, SMS- und Messenger Dienste, Out-of-Home Werbung, Veranstaltungen, Sponsoring, In-Store-Marketing, Radio, TV oder auch Printmedien. Je nach Größe und Skalierung birgt dies den großen Vorteil, dass Zielgruppen direkt allumfassend beworben werden, statt über einen einzelnen Kanal und mit jeweils einer Agentur. Lernen Sie hier etwas mehr über die Strategie:

• Crossmedia Marketing

Klassischer WordPress Editor oder doch Composer?

Machen Sie ein Wort fett, ist es fett. Unterstreichen Sie ein Wort, ist es unterstrichen. Genauso funktioniert der WordPress Editor, was du tust, ist, was du siehst. Für kleinere Online-Projekte, Websites und Blogs reicht diese Funktion vollkommen aus. Mit der zunehmenden Beliebtheit von WordPress wurden aber auch immer größere Seiten mit dem System umgesetzt. Viele der Webdesigner und Medienmanager wollten sich aber nicht mit einfachen Textfeldern zufriedengeben und die einzelnen Layout der Seiten verschönern. Durch individuelle Icons, individuelle Hintergründe, Slider, große Bilder und vieles mehr.

• Einfacher Editor, leicht bedienbar
• Ideal für kleinere Websites und Blogs
• „What you see is what you get“-Prinzip

Composer & Design

Für einen Profi ist das auch gar kein Problem, er schreibt sich ein paar Zeilen Code mit HTML und CSS und schon ist es erledigt. Das Prinzip eines Content-Management-Systems ist es aber, große Datenmengen zu verwalten und sie im Idealfall auch für Anwender einfach zugänglich, editierbar und löschbar zu machen. Deshalb empfiehlt es sich, eine schöne, benutzerfreundliche Oberfläche zu haben, in der sich auch ohne große technische Vorkenntnisse einfach arbeiten lässt.

• Ermöglicht komplexe Layouts und Designs
• Nutzt Icons, Hintergründe, Slider, Bilder
• Benutzerfreundlich auch ohne Programmierkenntnisse

Prinzip, Design mit Shortcodes

Um Seiten einfacher zu stylen, wurden Shortcodes eingeführt. Sie fassen komplizierten Code in einfache Tags zusammen, die vom Benutzer genutzt werden können. Ein Beispiel wäre, eine ansprechende Überschrift in einen Shortcode zu verpacken:

[ headline ]Hier steht die Überschrift[ /headline ]

… das Element bekommt dann eine besondere Farbe, eine besondere Position, vielleicht eine andere Schriftart, Schrift, Stärke und vieles mehr. Bevor wir nun komplizierte HTML und CSS-Eigenschaften tippen, wäre es doch schlau, nur den Begriff Headline zu verwenden. Und genau so funktioniert das Prinzip Shortcodes: Sie verpacken kompliziertere, lange Codes in einfache kleine Schnipsel. Das Problem an diesem Prinzip ist, Sie benötigen viel visuelle Vorstellungskraft, denn der Nutzer sieht Code, keine schön formatierte Überschrift. Und stellen Sie sich jetzt vor, dass wir die Komplexität nur ein Stück erhöhen und Tabellen einbauen, mit exakt gleichen Abständen, die dann auch noch im Hintergrund eingefärbt sind, individuell, einmal blau, einmal gelb und einmal orange. Hier stoßen Shortcodes an ihre Grenzen, zumindest für den Nichttechniker.

• Vereinfachen komplizierte HTML- und CSS-Codes
• Erzeugen schnell formatiertes Design
• Grenzen bei komplexeren Layouts

Neu: Composing im WordPress-Editor

Damit Inhalte ganz einfach platziert werden können und auch direkt visuell sichtbar sind, in ihrer ungefähren Position, in ihrer ungefähren Form, gibt es seit einiger Zeit verschiedene Alternativen zum standardmäßigen WP-Editor: Composer. Diese können Sie ganz gewöhnlich herunterladen, in Ihrem WordPress-System installieren und schon geht es los. Alle wichtigen Downloads finden Sie hier und noch einmal am Ende des Artikels.

Installation und Aktivierung

Im ersten Schritt installieren Sie den Composer Ihrer Wahl wie ein ganz normales Plugin in Ihrem WordPress Dashboard. In einem weiteren Schritt aktivieren Sie das Plugin wie gewohnt. Was hat sich nun verändert? Seiten und Beiträge. Werfen wir zunächst noch einmal einen Blick auf Ihr WordPress Dashboard. Hier finden Sie alle wichtigen Punkte für Sie noch einmal im Überblick, von den Blogposts über die Medien bis zu Kommentaren und Erweiterungen. Für unsere heutige Aufgabe relevant sind Seiten und Beiträge. Seiten und Beiträge unterscheiden sich im Prinzip nur dadurch, dass Sie Beiträge wie in einem klassischen Blog kategorisieren und zeitlich einordnen. Seiten sind alle statischen Seiten wie Ihre AGB, Kontaktseiten oder „Über uns“, aber auch die Startseite und so weiter.

Die wichtigsten WP-Dashboard Elemente für Ihre Website:

Das WordPress-Dashboard ist Ihr zentraler Hub zur Verwaltung Ihrer Website. Es bietet schnellen Zugriff auf Beiträge, Seiten, Plugins und Einstellungen. Hier starten Sie alle wichtigen Aktionen und behalten die Übersicht über Ihre Website-Aktivitäten.

WP-Composer aktivieren

Im folgenden Beispiel verwenden wir den Layout-Editor im WordPress-Themes Enfold (hier zu finden). Egal, ob Sie den Layout-Editor verwenden oder den Visual Composer der WP Bakery, Sie finden nun in jeder Einzelseite oder einzelnen Beiträgen einen blauen Button, der Sie zum Composer führt, bzw. den Modus vom WP-Editor zum Composer wechselt.

Nach dem 5.0 Update von WordPress gab es einige änderungen in der WP Bakery

Viele Vorteile, viel Flexibilität

Werfen wir zunächst einen Blick auf die unzähligen Vorteile, die der Composer für Sie mit sich bringt. Zum einen haben wir die responsive Zusammenstellung der Inhalte für Computer und für mobile Endgeräte. Der Composer ermöglicht, dass Spalten und Zeilen als einzelne Elemente betrachtet werden und sie sich je nach Bildschirmgröße, das heißt an Desktop, Tablet oder Smartphone, anpassen. Des Weiteren haben Sie eine visuelle Oberfläche, Sie benötigen weder HTML noch CSS noch Shortcodes, um starke Elemente wie Videos oder Hintergründe zu erzeugen. Alle Elemente innerhalb der Pages oder Posts können Sie ganz einfach und intuitiv via Drag-and-drop verschieben. Der Aufbau der einzelnen Elemente ist dabei definiert und stets gleich, dies gibt Ihrer Website einen einheitlichen Look und dem Nutzer Orientierung und damit weniger Störungen beim Besuch.

Weitere Vorteile:

• Elemente sind frei positionierbar – auch ohne HTML, CSS Kenntnisse
• Medien, Bilder, u. v. m. sind einfach einzubinden
• Wir können Layouts als Vorlagen anlegen
• …

Spalten, Zellen und Aufbau

Schauen wir uns nun Bild 4 an. Dort finden Sie den Abschluss der kleinen Einführung in das Arbeiten mit visuellen Editoren in WordPress. Auch in meinen Workshops ist das der letzte Step, da das Arbeiten mit einem Composer sehr intuitiv ist und am besten durch Probieren gelernt werden kann. Das kostet auch nicht viel Zeit, denn die Elemente beschränken sich meist auf zwanzig Stück. Mit einer selbstständigen Einarbeitung ist die Verwendung des Composers einfacher und schneller verständlich. Die Ergebnisse werden schnell sehr gut sein, da die Anwendung wirklich einfach ist mit etwas Anleitung und Vorstellungskraft.

Mein Tipp: Keep it simple

Oft muss keiner der speziellen Überschriften sein, es reicht ein Textfeld. Setzen Sie sich eine Sektion, oder arbeiten Sie mit einer Spalte, platzieren Sie hier ein Textelement und schauen Sie, was passiert. Über die Vorschau (rechts oben auf Ihrer Bearbeitungsseite), sehen Sie das Ergebnis in einem neuen Browser-Tab. Gehen Sie nun einen kleinen Schritt weiter und setzen Sie eine Linie in unser erstes Textfeld. Aus dem Textfeld machen Sie eine Überschrift und ganz am Ende positionieren Sie jetzt ein neues Textfeld. Fertig. Diese Felder können Sie in einem Composer einfach kopieren und sich so direkt drei oder vier oder fünf Absätze schaffen. So können Sie schnell Layouts schaffen und auch neue Mitarbeiter schnell einlernen und ihnen zeigen, wie effektives Content-Management funktioniert.

Noch Fragen zum Thema Content-Management, Content-Marketing, WordPress oder Workshops? Dann rufen Sie uns an, wir haben effiziente und starke Workshop Konzepte, die wir schon oft erprobt haben, in enger Zusammenarbeit mit unseren Kunden und Auftraggebern. Profitieren Sie auch von unseren Erfahrungen und Know-how als Online-Unternehmer und -Berater.

• Download: Visual Composer
  von CodeCanyon

Doch an dieser Stelle noch einmal die ausdrückliche Warnung, nutzen Sie Composer nur sehr fokussiert für eine Handvoll Seiten, um die Ladegeschwindigkeit nicht unnötig zu verlängern.

• Erfahre wie du WordPress Templates installierst