So steigerst du die Conversion-Rate deiner Landingpage durch Design (2026)

Wir alle mussten schon einmal an einem unordentlichen Schreibtisch oder in einem chaotischen Raum arbeiten. Wir sind sicher nicht stolz auf die Ergebnisse, die wir in einer solchen Umgebung abgeliefert haben.

Genau so ist es, wenn du versuchst, über eine nicht optimierte Landingpage zu verkaufen. Das Ergebnis: Du verkaufst am Ende gar nichts.

Landingpages sammeln Anforderungen aus Vertrieb, Produktentwicklung und Geschäftsführung. Ohne eine klare Struktur für die Antworten, die ein Besucher braucht, kann das schnell im Chaos enden und zu einer geringeren Conversion-Rate der Landingpage führen. Der Bericht von Unbounce für das 4. Quartal 2024, der 41.000 Landingpages analysiert, beziffert die durchschnittliche Conversion-Rate auf 6,6 %. Die Hälfte aller Seiten liegt darunter – eine aufgeräumtere Seite kann also einen echten Unterschied bei jedem Klick machen.

Dieser Leitfaden richtet sich an Marketer und Gründer, die kein eigenes Design-Team haben. Wir zeigen dir, wie du die Conversion-Rate deiner Landingpage durch Design steigerst, indem du die Seite Schritt für Schritt aufräumst. Das erwartet dich:

• Wie eine gute Conversion-Rate für Landingpages aussieht
• Die 10 Design-Hebel, die sie steigern
• Wie du deine Seite auf deinen Traffic abstimmst
• Welches Problem du zuerst beheben solltest
• Eine Checkliste für das Design-Audit

Viel Spaß beim Lesen!

{{freebie}}

‍

Was ist die Conversion-Rate einer Landingpage?

Was misst die Conversion-Rate einer Landingpage eigentlich? Es ist der Prozentsatz der Besucher, die genau die eine Aktion ausführen, für die die Seite erstellt wurde – etwa eine Demo buchen, eine Testversion starten oder ein Produkt kaufen. Es ist der aussagekräftigste Wert für eine Landingpage, da er zeigt, wie viele der Leute, die du mühsam oder durch bezahlte Werbung auf die Seite geholt hast, auch wirklich das getan haben, was du wolltest.

Die entscheidende Aktion hängt von der jeweiligen Seite ab. Lege dich also auf ein Conversion-Ziel fest, bevor du irgendetwas misst. Eine Seite mit zwei gleichwertigen Zielen liefert dir einen Wert, der schwer zu interpretieren ist, da du nicht weißt, welches Ziel das Ergebnis nach oben oder unten beeinflusst.

‍

Manche Teams verfolgen auch Mikro-Conversions, wie einen Klick auf den Haupt-Button oder den Beginn eines Formulars. Das sind zwar nicht die Hauptziele, aber sie zeigen, an welcher Stelle Besucher abspringen, bevor sie die finale Aktion ausführen. Das ist extrem hilfreich, um Design-Probleme zu finden.

Conversion-Rate der Landingpage vs. Conversion-Rate der Website

Die Conversion-Rate der Website umfasst alle Seiten und alle Ziele, während sich die Conversion-Rate der Landingpage auf eine einzelne Seite und ein Ziel konzentriert. Der Website-Wert ist meist niedriger und für eine spezifische Kampagne weniger aussagekräftig, da Blog-Leser und Demo-Interessenten in einen Topf geworfen werden.

Vergleiche deine Landingpage mit anderen Seiten, die ein ähnliches Angebot und die gleiche Traffic-Quelle haben. Sobald du weißt, was du misst, stellt sich die Frage, ob dein Wert gut ist – und das hängt immer vom Kontext ab.

Was ist eine gute Conversion-Rate für eine Landingpage?

Seien wir ehrlich: Die durchschnittliche Conversion-Rate sagt für sich genommen wenig aus, denn eine Seite für eine bezahlte Demo und eine Seite für einen E-Mail-Download verfolgen völlig unterschiedliche Ziele. Der Datensatz von Unbounce für Q4 2024 nennt einen Median von 6,6 % über alle Branchen hinweg und zeigt deutlich, wie stark der Wert je nach Kontext schwankt.

‍

Quelle: Unbounce Conversion Benchmark Report, Q4 2024, geprüft im Oktober 2026. E-Mail-Traffic ist ein Durchschnittswert, die anderen Zeilen sind Mediane.

