Zum Inhalt

Was braucht eine Landingpage nach dem Social-Media-Klick?

Eine Social-Media-Landingpage soll die angekündigte Leistung verständlich fortsetzen und den passenden nächsten Schritt ermöglichen. Besucher sollten erkennen, für wen das Angebot gedacht ist, was tatsächlich enthalten ist und was nach einer Anfrage passiert. Plane die Seite deshalb vom konkreten Beitrag oder der Anzeige bis zur Eingangsbestätigung. Der Aufbau unten enthält Texte und Formularideen für einen fiktiven Anbieter. Er ist eine Arbeitsvorlage und keine Zusage einer bestimmten Anfrage- oder Abschlussquote.

Setze die Botschaft fort, mit der jemand ankommt.

Lege den verweisenden Inhalt neben den ersten Seitenabschnitt. Wenn ein Reel die Vorbereitung einer Büro-Neugestaltung erklärt, sollte die Zielseite dieses Vorhaben erkennbar aufgreifen. Eine allgemeine Startseite mit anderen Leistungen kann zusätzliche Suche verlangen. Entscheidend ist, ob Besucher die angekündigte Information tatsächlich finden und ihren nächsten Schritt verstehen.

Notiere dazu einen einfachen Satz: Diese Seite ist für Menschen, die … Sie sollen nach dem Lesen … Dieser Satz hilft, Inhalte auszuwählen und Ablenkungen zu erkennen. Ein Besucher muss nicht zuerst die komplette Unternehmensgeschichte lesen, wenn er wissen möchte, ob sein konkretes Vorhaben zu eurem Angebot passt.

Wenn Besucher nach dem Reel unterwegs aussteigen, hilft die Diagnose der gesamten Strecke: Den Weg vom Reel bis zur Anfrage prüfen.

Baue die Seite entlang der Fragen vor einer Anfrage auf.

Die folgende Struktur gehört zu einem fiktiven Anbieter von Büroplanung. Die Überschriften können als Ausgangspunkt für eigene Texte dienen. Ersetze die Angaben durch euren tatsächlichen Leistungsumfang. Du brauchst nicht für jeden Punkt einen großen Bildabschnitt; mehrere kurze Antworten können auch zusammenstehen.

Fiktiver Seitenaufbau: Beratung für die Neugestaltung eines Büros
BereichMögliche ÜberschriftWas konkret daruntersteht
EinstiegEin Büro, das zu eurer Arbeit passt.Wir besprechen die Neugestaltung bestehender Büroräume. Beschreibe uns eure Ausgangslage, damit wir den passenden nächsten Schritt klären können.
EignungWann ein Gespräch zu eurem Vorhaben passt.Beispielsweise, wenn die Nutzung sich verändert hat oder vorhandene Flächen neu geordnet werden sollen. Tatsächliche Grenzen und nicht übernommene Aufgaben gehören dazu.
LeistungWas wir gemeinsam klären.Welche vorhandenen Informationen ausgewertet werden und welche Aufgabe das erste Gespräch hat. Zusätzliche Planungsschritte nur nennen, wenn sie angeboten werden.
VertrauenSo gehen wir an ein Raumvorhaben heran.Ein freigegebener Arbeitsablauf oder ein belegtes Projektbeispiel. Fiktive Entwürfe werden ausdrücklich als Demonstrationen gekennzeichnet.
AnfrageBeschreibe uns euer Vorhaben.Ein verständliches Formular mit den Informationen, die für die erste Bearbeitung gebraucht werden.
ErwartungWas nach deiner Nachricht passiert.Wer die Anfrage prüft und wie die Rückmeldung erfolgt. Keine sofortige Terminbuchung oder feste Reaktionszeit versprechen, wenn das nicht zum tatsächlichen Ablauf gehört.

Frage nach dem nächsten Schritt, nicht nach dem vollständigen Projekt.

Entscheide für jedes Feld, wofür die Antwort benötigt wird. Ein erster Kontakt muss noch keine vollständige Planungsgrundlage liefern. Wenn ein Detail erst später sinnvoll geklärt werden kann, darf es bis dahin offenbleiben. Erkläre ungewöhnliche Fragen unmittelbar beim Feld. Kennzeichne Pflichtangaben eindeutig und stimme den Umfang mit den Personen ab, die Anfragen bearbeiten.

Beschrifte die Felder verständlich und verbinde die Beschriftung technisch mit dem jeweiligen Eingabeelement. W3C-WAI beschreibt diese Zuordnung als Grundlage dafür, dass der Zweck eines Feldes erkennbar ist und Hilfstechnologien die Beschriftung richtig verwenden können. Für Besucher sollte die Bezeichnung auch während der Eingabe auffindbar bleiben.

Fiktives Anfrageformular: Jedes Feld braucht eine Aufgabe
FeldWofür es dientHinweis im Muster
Dein NameDie Person bei einer Rückmeldung ansprechen.Die gewünschte Anrede wird nicht durch einen langen Fragenblock ersetzt.
E-Mail für die RückmeldungAuf das konkrete Anliegen antworten.Eine verständliche Fehlermeldung erklärt, wenn die Eingabe unvollständig ist.
Worum geht es bei eurem Vorhaben?Das Anliegen vor der ersten Rückmeldung einordnen.Zum Beispiel: Was soll sich verändern und was ist bereits bekannt?
Wo findet das Vorhaben statt?Prüfen, ob der Ort für die angebotene Leistung relevant ist.Nur abfragen, wenn die Ortsinformation für die erste Bearbeitung gebraucht wird.
Telefonnummer, freiwilligEinen gewünschten telefonischen Austausch ermöglichen.Nur ergänzen, wenn dieser Kontaktweg tatsächlich angeboten und betreut wird.

