🧑‍🎨 Die Strategie der optimierten Landingpage Teil 2 – Struktur

Die Ausgangslage

Erinnerst du dich daran, wie du als Kind Sandburgen gebaut hast?

Du würdest den Sand aufhäufen, die Türme formen und sorgfältig den Graben ausschachten.

Nun, das Entwerfen einer Landing Page ist nicht so verschieden – es geht darum, eine Struktur zu schaffen, die nicht nur auffällt, sondern auch der hohen Flut an kritischen Kunden standhält.

So funktioniert´s

In der letzten Ausgabe hast du den perfekten Inhalt für deine Landing Page erstellt. Aber das ist wie ein Ferrari-Motor in einem Go-Kart; ohne die richtige Struktur wird er nicht die Aufmerksamkeit bekommen, die er verdient.

Lass uns loslegen!

Schritt 1: Du fängst nicht damit an, ein eigenes Design entwickeln zu lassen oder selbst zu entwickeln.

Es gibt viele kostenlose Vorlagen für gute Designs. Solange deine Seite keine sehr speziellen Anforderungen hat oder hunderte von Zugriffen pro Monat generiert, kannst du ohne Probleme eines dieser kostenlosen Templates verwenden.

Als UX/UI Designer, dessen Designs täglich von ca. 20 Millionen Menschen in Deutschland genutzt werden, kann ich sagen, dass dein Angebot, die Copy und die Struktur viel wichtiger sind als das Design deiner Landingpage.

So, nachdem ich jetzt ein paar Unsubscribes eingesammelt habe, kann es losgehen. 🤓

Schritt 2: Das Template

Als Werkzeug benutze ich Figma.

Der Vorteil: Figma hat die besten kostenlosen Vorlagen und es gibt eine kostenlose Version.

Der Nachteil: Man braucht auf jeden Fall Einarbeitungszeit. Grundsätzlich kannst du natürlich auch jedes andere Tool verwenden und dort nach Vorlagen suchen. Ich orientiere mich hier an Best Practice.

Eine passende Landingpage findest du hier:

Als Beispiel benutze ich diese Vorlage, die die Landingpage von Justin Welsh kopiert. Es sollte natürlich nicht einfach kopiert werden, aber als Beispiel ist es optimal, weil es gut strukturiert ist:

Dieses Template kannst du nun in Figma öffnen und zu deinen Projekten ziehen.

Schritt 3: Das Template anpassen

Im besten Fall hast du bereits Social Proof für dein Business sammeln können. Diesen kannst du nun in deine Landing Page einbauen.

Social Proof können Testimonials, Videos, Bewertungen, Badges, Awards etc. sein. Wenn du schon etwas gesammelt hast, kannst du die Struktur von Justin Welsh gut übernehmen und mit deinem Text anreichern.

Wenn du noch nichts hast, ist das nicht weiter tragisch und wir werden uns einfach an der Content-Struktur orientieren, die wir beim letzten Mal erstellt haben.

In diesem Fall blendest du die Sections mit dem Social Proof aus und dann sieht deine Struktur ungefähr so aus (Justin Welsh´s Beispiel in Klammern):

1. Headline/Aumerksamkeit

2. Interesse wecken (JW section: Trying to decide if the Content OS is for you?)

3. Wunsch wecken (JW section: Produce more and better content with the Content OS)

4. Erklären was der Kunde bekommt (JW section: What´s in the course?)

5. Vergleich vorher/nachher (Hier kannst du deine Tabelle verwenden oder den text clever in die FAQ Section einarbeiten, indem du suggestive Fragen stellst) (JW section: Testimonials + FAQ)

6. Call to action überall dazwischen + am Ende

In diese Sections trägst du jetzt deine Texte ein, indem du einfach mit der Maus in die Texte klickst und sie mit Hilfe deiner Vorlagen anpasst.

In der nächsten Ausgabe geht es weiter mit der Umwandlung der Figma-Datei in eine echte Landingpage.

Heute haben wir gelernt

• Struktur bedeutet Stärke: Eine gut strukturierte Landing Page ist deine digitale Festung.

• Engagement ist alles: Halte deine Besucher von der Schlagzeile bis zur CTA gefesselt.

• Social Proof: Je mehr desto besser, aber es funktioniert auch ohne.