Wenn du einen Benchmark für eine B2B-SaaS-Landingpage suchst, orientiere dich an dem SaaS-Median von 3,8 % und passe ihn an dein Angebot an. Eine Demo-Anfrage von kaltem Traffic liegt meist niedriger als ein Download von einer warmen E-Mail-Liste. Betrachte diese Benchmarks als Ausgangspunkt, nicht als starres Ziel.

So berechnest du die Conversion-Rate deiner Landingpage

Die Formel lautet: Conversions geteilt durch Besucher, das Ergebnis mal 100. Wenn 2.000 Besucher auf deiner Seite landen und 140 das Formular ausfüllen, liegt deine Conversion-Rate bei 7 %.

Zähle bei B2B-Seiten die Leads, die in einem bestimmten Zeitraum generiert wurden, und verfolge genau diese Gruppe bis zum Geschäftsabschluss. Wenn du eine Januar-Kampagne mit Abschlüssen aus dem März vermischst, wirfst du zwei verschiedene Gruppen in einen Topf und verfälschst deine Ergebnisse.

So nutzt du Benchmarks, ohne sie falsch zu interpretieren

Vergleiche deine Seite nur mit solchen, die dasselbe Angebot und dieselbe Traffic-Quelle haben. Diese beiden Faktoren beeinflussen die Rate nämlich deutlich stärker als die Branche. Eine Demo-Anfrage über bezahlte Kaltakquise und ein kostenloser Download über einen E-Mail-Verteiler lassen sich nicht am gleichen Maßstab messen.

Nutze Benchmarks als Wegweiser für deine Analyse, nicht als Urteil über deine Seite. Liegt eine Seite unter dem Durchschnitt, deutet das auf ein Designproblem hin, das es zu beheben gilt – wie das geht, zeigen die nächsten Abschnitte.

Wie Design die Conversion-Rate deiner Landingpage beeinflusst

Scheitert deine Seite, weil sie schlecht aussieht, oder weil der Besucher nicht weiß, was er als Nächstes tun soll? Das sind zwei völlig verschiedene Probleme, und Design kann nur das zweite lösen. Ein gutes Landingpage-Design steigert die Conversions, indem es vier Aufgaben für den Besucher erfüllt.

• Macht das Angebot leichter verständlich: Ein Besucher, der das Angebot schnell erfasst, muss weniger Mühe in die Entscheidung stecken.
• Macht den Wert sichtbar: Ein Produktvisual oder ein klares Ergebnis gibt dem Besucher etwas zum Bewerten statt eines bloßen Versprechens.
• Macht den nächsten Schritt offensichtlich: Eine klare Aktion nimmt das Rätselraten, was als Nächstes zu tun ist.
• Lässt die Entscheidung sicherer wirken: Nachweise und klare Bedingungen senken das Risiko, das der Besucher vor dem Handeln empfindet.

Das sind Stellschrauben, keine Garantien, denn die Ergebnisse hängen immer von deiner Zielgruppe, deinem Angebot und der Herkunft deines Traffics ab. Eine Designänderung, die bei kalten Paid-Traffic-Besuchern Wunder wirkt, kann bei warmen E-Mail-Kontakten völlig wirkungslos bleiben. Deshalb enthält jeder Vorschlag unten auch eine Methode zur Überprüfung. Die Optimierung der Landingpage-Conversion-Rate (CRO) ist die Methode, diese Elemente einzeln zu testen und zu verbessern.

So gestaltest du die Seite passend zu den Fragen deiner Besucher

Jede Designentscheidung auf deiner Seite beantwortet eine unausgesprochene Frage des Besuchers. Die Reihenfolge dieser Antworten entscheidet darüber, ob er weiterliest. Eine bewährte Standardreihenfolge orientiert sich an fünf Fragen, für die es jeweils eine passende Design-Antwort gibt.

‍

Hier kommt die visuelle Hierarchie ins Spiel, denn sie sorgt dafür, dass die Seite diese Fragen in der richtigen Reihenfolge beantwortet. Das ist ein Standard, keine starre Vorlage: Besucher, die über eine Markensuche oder eine sehr spezifische Anzeige kommen, brauchen vielleicht weniger Schritte als jemand, der noch nie von dir gehört hat.

Die Forschung der Nielsen Norman Group zum Thema Scrollen ist ein guter Hinweis: Nutzer scrollen zwar, aber das entbindet dich nicht davon, die wichtigsten Inhalte sofort sichtbar zu machen. Ein schneller Test: Kneif die Augen zusammen und schau auf deine Seite. Auch bei verschwommener Sicht erkennst du sofort, was den Bildschirm dominiert.

