Landingpage erstellen: Aufbau & Conversion-Tipps
Zusammenfassung
- Eine Landingpage hat EIN klares Ziel – Ablenkung ist der größte Conversion-Killer
- Der bewährte Aufbau: Hero → Problem → Lösung → Social Proof → CTA
- Psychologische Trigger (Urgency, Social Proof, Loss Aversion) steigern Conversions um 20-50%
- Mobile-First ist Pflicht – über 60% der Besucher kommen vom Smartphone
- Jede Behauptung testen: A/B-Tests zeigen, was wirklich funktioniert
Was ist eine Landingpage?
Eine Landingpage (auch: Landing Page, Zielseite) ist eine eigenständige Webseite mit genau einem Ziel: Besucher zu einer bestimmten Aktion zu bewegen. Im Gegensatz zu normalen Website-Seiten gibt es keine Ablenkungen – keinen Blog-Link, keine umfangreiche Navigation, keine Sidebar.
Landingpage vs. Homepage vs. Produktseite
| Merkmal | Landingpage | Homepage | Produktseite |
|---|---|---|---|
| Ziel | Eine Conversion | Orientierung geben | Produkt verkaufen |
| Navigation | Minimal/keine | Vollständig | Standard |
| Inhalte | Fokussiert auf EIN Angebot | Überblick über alles | Produktdetails |
| Traffic-Quelle | Ads, E-Mail, Kampagnen | Direkteingabe, SEO | Interne Verlinkung |
| Conversion-Rate | 3-10%+ | 1-3% | 2-5% |
| Ablenkungen | Keine | Viele | Einige |
Wann brauchen Sie eine Landingpage?
- Google Ads oder Social Media Ads: Jede Kampagne verdient eine eigene Landingpage
- E-Mail-Marketing: Newsletter-Abonnenten auf spezifische Angebote leiten
- Lead-Generierung: Whitepaper, Webinare, Demos anbieten
- Produktlaunches: Neue Produkte gezielt promoten
- Event-Anmeldungen: Konferenzen, Webinare, Workshops
Warum sind Landingpages so effektiv?
Die Psychologie des Fokus
Wenn Besucher von einer Anzeige auf Ihre Website kommen, haben sie eine klare Erwartung. Eine Landingpage erfüllt genau diese Erwartung – ohne Umwege. Das nennt sich Message Match: Die Botschaft der Anzeige entspricht exakt dem, was auf der Landingpage steht.
Conversion-Raten im Vergleich
| Traffic-Ziel | Durchschnittliche Conversion-Rate |
|---|---|
| Homepage | 1-3% |
| Produktseite | 2-5% |
| Generische Landingpage | 3-6% |
| Optimierte Landingpage | 8-15% |
| Top-Performer | 20-30%+ |
Branchenspezifische Benchmarks
| Branche | Durchschnitt | Gut | Exzellent |
|---|---|---|---|
| B2B Software/SaaS | 3% | 7% | 12%+ |
| E-Commerce | 2,5% | 5% | 10%+ |
| Finanzdienstleistungen | 5% | 11% | 20%+ |
| Gesundheit/Medizin | 3% | 6% | 12%+ |
| Immobilien | 2% | 4% | 8%+ |
| Handwerk/lokale Dienste | 4% | 8% | 15%+ |
| Bildung/Kurse | 4% | 9% | 18%+ |
Der perfekte Landingpage-Aufbau
Die 7 essentiellen Elemente
| Element | Position | Funktion | Must-Have |
|---|---|---|---|
| Hero-Bereich | Oben (Above the Fold) | Aufmerksamkeit, Nutzenversprechen | ✓ |
| Problem-Beschreibung | Nach Hero | Schmerz verstärken | ✓ |
| Lösung | Nach Problem | Ihr Angebot als Antwort | ✓ |
| Features/Benefits | Mittlerer Bereich | Details, Vorteile zeigen | ✓ |
| Social Proof | Vor CTA | Vertrauen aufbauen | ✓ |
| Call-to-Action | Mehrfach platziert | Conversion auslösen | ✓ |
| Trust-Elemente | Footer/Sidebar | Sicherheit vermitteln | ○ |
1. Der Hero-Bereich (Above the Fold)
Der Hero-Bereich ist alles, was Besucher sehen, ohne zu scrollen. Er entscheidet in 3-5 Sekunden, ob jemand bleibt oder geht.
Elemente des perfekten Heros:
- Headline: Größtes Nutzenversprechen in 6-12 Wörtern
- Subheadline: Konkretisierung, wie das Versprechen eingelöst wird
- Hero-Bild/Video: Visueller Beweis oder emotionale Verstärkung
- Primary CTA: Erster Call-to-Action Button
- Trust-Indicator: Logo-Leiste, Bewertungssterne, Siegel
2. Problem-Agitation
Bevor Sie Ihre Lösung präsentieren, verstärken Sie das Problem. Menschen kaufen Lösungen für Schmerzen, nicht für theoretische Verbesserungen.
Techniken:
- Konkrete Szenarien beschreiben ("Kennen Sie das? Sie...")
- Statistiken zur Problemgröße
- Kosten des Nicht-Handelns
- Emotionale Trigger (Frustration, Angst, Verlust)
3. Die Lösung präsentieren
Erst jetzt kommt Ihr Angebot – als logische Antwort auf das Problem. Die Verbindung muss offensichtlich sein.
Struktur:
- 1Was ist die Lösung?
- 2Wie funktioniert sie?
- 3Warum ist sie besser als Alternativen?
4. Features vs. Benefits
| Feature (Merkmal) | Benefit (Nutzen) |
|---|---|
| "24/7 Support" | "Hilfe genau dann, wenn Sie sie brauchen" |
| "256-bit Verschlüsselung" | "Ihre Daten sind sicher wie im Tresor" |
| "30 Vorlagen inklusive" | "In 5 Minuten startklar – ohne Design-Kenntnisse" |
| "5 Jahre Garantie" | "Einmal kaufen, jahrelang sorgenfrei" |
Regel: Features erklären, Benefits verkaufen. Führen Sie immer mit dem Benefit und untermauern Sie mit dem Feature.
5. Social Proof
| Social Proof Typ | Wirksamkeit | Einsatz |
|---|---|---|
| Kundenbewertungen | ★★★★★ | Nahe CTA platzieren |
| Case Studies | ★★★★★ | Für komplexe B2B-Angebote |
| Kundenlogos | ★★★★☆ | Hero oder Trust-Leiste |
| Testimonials | ★★★★☆ | Mit Foto und vollem Namen |
| Nutzerzahlen | ★★★★☆ | "Über 5.000 zufriedene Kunden" |
| Bewertungsportale | ★★★☆☆ | Google-Sterne, Trustpilot |
| Zertifikate | ★★★☆☆ | Footer oder neben CTA |
6. Trust-Elemente
- SSL-Siegel: Für Formulare unverzichtbar
- Geld-zurück-Garantie: Risiko reduzieren
- Bekannte Partner-Logos: Autorität leihen
- Kontaktmöglichkeiten: Telefon, Chat (zeigt: echte Menschen)
- Datenschutz-Hinweise: DSGVO-Konformität
Headlines, die konvertieren
Die Headline ist das wichtigste Element. 8 von 10 Besuchern lesen nur die Headline – nur 2 lesen weiter.
Bewährte Headline-Formeln
| Formel | Beispiel |
|---|---|
| Nutzen + Zeitrahmen | "Verdoppeln Sie Ihre Leads in 30 Tagen" |
| Problem + Lösung | "Schluss mit leeren Warenkörben – So kaufen Besucher wirklich" |
| Zahlen + Ergebnis | "73% mehr Conversions mit einem einzigen Trick" |
| Frage | "Warum verlieren Sie 90% Ihrer Website-Besucher?" |
| How-To | "Wie Sie mit Landingpages 3x mehr Leads generieren" |
| Vergleich | "Der Unterschied zwischen Websites die verkaufen – und solchen, die nicht" |
Gute vs. schlechte Headlines
| ❌ Schlecht | ✓ Besser |
|---|---|
| "Willkommen auf unserer Website" | "In 24h zur Website, die verkauft" |
| "Unsere Dienstleistungen" | "Websites für Handwerker – ab 1.299€, fertig in 2 Wochen" |
| "Qualität ist unser Anspruch" | "97% Kundenzufriedenheit seit 2020" |
| "Jetzt mehr erfahren" | "Kostenloses Angebot in 5 Minuten" |
Psychologische Trigger für mehr Conversions
1. Urgency (Dringlichkeit)
Menschen handeln schneller, wenn die Zeit knapp ist.
Anwendung:
- "Angebot endet in 24 Stunden"
- Countdown-Timer
- "Nur noch heute zum Einführungspreis"
Wichtig: Nur echte Deadlines verwenden – Fake-Urgency zerstört Vertrauen.
2. Scarcity (Knappheit)
Knappe Ressourcen werden als wertvoller wahrgenommen.
Anwendung:
- "Nur noch 3 Plätze frei"
- "Limitiert auf 100 Stück"
- "Exklusiv für Newsletter-Abonnenten"
3. Social Proof
Wir orientieren uns am Verhalten anderer.
Anwendung:
- "Über 10.000 Unternehmen vertrauen uns"
- "4,9 Sterne bei Google"
- Live-Ticker: "Maria aus Berlin hat gerade gebucht"
4. Reciprocity (Reziprozität)
Wer etwas bekommt, fühlt sich verpflichtet, etwas zurückzugeben.
Anwendung:
- Kostenloses E-Book vor der Anfrage
- Gratis-Beratung
- Nützliche Tools oder Rechner
5. Loss Aversion (Verlustaversion)
Menschen fürchten Verluste mehr als sie Gewinne schätzen.
Anwendung:
- "Verpassen Sie nicht..." statt "Profitieren Sie von..."
- "Was kostet Sie jeden Tag ohne optimierte Website?"
- "Diese Fehler kosten Unternehmen 23.000€ pro Jahr"
6. Authority (Autorität)
Experten wird vertraut.
Anwendung:
- Zertifizierungen und Qualifikationen
- Pressemeldungen ("Bekannt aus...")
- Expertenstatus demonstrieren
Trigger-Wirksamkeit im Überblick
| Trigger | Conversion-Uplift | Am besten für |
|---|---|---|
| Urgency + Timer | +15-25% | E-Commerce, Launches |
| Social Proof | +10-20% | Alle Branchen |
| Loss Aversion | +10-15% | B2B, hochpreisige Produkte |
| Scarcity | +8-12% | Events, limitierte Produkte |
| Authority | +5-10% | Beratung, Dienstleistungen |
Der perfekte Call-to-Action
Button-Texte, die funktionieren
| ❌ Generisch | ✓ Spezifisch | ✓✓ Mit Benefit |
|---|---|---|
| "Absenden" | "Angebot anfordern" | "Mein kostenloses Angebot erhalten" |
| "Mehr erfahren" | "Demo ansehen" | "In 2 Minuten verstehen, wie es funktioniert" |
| "Anmelden" | "Kostenlos registrieren" | "Jetzt kostenlos starten – keine Kreditkarte nötig" |
| "Kaufen" | "Jetzt bestellen" | "Risikofrei bestellen – 30 Tage Geld zurück" |
CTA-Design Best Practices
| Element | Best Practice |
|---|---|
| Farbe | Kontrastiert zum Rest der Seite (nicht zwingend rot/orange) |
| Größe | Groß genug zum Tippen auf Mobile (min. 44x44px) |
| Position | Above the Fold UND nach jedem Section |
| Whitespace | Genug Abstand zu anderen Elementen |
| Anzahl | 1 primärer CTA pro Viewport |
| Text | Ich-Form ("Mein Angebot") oder Befehlsform ("Jetzt starten") |
CTA-Platzierung
- Hero-Bereich: Primärer CTA (größte Aufmerksamkeit)
- Nach Problem-Section: Wenn der Schmerz spürbar ist
- Nach Benefits: Wenn der Nutzen klar ist
- Nach Social Proof: Wenn Vertrauen aufgebaut ist
- Footer/Sticky: Immer erreichbar
Formulare, die nicht abschrecken
Die Formel: Weniger = Mehr
| Anzahl Felder | Conversion-Rate | Empfehlung |
|---|---|---|
| 1 Feld (E-Mail) | 100% (Baseline) | Newsletter, einfache Leads |
| 2 Felder | -15% | Grundlegende Leads |
| 3 Felder | -25% | Standard-Kontaktformulare |
| 5 Felder | -40% | Qualifizierte Leads |
| 7+ Felder | -60%+ | Nur bei hohem Wert |
Nur fragen, was Sie wirklich brauchen
| ✓ Wirklich nötig | ❌ Kann später kommen |
|---|---|
| Firmenname | |
| Telefon (wenn Sie anrufen) | Adresse |
| Nachricht/Anliegen | Wie haben Sie von uns erfahren? |
| Name (wenn persönlich) | Branche |
Multi-Step Formulare
Bei mehr als 3 Feldern: Multi-Step Formulare nutzen.
Vorteile:
- Weniger überwältigend
- Sunk-Cost-Effekt (nach Schritt 1 eher fertigstellen)
- Progress-Indicator motiviert
- Qualifizierung der Leads möglich
Typische Schritte:
- 1Was brauchen Sie? (Projektart wählen)
- 2Für wen? (Branche, Unternehmensgröße)
- 3Kontaktdaten (Name, E-Mail, Telefon)
Technische Optimierung
Mobile-First ist Pflicht
| Faktor | Desktop | Mobile |
|---|---|---|
| Traffic-Anteil | 35-40% | 60-65% |
| Conversion-Rate | Höher | Niedriger (oft -30%) |
| Bounce-Rate | Niedriger | Höher bei schlechter UX |
Mobile-Checkliste:
- Buttons groß genug (min. 44x44px)
- Kein horizontales Scrollen
- Lesbare Schrift ohne Zoomen (min. 16px)
- Formularfelder einfach ausfüllbar
- Tap-Targets haben genug Abstand
- Bilder optimiert (WebP, lazy loading)
Ladezeit-Optimierung
| Ladezeit | Conversion-Impact |
|---|---|
| 1-2 Sekunden | Optimal |
| 3 Sekunden | -7% Conversions |
| 5 Sekunden | -20% Conversions |
| 7+ Sekunden | -40% Conversions |
Optimierungsmaßnahmen:
- Bilder komprimieren (WebP, max. 200KB)
- Above-the-Fold-Content priorisieren
- Unnötige Scripts entfernen
- CDN verwenden
- Browser-Caching aktivieren
- Lazy Loading für Bilder below the fold
Core Web Vitals
| Metrik | Gut | Verbesserungswürdig | Schlecht |
|---|---|---|---|
| LCP (Largest Contentful Paint) | < 2,5s | 2,5-4s | > 4s |
| INP (Interaction to Next Paint) | < 200ms | 200-500ms | > 500ms |
| CLS (Cumulative Layout Shift) | < 0,1 | 0,1-0,25 | > 0,25 |
→ Mehr dazu: Core Web Vitals einfach erklärt
A/B-Testing: Was wirklich funktioniert
Was Sie testen sollten
| Element | Potenzial | Testaufwand |
|---|---|---|
| Headline | Hoch | Gering |
| CTA-Text | Hoch | Gering |
| CTA-Farbe | Mittel | Gering |
| Hero-Bild | Mittel | Mittel |
| Formular-Länge | Hoch | Mittel |
| Preis-Darstellung | Sehr hoch | Gering |
| Social Proof Platzierung | Mittel | Gering |
| Page Layout | Hoch | Hoch |
A/B-Test Grundregeln
- 1Nur ein Element pro Test ändern
- 2Statistische Signifikanz abwarten (min. 95%)
- 3Genug Traffic (min. 100-200 Conversions pro Variante)
- 4Lange genug laufen lassen (min. 1-2 Wochen)
- 5Dokumentieren : Was wurde getestet, was war das Ergebnis?
Typische Uplifts
| Test | Durchschnittlicher Uplift |
|---|---|
| Bessere Headline | +10-30% |
| Verkürztes Formular | +15-25% |
| Trust-Badges hinzufügen | +5-15% |
| CTA-Button optimieren | +5-20% |
| Social Proof ergänzen | +10-20% |
| Video statt Bild | +5-25% |
Tools für A/B-Testing
| Tool | Preis | Für wen |
|---|---|---|
| Google Optimize (eingestellt) | Kostenlos | – |
| VWO | Ab 99$/Monat | KMU |
| Optimizely | Enterprise | Großunternehmen |
| Unbounce | Ab 99$/Monat | Marketer |
| Hotjar | Kostenlos/Paid | Heatmaps + Insights |
Häufige Fehler vermeiden
1. Zu viele Optionen
Problem: Paradox of Choice – zu viele Optionen führen zu keiner Entscheidung.
Lösung: Ein primäres Ziel pro Landingpage. Maximal ein sekundärer CTA.
2. Navigation beibehalten
Problem: Jeder Link ist ein Exit-Point.
Lösung: Minimale oder keine Navigation. Nur Logo (ohne Link) und CTA.
3. Unklares Nutzenversprechen
Problem: Besucher verstehen nicht, was sie bekommen.
Lösung: Headline muss in 5 Sekunden beantworten: "Was ist für mich drin?"
4. Fehlender Social Proof
Problem: Niemand will der Erste sein.
Lösung: Mindestens Testimonials, besser: Zahlen + Logos + Bewertungen.
5. Generische Stock-Fotos
Problem: Austauschbare Bilder = austauschbares Angebot.
Lösung: Echte Fotos, Screenshots, individuelle Grafiken.
6. Kein Mobile-Test
Problem: Desktop sieht super aus, Mobile ist unbenutzbar.
Lösung: Mobile-First designen, auf echten Geräten testen.
7. Zu lange Ladezeit
Problem: Jede Sekunde kostet Conversions.
Lösung: PageSpeed Insights nutzen, Bilder optimieren, Scripts minimieren.
Fehler-Checkliste
| Fehler | Check |
|---|---|
| Mehr als 1 Haupt-CTA | ☐ |
| Vollständige Navigation | ☐ |
| Headline ist unklar | ☐ |
| Kein Social Proof | ☐ |
| Stock-Fotos | ☐ |
| Nicht mobile-optimiert | ☐ |
| Ladezeit > 3 Sekunden | ☐ |
| Formular zu lang | ☐ |
| Keine Trust-Elemente | ☐ |
| Keine klare Handlungsaufforderung | ☐ |
Landingpages für verschiedene Ziele
Je nach Conversion-Ziel
| Ziel | Typische Elemente | Formular |
|---|---|---|
| Lead-Generierung | Whitepaper, Webinar, Demo | Name, E-Mail, (Firma) |
| E-Commerce | Produkt-Hero, Preis, Bewertungen | Add-to-Cart Button |
| SaaS Free Trial | Features, Pricing, Demo-Video | E-Mail, Passwort |
| Event-Anmeldung | Datum, Agenda, Speaker | Name, E-Mail, Firma |
| App-Download | Screenshots, Badges, Bewertungen | App Store Links |
| Beratungstermin | Expertise, Prozess, Kalender | Kalender-Widget |
| Newsletter | Preview, Vorteile, Social Proof | Nur E-Mail |
B2B vs. B2C Unterschiede
| Aspekt | B2B | B2C |
|---|---|---|
| Entscheidungsprozess | Lang, mehrere Stakeholder | Kurz, emotional |
| Preisangaben | Oft "auf Anfrage" | Transparent, sofort sichtbar |
| Content-Tiefe | Ausführlich, Daten-getrieben | Kurz, benefit-fokussiert |
| Social Proof | Case Studies, Logos | Reviews, Testimonials |
| CTA | "Demo buchen", "Angebot anfordern" | "Jetzt kaufen", "Kostenlos testen" |
Landingpage-Tools und Ressourcen
Landingpage-Builder
| Tool | Preis | Stärken |
|---|---|---|
| Unbounce | Ab 99$/Monat | A/B-Testing, Templates |
| Leadpages | Ab 49$/Monat | Einsteigerfreundlich |
| Instapage | Ab 199$/Monat | Enterprise-Features |
| Carrd | Ab 9$/Jahr | Einfache One-Pager |
| Webflow | Ab 14$/Monat | Design-Freiheit |
| WordPress + Elementor | Kostenlos/Paid | Flexibilität |
Analyse-Tools
- Google Analytics 4: Traffic, Conversions, User-Verhalten
- Hotjar/Microsoft Clarity: Heatmaps, Session Recordings
- Google Search Console: SEO-Performance
- PageSpeed Insights: Ladezeit-Analyse
Design-Ressourcen
- Figma: Wireframes und Prototypen
- Unsplash/Pexels: Kostenlose Stockfotos (aber besser: eigene!)
- Canva: Grafiken und Social Proof Badges
Fazit: Landingpages, die wirklich konvertieren
Eine erfolgreiche Landingpage ist kein Zufall. Sie basiert auf:
- 1Klarem Fokus : Ein Ziel, keine Ablenkungen
- 2Psychologischem Verständnis : Trigger, die Menschen zum Handeln bewegen
- 3Bewährter Struktur : Hero → Problem → Lösung → Proof → CTA
- 4Technischer Exzellenz : Schnell, mobil-optimiert, fehlerfrei
- 5Kontinuierlicher Optimierung : A/B-Tests, Daten-basierte Entscheidungen
Die Unterschiede zwischen einer mittelmäßigen und einer exzellenten Landingpage können enorm sein: 3% vs. 15% Conversion-Rate bedeutet bei gleichem Traffic 5x mehr Leads oder Verkäufe.
→ [Professionelle Landingpage erstellen lassen](/kontakt)
Weiterführende Inhalte
Brauchen Sie Unterstützung bei Ihrer Website?
Wir helfen Ihnen, mehr Kunden über Ihre Website zu gewinnen.
Das könnte Sie auch interessieren
Webdesign Rhein-Erft-Kreis: Lokale Websites
Professionelles Webdesign für Unternehmen im Rhein-Erft-Kreis. Maßgeschneiderte Websites für Handwerker, Ärzte und lokale Dienstleister in Bergheim, Frechen, Kerpen & Co.
Vertrauen auf Websites: 12 Trust-Elemente
Erfahren Sie, welche Trust-Elemente Ihre Conversion-Rate steigern – von Social Proof über Gütesiegel bis zur optimalen Platzierung.
Kontaktformular optimieren: So steigern Sie Ihre Conversion-Rate
Weniger Felder, mehr Leads: Praxiserprobte Tipps für Kontaktformulare, die tatsächlich ausgefüllt werden.