Beschreibe, was der Klick tatsächlich auslöst.

Ein Button wie „Vorhaben anfragen“ beschreibt den Vorgang genauer als ein unbestimmtes „Weiter“. Der Text daneben kann sagen, dass zunächst eine Nachricht versendet wird und noch kein Beratungstermin entsteht. Falls die Seite stattdessen direkt einen Termin bucht, muss sie genau diesen Vorgang erklären. Inhalt und technische Funktion müssen übereinstimmen.

Nach dem Absenden braucht es eine verständliche Rückmeldung zum tatsächlichen Ergebnis. Die W3C-WAI-Empfehlungen nennen sowohl Erfolgsmeldungen als auch hilfreiche Fehlerhinweise. Ein Hinweis sollte erklären, was passiert ist und wie ein Eingabefehler behoben werden kann. Eine grüne Farbe allein vermittelt diese Information nicht vollständig.

Teste die gesamte Strecke auf einem echten Smartphone.

Beginne bei dem Inhalt, aus dem der Besucher kommt, und folge demselben Link. Lies die Seite ohne Vorwissen. Öffne dann das Formular mit der Bildschirmtastatur und durchlaufe es mit abgestimmten Testdaten. Prüfe anschließend mit dem zuständigen Team, ob der Testeingang angekommen ist und richtig eingeordnet werden kann.

Teste Erfolg und Fehler getrennt. Lass beispielsweise ein Pflichtfeld leer und korrigiere die Eingabe anschließend. Verliert die Seite dabei bereits geschriebene Angaben? Ist die Fehlermeldung noch sichtbar, wenn die Tastatur geöffnet ist? Eine Testübermittlung sollte als Test erkennbar sein und keine unbeabsichtigte Kontaktserie auslösen.

Plane die Bearbeitung hinter dem Formular mit.

Eine Seite ist nicht mit dem Absende-Button abgeschlossen. Lege fest, wer eingehende Anliegen sichtet, welche Informationen übernommen werden und wie die nächste Aufgabe dokumentiert wird. Eine automatisierte Bestätigung ersetzt keine Bearbeitung. Auch eine Verbindung zu einem CRM muss für den konkreten Ablauf eingerichtet und mit einem Testeingang geprüft werden.

Die Entscheidung für eine technische Umsetzung folgt diesem Ablauf. Eine bestimmte Software oder ein zusätzlicher Dienst ist nicht schon deshalb verbunden, weil er auf einer Website erwähnt wird. Halte gewünschte Übergaben und tatsächliche Funktionen auseinander. So lässt sich später prüfen, ob Inhalte, Formular und interne Bearbeitung gemeinsam funktionieren.

Wie die Bearbeitung nach dem bestätigten Formulareingang weitergeht, zeigt dieser Ablauf: Eingehende Anfragen mit Zuständigkeit und nächstem Schritt bearbeiten.

Häufige Fragen.

Brauchen wir für jedes einzelne Reel eine neue Landingpage?

Nicht zwangsläufig. Mehrere Inhalte können dieselbe Seite sinnvoll vorbereiten, wenn Angebot, Anliegen und nächster Schritt zusammenpassen. Eine neue Seite ist dann hilfreich, wenn eine andere Frage oder Leistung eine eigenständige Erklärung benötigt.

Sollten Telefonnummer und Budget immer Pflichtfelder sein?

Das ergibt sich aus der tatsächlichen Bearbeitung, nicht aus einem allgemeinen Formularmuster. Prüfe, welche Information vor einer ersten Rückmeldung wirklich benötigt wird. Wenn eine Angabe freiwillig ist, muss das für Besucher klar sein.

Woran erkennen wir, ob das Formular funktioniert?

Eine sichtbare Bestätigung reicht als technische Prüfung nicht aus. Verfolge einen abgestimmten Test vom Absenden bis zum tatsächlichen Eingang und zur richtigen Zuordnung. Prüfe zusätzlich fehlende und fehlerhafte Angaben sowie die Bedienung auf dem Handy.

Quellen und weiterführende Informationen.

  1. W3C WAI: Formularfelder verständlich beschriften

    Primärquelle zur Zuordnung von Beschriftungen und Eingabeelementen. Das Formular und der Seitenaufbau dieses Beitrags sind eigene redaktionelle Muster.

  2. W3C WAI: Erfolg und Fehler bei Formularen erklären

    Primärquelle für verständliche Rückmeldungen nach einer Formulareingabe. Die konkreten Meldungstexte müssen zur tatsächlich eingerichteten Funktion passen.

Weiterlesen und vertiefen.

Alle Beiträge ansehen

Wie sieht das für dein Unternehmen aus?

Wir besprechen deinen Auftritt, deine Ziele und die Aufgaben, bei denen du Unterstützung suchst.

Über dein Vorhaben sprechen