Die 10 Design-Änderungen zur Steigerung der Landingpage-Conversion-Rate

Eine Landingpage lässt sich nicht nach ihrem Aussehen beurteilen, sondern nur nach ihren Conversions. Deshalb erfährst du bei jedem Punkt, was zu tun ist, warum es funktioniert und wie du es überprüfst. Lies am besten erst die Zusammenfassung und dann den Punkt, der dein größtes Problem löst.

‍

1. Mach das Wertversprechen im Hero-Bereich deutlich

Kann ein Fremder innerhalb weniger Sekunden nach dem Aufrufen der Seite erkennen, was du verkaufst, für wen es ist und welchen Nutzen es bietet? Wenn nicht, hat der Rest der Seite kaum eine Chance.

• Was zu tun ist: Formuliere eine ergebnisorientierte Überschrift, ergänze eine Unterzeile, die erklärt, wie du es lieferst, und halte den Haupt-CTA möglichst ohne Scrollen sichtbar. Ersetze vage Sätze wie „Transformiere deinen Workflow“ durch das konkrete Ergebnis, das ein Kunde erhält.
• Warum es funktioniert: Besucher entscheiden schnell, und ein unklarer Hero-Bereich zwingt sie, dein Angebot selbst herauszufinden – was die meisten nicht tun.
• So prüfst du es: Zeige den Hero-Bereich jemandem außerhalb deines Teams fünf Sekunden lang und frage dann, was du verkaufst und für wen es ist. Sobald du genug Traffic hast, führe einen A/B-Test mit Landingpage-Überschriften durch, denn die Überschrift ist das Erste, was jeder Besucher liest.

Hier spielt auch das „Message Match“ eine Rolle. Wenn deine Anzeige einen schnelleren Onboarding-Prozess verspricht, sollte der Hero-Bereich genau damit beginnen – mit denselben Worten und im gleichen visuellen Stil. So muss sich der Besucher nie fragen, ob er auf den richtigen Link geklickt hat.

Luke Wroblewski, Product-Design-Leader und Autor von Mobile First

„Manchmal zwingt dich der Verlust von 80 % deines Bildschirmplatzes dazu, dich auf das zu konzentrieren, was für die Käufer wirklich zählt.“

‍

2. Zeig das Produkt statt Deko

Zeigt dein Hero-Bild dein Produkt oder soll es nur eine Stimmung erzeugen? Besucher können ein abstraktes Versprechen nicht bewerten, aber sie können eine Benutzeroberfläche, ein Ergebnis oder einen Vorher-Nachher-Vergleich sehr wohl einschätzen.

• Was zu tun ist: Zeige die echte Oberfläche oder das echte Ergebnis, kommentiere Screenshots, um die für Käufer wichtigen Funktionen hervorzuheben, und demonstriere das Ergebnis, wo immer du kannst.
• Warum es funktioniert: Ein konkretes Bild beantwortet die Frage „Was bekomme ich eigentlich?“ schneller als ein Absatz Text.
• So prüfst du es: Decke den Text ab und prüfe, ob das Bild allein das Angebot erklärt, und entferne jedes Bild, das nur dekoriert.

Ein gutes Bild räumt auch Zweifel aus. Wenn sich Besucher Sorgen um die Einrichtung machen, zeige ihnen, wie sich das Produkt mit den Tools verbinden lässt, die sie bereits nutzen.

3. Schaffe eine klare visuelle Hierarchie

Besucher lesen eine Landingpage nicht, sie scannen sie – und deine Hierarchie bestimmt, was sie zuerst sehen. Hierarchie entsteht durch das Zusammenspiel von Größe, Kontrast, Abständen und Positionierung.

• Was zu tun ist: Gib der Überschrift die stärkste Schrift, mache den primären CTA auffälliger als jeden sekundären Link, gruppiere zusammengehörige Elemente eng und beschränke jeden Abschnitt auf eine Kernbotschaft.
• Warum es funktioniert: Das Auge folgt Größe und Kontrast, noch bevor es ein einziges Wort liest – eine Seite mit klarer Ordnung lenkt die Aufmerksamkeit daher zur Aktion. Die Gestaltgesetze erklären einen Teil davon, denn nah beieinander platzierte Elemente werden als Gruppe wahrgenommen.
• So prüfst du es: Mache den Blinzeltest und bestätige, dass Überschrift und primärer CTA die beiden Dinge sind, die du noch erkennst.

Designer nutzen zudem einige bewährte Scan-Modelle, um Elemente dort zu platzieren, wo der Blick natürlicherweise hinfällt.

‍

4. Nutze Weißraum und einfache Sprache, um den Aufwand zu minimieren

Bedeutet mehr Inhalt auch mehr Überzeugungskraft? In der Praxis kostet jede zusätzliche Zeile den Besucher Mühe, und diese Mühe ist der wahre Preis des Lesens.

• Was zu tun ist: Sorge für großzügige Abstände um Überschrift, CTA und Kernaussagen, kürze den Text und schreibe auf einem Leseniveau, das die meisten Besucher als leicht empfinden.
• Warum es funktioniert: Abstände trennen Ideen, sodass sich das Auge ausruhen kann, und einfache Wörter lassen Besucher das Angebot erfassen, ohne noch einmal zu lesen.
• So prüfst du es: Prüfe deinen Text mit einem Lesbarkeits-Tool wie der Hemingway App und streiche Sätze, die keinen Punkt ergänzen.

Eine Analyse von Unbounce ergab, dass Seiten mit einer einfachen Lesbarkeit (entsprechend der 5. bis 7. Klasse) eine mittlere Conversion-Rate von 11,1 % aufwiesen, verglichen mit 5,3 % bei Texten auf universitärem Niveau. Dieser Zusammenhang zwischen einfacher Lesbarkeit und höheren Conversions beweist zwar keine direkte Ursache, stützt aber die Annahme, dass Aufwand Conversions kostet. Der Ästhetik-Usability-Effekt zielt in die gleiche Richtung, da Menschen ein klares, gut strukturiertes Design meist als benutzerfreundlicher wahrnehmen.

5. Mache Vertrauen dort sichtbar, wo Zweifel entstehen

Vertrauensbeweise am Ende der Seite kommen erst an, wenn der Besucher sich bereits entschieden hat. Platziere Beweise dort, wo Zweifel aufkommen, um Einwände genau in dem Moment auszuräumen, in dem sie entstehen.

• Was zu tun ist: Platziere ein konkretes Testimonial neben dem CTA, ergänze ein namentlich genanntes Kundenergebnis neben deiner Preisangabe und erkläre neben einem Demo-Formular, was als Nächstes passiert.
• Warum es funktioniert: Eine Aussage wirkt riskanter als dieselbe Aussage mit einem Beleg daneben – Nachweise in der Nähe senken daher das Risiko des Handelns.
• So prüfst du es: Liste die drei größten Zweifel eines Käufers auf und bestätige, dass jeder davon innerhalb eines Bildschirms nach der Aussage, die ihn auslöst, eine Antwort hat.

Konkretes schlägt Allgemeines immer. Ein Satz wie „Toller Service!“ sagt dem Besucher wenig, während ein konkretes Ergebnis mit einer Berufsbezeichnung und einer Zahl etwas ist, dem man glauben kann. Übrigens: Diese Beispiel-Landingpage wurde von magier gestaltet. Wenn du so ein innovatives und durchdachtes Design für deine Website brauchst, weißt du, wo du uns findest!

{{cta}}

‍

6. Entferne Hürden bei CTA und Formular

Stell dir ein Formular vor, das vierzehn Felder abfragt, bevor der Besucher auch nur ein einziges Ergebnis gesehen hat – das fühlt sich eher nach Steuererklärung als nach einer Demo-Anfrage an. Jedes unnötige Feld und jeder ablenkende Link gibt dem Besucher einen weiteren Grund, die Seite zu verlassen.

• Was zu tun ist: Behalte eine primäre Aktion bei, verwende spezifische Button-Texte wie „Demo buchen“ statt „Absenden“, frage nur nach Informationen, die du wirklich brauchst, und ergänze eine Zeile, die sagt, was nach dem Klick passiert. Teile längere Formulare in kurze Schritte auf.
• Warum es funktioniert: Jedes Feld erhöht den Aufwand und jeder konkurrierende Link bedeutet eine weitere Entscheidung – wer sie entfernt, hält motivierte Besucher in Bewegung. Das Hick’sche Gesetz beschreibt denselben Effekt: Mehr Auswahlmöglichkeiten verlangsamen eine Entscheidung.
• So prüfst du es: Nutze Formular-Analytics, um das Feld zu finden, an dem Besucher aufhören, und entferne es oder erkläre, warum du es brauchst.

Die Usability-Richtlinien der Nielsen Norman Group für Webformulare bieten weitere Details, falls du tiefer einsteigen möchtest. Eine gute Faustregel: Sammle die restlichen Informationen erst später, wenn der Besucher den Wert bereits erkannt hat.

7. Optimiere für den Daumen, nicht für den Cursor

Stell dir einen CTA vor, der auf dem Smartphone unter einem Cookie-Banner versteckt ist, sodass der Besucher nicht auf das klicken kann, was er eigentlich soll. Ein responsives Layout ist noch lange keine benutzerfreundliche mobile Erfahrung.

• Was zu tun ist: Halte Text ohne Zoomen lesbar, nutze ein einspaltiges Layout, mache Buttons und Formularelemente leicht antippbar und plane Tap-Ziele von etwa 44 × 44 Pixeln ein – eine Größe, die in den erweiterten WCAG-Vorgaben zur Zielgröße und in Apples Richtlinien empfohlen wird. Teste, dass Overlays und Sticky-Leisten den CTA nie verdecken.
• Warum es funktioniert: Daumen sind ungenauer als Cursor, und jedes Element, das einen Tap blockiert, beendet die Reise des Besuchers.
• So prüfst du es: Schließe deine eigene Conversion auf einem echten Smartphone ab und beobachte, wo dein Daumen zögert.

Die Lücke in den Daten von Unbounce zeigt, warum das wichtig ist. Die meisten Besucher (82,9 %) erreichen Landingpages über mobile Geräte, doch Desktop-Besucher konvertieren im Durchschnitt besser (12,1 % gegenüber 11,2 %). Diese Lücke mag auch unterschiedliche Absichten widerspiegeln, deutet aber darauf hin, dass viele mobile Erlebnisse Conversion-Potenzial verschenken. Welche dieser Hebel am besten zu deinem Traffic passen, hängt davon ab, woher deine Besucher kommen. Der nächste Abschnitt zeigt, wie du die Seite auf die Quelle abstimmst.

8. Stimme die Seite auf den Traffic ab, der den Besucher gebracht hat

Woher kam dein Besucher und was hat die Anzeige versprochen? Eine Seite, die für eine Quelle funktioniert, kann bei einer anderen versagen, da jeder Besucher mit einem anderen Interesse ankommt.

‍

Message Match sorgt für visuelle Kontinuität. Behalte also das Versprechen, die Bildsprache und das Angebot von der Anzeige bis zur Seite bei. Ein Besucher, der einen Bruch bemerkt, geht davon aus, dass der Klick ein Fehler war.

Der Kontext bestimmt auch, was eine gute Rate ist. Unbounce meldet einen Durchschnitt von 19,3 % für E-Mail-Traffic. Eine Seite, die für eine „warme“ Liste gut konvertiert, kann im Vergleich zu diesem Durchschnitt schwach aussehen, obwohl sie für „kalten“ Traffic völlig normal performt.

9. Gestalte den Bildschirm nach dem Klick

Was sieht dein Besucher in den zwei Sekunden, nachdem er den Button gedrückt hat? Die Conversion endet nicht mit dem Klick, und ein gebrochenes Versprechen auf der nächsten Seite macht alles zunichte, was die Seite zuvor gut gemacht hat.

• Das Versprechen einlösen: Wenn der Button „Demo buchen“ sagt, sollte der nächste Bildschirm zeigen, wie man eine bucht.
• Sagen, was als Nächstes passiert: Eine Bestätigung, die den nächsten Schritt benennt, senkt die Unsicherheit, die auf eine Verpflichtung folgt.
• Schnell laden: Eine langsame Dankeseite lässt den Besucher zweifeln, ob das Formular funktioniert hat.
• Daten behalten: Wenn ein Formular fehlschlägt, bewahre das Eingegebene auf, denn erneutes Tippen ist ein Grund aufzugeben.

10. Barrierefreiheit als Conversion-Turbo nutzen

Du denkst vielleicht, Barrierefreiheit sei eine lästige gesetzliche Pflicht und kein Hebel für Wachstum. Dabei beseitigt barrierefreies Design Hindernisse für jeden Besucher – egal ob auf kleinen Bildschirmen, bei hellem Licht oder mit einer langsamen Verbindung.

• Kontrast: Starker Kontrast zwischen Text und Hintergrund macht Überschrift und CTA leichter erkennbar.
• Lesbare Schrift: Eine angenehme Größe und Zeilenlänge verringern den Leseaufwand.
• Tap-Ziele: Leicht antippbare Buttons verhindern, dass mobile Besucher sie verfehlen.
• Klare Beschriftungen und Fehlermeldungen: Sichtbare Labels und verständliche Fehlermeldungen helfen Menschen, Formulare abzuschließen.

Die WCAG-Richtlinien des W3C sind der Standard, an dem man sich orientieren sollte. Wir versprechen nicht, dass jede einzelne Anpassung sofort die Conversion steigert, aber jede davon beseitigt einen Grund, die Seite zu verlassen.

Eine praxisnähere Anleitung zum Gestalten wirkungsvoller, konvertierender Landingpages findest du in diesem Beitrag. Und wenn du das lieber der KI überlassen möchtest, wirf einen Blick auf unseren Leitfaden dazu, wie du mit Claude Landingpages gestaltest.

‍

Design und Entwicklung für Landingpage-CRO koordinieren: Geschwindigkeit, Layout-Verschiebungen und Webflow

Hat dein Designer eine wunderschöne Datei geliefert, die ein Entwickler dann mühsam nachbauen musste? Genau an dieser Schnittstelle verlieren viele Landingpages an Geschwindigkeit und Stabilität, da Designentscheidungen oft bestimmen, wie eine Seite lädt.

Google misst dies anhand von drei Core Web Vitals. Der „Largest Contentful Paint“ überwacht die Ladezeit und sollte bei 2,5 Sekunden oder weniger liegen, der „Interaction to Next Paint“ misst die Reaktionsfähigkeit und sollte 200 Millisekunden oder weniger betragen, und der „Cumulative Layout Shift“ bewertet die visuelle Stabilität mit einem Wert von 0,1 oder weniger – alles gemessen bei echten Besuchen. Die Definitionen findest du auf Googles web.dev, und deine Seite kannst du kostenlos mit Google PageSpeed Insights prüfen.

‍

Hier hilft es, die Seite direkt aus dem Design heraus zu bauen. Wenn ein Team in Figma designt und in Webflow baut, werden Layout, Abstände und Animationen exakt so übernommen, wie sie geplant waren. Ein Staging- und Push-to-Live-Workflow ermöglicht es zudem, Geschwindigkeit und Layout-Stabilität zu prüfen, bevor Besucher eine Änderung sehen. Technisches SEO und Bildoptimierung sind Teil desselben Prozesses, sodass ein Team die volle Kontrolle über die Entscheidungen hat, die sowohl das Aussehen als auch die Geschwindigkeit beeinflussen.

magier deckt beide Bereiche mit einem Abo ab. Nach dem Relaunch der Landingpage für unseren Kunden Jupus konnte das Team in den ersten zwei Tagen über 40 Demo-Termine verbuchen. Bei plancraft führte die kombinierte Design- und Webflow-Arbeit zu einer Conversion-Steigerung von 20 %, während über 30 Seiten neu erstellt und mehr als 200 URLs migriert wurden. Ergebnisse hängen natürlich von der Zielgruppe und dem Angebot ab, aber die Lektion aus unserer Arbeit bleibt: Design- und Entwicklungsentscheidungen funktionieren am besten, wenn sie von einem Team gemeinsam getroffen werden. Schau dir an, wie magier Webdesign angeht, oder erfahre mehr über unsere Webflow-Entwicklung, wenn du dieses Setup für dich nutzen möchtest.

Geschwindigkeit und Layout-Stabilität sind nur ein Teil des Ganzen, denn eine schnelle Seite bringt nichts, wenn sie das falsche Problem löst. Der nächste Abschnitt zeigt dir, wie du entscheidest, wo du anfangen solltest.

Falls du in Deutschland ansässig bist und aktiv nach Webflow-Agenturen suchst, gefällt dir vielleicht diese Liste der besten Agenturen.

‍

Welches Designproblem zuerst angehen?

Die meisten Teams gestalten zuerst den falschen Teil der Seite um, weil sie das korrigieren, was am schwächsten aussieht, und nicht das, was die meisten Besucher kostet. Eine bessere Reihenfolge beginnt mit der Klarheit des Angebots, gefolgt von Vertrauensbeweisen, dann der Reduzierung von Reibungspunkten und schließlich dem Feinschliff – denn jeder Schritt funktioniert nur, wenn der vorherige sitzt.

Diagnose nach Symptomen

Deine Analysedaten zeigen bereits, wo Besucher abspringen – ordne also das Symptom dem passenden Hebel zu.

‍

Unterscheide zwischen Design- und Copy-Problemen

Besucher, die lesen, aber nicht handeln, benötigen meist ein klareres Angebot oder stärkere Argumente – das ist primär eine Frage von Text und Inhalt. Besucher, die gar nicht erst lesen, haben meist ein Problem mit der Hierarchie oder der Übersichtlichkeit – das ist eine Designfrage. Prüfe, zu welcher Gruppe deine Besucher gehören, bevor du jemanden mit der Optimierung beauftragst.

Entscheide, ob du punktuell nachbesserst oder komplett neu gestaltest

Du denkst vielleicht, du brauchst ein komplettes Redesign. Meistens ist das nicht nötig, denn das größte Einzelproblem zuerst zu beheben, ist kostengünstiger und zeigt dir direkt, was die Conversion-Rate wirklich beeinflusst.

Ein Redesign ist dann sinnvoll, wenn die Struktur selbst die Lösung blockiert – etwa bei einem Layout, das kein klares Hauptangebot zulässt, oder einer Vorlage, die fünf konkurrierende Handlungsaufforderungen erzwingt. Hier kann ein Designpartner helfen, da er die Struktur neu aufbauen kann, während du die volle Kontrolle über dein Angebot behältst.

So testest du Designänderungen mit deinem vorhandenen Traffic

Einen A/B-Test mit 200 Besuchern durchzuführen ist, als würde man eine Münze zweimal werfen und das Statistik nennen. Teste zweimal, gestalte einmal neu – so sparst du Geld und lernst mehr.

Ein einfacher Test-Workflow

1. Ausgangswert festhalten: Notiere deine Conversion-Rate, CTA-Klicks, Formular-Abschlüsse, Traffic-Quelle und Geräteverteilung.
2. Den größten Reibungspunkt finden: Nutze Analytics, Scroll-Daten und Aufzeichnungen, die den Datenschutzregeln entsprechen.
3. Eine Hypothese formulieren: zum Beispiel „Die Darstellung der Produktoberfläche im Hero-Bereich erhöht die Zahl qualifizierter Demo-Buchungen.“
4. Eine bedeutende Sache ändern: Teste die Hero-Botschaft, die Platzierung der Nachweise, die Formularlänge oder die CTA-Gestaltung und ändere nicht mehrere Dinge gleichzeitig.
5. Das richtige Ergebnis messen: Eine höhere Klickrate ist kein Erfolg, wenn weniger Besucher das Formular abschließen oder die Lead-Qualität sinkt.
6. Vor dem Rollout validieren: Warte, bis jede Version genügend Conversions hat, decke volle Wochen an Traffic ab und prüfe Mobilgeräte und Desktop getrennt.

Was tun, wenn du wenig Traffic hast

Kleine Websites können A/B-Tests nicht schnell abschließen, aber sie können trotzdem aus ihrem Design lernen. Jede der folgenden Methoden liefert dir Erkenntnisse, ohne dass du Tausende von Besuchern brauchst.

• Der Fünf-Sekunden-Test: Zeige deine Seite fünf Sekunden lang und frage dann, was sie anbietet und für wen sie ist – so testest du den Hero-Bereich direkt.
• Der Blinzeltest: Verwische die Seite und prüfe, ob Überschrift und CTA noch hervorstechen – so testest du die Hierarchie.
• Session-Aufzeichnungen: Beobachte, wo echte Besucher zögern oder auf das Falsche tippen, mit Tools wie Hotjar oder Microsoft Clarity.
• Nutzerinterviews: Bitte fünf Kunden, dir die Seite in eigenen Worten zu erklären, denn ihre Missverständnisse zeigen dir deinen schwächsten Abschnitt.

„Wir führen für jeden Kunden ein kurzes Protokoll darüber, was wir getestet haben, denn der teuerste Fehler ist, dieselbe Idee zweimal zu testen.“

Maximilian Fleitmann

Co-Founder @ magier

‍

Welche Kennzahlen du im Blick behalten solltest

‍

Eine nützliche Faustregel unterscheidet zwischen Problemen bei der Überzeugungskraft und Problemen bei der Benutzerfreundlichkeit. Wenn Besucher nicht klicken, sind das Angebot, die Relevanz oder die Hierarchie vielleicht nicht überzeugend. Wenn sie klicken, aber das Formular nicht absenden, liegt die Hürde im nächsten Schritt. Google Analytics kann diese Ereignisse erfassen, und Test-Tools wie Optimizely oder VWO können den Traffic aufteilen, sobald du genug davon hast.

Wir nennen keine pauschalen Richtwerte für Absprungraten oder Formular-Abschlussraten, da diese stark von deinem Angebot und deiner Traffic-Quelle abhängen. Lege deine eigene Basis fest und vergleiche deine Ergebnisse damit.

Designfehler auf Landingpages, die deine Conversion-Rate senken könnten

Gehe diese Tabelle durch und arbeite an den Punkten, die aktuell auf deiner Seite zutreffen. Nimm jedoch jeden Fehler nicht zu wörtlich, denn alles hängt vom jeweiligen Kontext ab.

‍

Checkliste für das Landingpage-Design-Audit

Kannst du alle diese Fragen mit Ja beantworten? Nutze diese Checkliste, bevor du etwas neu gestaltest, und notiere dir, welche Fragen mit Nein beantwortet werden.

Botschaft und Relevanz

1. Sagt die Überschrift, was du anbietest? Besucher entscheiden schnell, deshalb steht Klarheit an erster Stelle.
2. Passt die Seite zum Versprechen der Anzeige oder des Links? Eine Abweichung lässt Besucher am Klick zweifeln.
3. Sind Vorteile auffälliger als Funktionslisten? Käufer interessieren sich für Ergebnisse, bevor sie sich für Spezifikationen interessieren.
4. Beschreibt der primäre CTA einen sinnvollen nächsten Schritt? Spezifische Beschriftungen wecken klare Erwartungen.

Visuelle Hierarchie

1. Vermittelt der Hero-Bereich den Wert ohne zusätzliches Scrollen? Frühe Klarheit verdient das Weiterscrollen.
2. Schaffen Schrift, Abstände und Kontrast eine klare Leseordnung? Ordnung lenkt das Auge zur Aktion.
3. Hebt sich der primäre CTA von sekundären Aktionen ab? Auffälligkeit signalisiert Priorität.
4. Zeigen Bilder den Wert, statt nur zu dekorieren? Belege schlagen Verzierung.

Vertrauen und Einwände

1. Stehen Kundennachweise in der Nähe deiner wichtigsten Aussagen? Nachweise wirken am besten im Moment des Zweifels.
2. Beantwortet die Seite die wichtigsten Einwände? Unbeantwortete Einwände beenden den Besuch.
3. Sind Preise, Verpflichtungen und nächste Schritte transparent? Überraschungen untergraben das Vertrauen.
4. Sind Testimonials und Ergebnisse konkret und überprüfbar? Konkrete Nachweise sind glaubwürdiger.

Usability und Performance

1. Fragt das Formular nur nach notwendigen Informationen? Jedes Feld erhöht den Aufwand.
2. Sind Beschriftungen, Fehler- und Bestätigungsstatus klar? Klarheit hilft Menschen beim Abschließen.
3. Funktionieren mobile Layouts und Tap-Ziele auf einem echten Smartphone? Die meisten Besucher kommen mobil.
4. Erfüllt die Seite die Schwellenwerte der Core Web Vitals? Geschwindigkeit und Stabilität schützen jeden anderen Hebel.

Fazit

Die Conversion-Rate deiner Landingpage durch Design zu steigern bedeutet, das Angebot klar zu machen, Beweise sichtbar zu gestalten, den nächsten Schritt offensichtlich zu machen und die Seite auf dem Smartphone schnell zu halten. Die Reihenfolge der Fehlerbehebung zeigt dir, wo du anfangen musst. Führe das Audit durch, behebe das größte Problem und teste diese eine Änderung, bevor du etwas anderes anfasst.

Das richtig anzugehen erfordert ständige Aufmerksamkeit, besonders wenn dein Team ohnehin schon ausgelastet ist. Vielleicht befürchtest du, dass ein externes Team zu teuer ist oder dich ausbremst, aber eine feste monatliche Gebühr und ein einziges Team für Design und Webflow-Umsetzung machen beides planbar.

Wenn du Hilfe dabei möchtest, das Audit in eine schnellere, klarere Seite zu verwandeln, buche eine kostenlose Demo mit magier. Wähle die Lösung, die zu deinem größten Problem passt, und fang dort an.