Design-Prinzipien

Button-Platzierung: Wo dein CTA wirklich Klicks bekommt

Die Position eines Buttons beeinflusst massiv, ob jemand ihn anklickt. Lerne die Techniken, die tatsächlich funktionieren — basierend auf wie Menschen Webseiten wirklich nutzen.

8 Min Lesedauer Anfänger März 2026

Website-Mockup mit verschiedenen Button-Positionen und Farben, die zeigen wie unterschiedliche Platzierungen die Klickraten beeinflussen

Warum Platzierung alles ist

Hier’s die Realität: Ein perfekt gestalteter Button bringt nichts, wenn ihn niemand sieht. Nutzer folgen Mustern — sie scannen Seiten nach bestimmten Positionen, erwarten CTAs an speziellen Orten und ignorieren Buttons, die nicht in ihr mentales Modell passen.

Wir’re nicht einfach zufällig davon ausgegangen. Die Forschung zeigt, dass die Position eines Buttons bis zu 30% Unterschied in der Klickrate machen kann. Das ist nicht Marketing-Gebrabbel — das sind echte Zahlen aus tausenden Tests.

Designer mit Notizen arbeitet an Button-Platzierungen auf einem Laptop mit mehreren Wireframe-Layouts auf dem Schreibtisch

F-Muster und die obere Hälfte

Nutzer scannen Seiten im F-Muster — horizontal oben, dann runter am linken Rand. Das bedeutet konkret: Die besten Platzierungen für Buttons sind oben rechts, oben links oder direkt nach dem Haupttext. Buttons in der unteren Hälfte der Seite bekommen deutlich weniger Aufmerksamkeit.

Das ist kein Geheimnis mehr. Google, Facebook und Netflix haben das längst rausgefunden. Sie don’t verstecken ihre CTAs — sie platzieren sie an Orten, wo das Auge natürlich hinwandert. Wenn du willst, dass Leute klicken, musst du den gleichen Ansatz nutzen.

Die drei Top-Positionen

Oben rechts: Konvertiert am besten — etwa 35-40% höhere Klickrate als andere Positionen
Direkt unter der Headline: Zweite beste Option — besonders effektiv wenn der Button groß genug ist
Am Ende des Textes: Funktioniert gut für Seiten mit viel Content — der Leser ist dann “ready” zu handeln

Annotiertes Webseiten-Layout zeigt F-Muster-Lesefluss mit hervorgehobenen Button-Positionen und Heatmap-Bereichen hoher Aufmerksamkeit

Vergleich von Button-Größen und Gewichtungen zeigt wie größere, fettere Buttons visuell dominieren und mehr Aufmerksamkeit erhalten als kleinere Varianten

Größe schafft Gewicht

Größere Buttons werden öfter geklickt. Das ist nicht kompliziert — größere Elemente wirken wichtiger und sind leichter zu treffen. Ein Button mit 48px Höhe wird um etwa 25% häufiger geklickt als ein 32px Button. Das ist messbar.

Aber hier’s das Ding: Größe allein reicht nicht aus. Der Button muss auch visuell vom Rest der Seite abheben. Wenn dein Button die gleiche Farbe wie Links hat, ist er praktisch unsichtbar. Du brauchst Kontrast — nicht nur in der Größe, sondern auch in Farbe und möglicherweise Gewicht.

Klein (nicht empfohlen)

32px Höhe, nur für sekundäre Aktionen

Standard (gut)

44-48px Höhe, perfekt für die meisten CTAs

Groß (beste Ergebnisse)

56px+ Höhe, besonders auf Mobile, wo Finger größer sind

Kontext ist entscheidend

Die beste Button-Position ändert sich je nachdem, was deine Seite tut. Eine E-Commerce-Seite mit Produktbildern funktioniert anders als ein Blog mit langen Texten. Eine Anmeldungsseite hat andere Anforderungen als eine Feature-Übersichtsseite.

Auf Seiten mit viel visuellen Content (Fotos, Videos) funktioniert der Button besser, wenn er direkt unter dem Hero-Bild ist. Die Augen sind schon “warm” und fokussiert. Auf Text-Heavy Seiten wie dieser hier? Der Button funktioniert gut am Ende des ersten Absatzes — nachdem du Interesse geweckt hast.

“Ich’ve hunderte von Tests gemacht. Die Nummer eins Fehler, den ich sehe? Buttons die versteckt sind, weil der Designer dachte, sie wären ‘zu auffällig’. Sei nicht subtil. Der Button ist dein Ziel. Mach ihn sichtbar.”
— Sarah, UX-Forscherin

Verschiedene Seitenlayouts nebeneinander zeigen optimale Button-Positionen für E-Commerce, Blog, und Anmeldungsseiten mit visuellen Annotationen

Smartphone-Bildschirm zeigt Button-Platzierung und Größe optimiert für Touch-Interaktion mit großem Tap-Target-Bereich

Mobile ändert die Regeln

Auf Mobile gelten andere Regeln. Menschen scrolleln mit dem Daumen — das bedeutet, dass der Button näher am unteren Rand der Seite sein sollte. Oben rechts funktioniert auf Desktop, aber auf Mobile ist oben rechts tatsächlich schwer zu erreichen.

Plus, der Button muss größer sein. 48px ist das Minimum. Apple und Google empfehlen 44-48px für Tap-Ziele. Manche Studien sagen 56px ist besser. Warum? Weil Finger größer sind als Mauszeiger. Ein Button, der auf Desktop klein und präzise ist, wird auf Mobile vermisst, weil der Nutzer nicht exakt treffen kann.

Mobile Button-Optimierung

Mindestens 48px Höhe, besser 56px
Volle Breite oder fast volle Breite nutzen
Am Ende des sichtbaren Bereichs positionieren, nicht oben
Genug Abstand zu anderen klickbaren Elementen
Hochkontrast-Farbe verwenden

Die Checkliste für perfekte Button-Platzierung

Kurz zusammengefasst — was du tatsächlich umsetzen kannst:

Position

Oben rechts (Desktop) oder unten Mitte (Mobile)
Nach dem Haupttext, wenn viel zu lesen ist
Im F-Pattern-Scan-Bereich platzieren
Nicht in die Ecke verstecken

Design

48px Höhe minimum, 56px auf Mobile
Hochkontrast-Farbe nutzen (nicht gleich wie der Hintergrund)
Klare, kurze Text (3-4 Worte)
Hover-Effekt hinzufügen (zeigt Interaktivität)

Die Wahrheit ist: Buttons sind einfach. Es gibt keine Magie hier. Nutzer erwarten sie an bestimmten Orten, sie brauchen sie groß genug zum Klicken, und sie sollten visuell klar sein. Don’t versuchen, clever zu sein. Sei klar. Sei deutlich. Platziere den Button dort, wo die Nutzer ihn suchen.

Wenn du nur eine Sache aus diesem Artikel mitnimmst: Teste deine Buttons. Was auf deiner Seite funktioniert, könnte auf der nächsten anders sein. Die beste Platzierung ist nicht abstrakt — sie’s konkret, messbar und testbar. Also test es.

Informationen zu diesem Artikel

Dieser Artikel basiert auf allgemeinen Design-Prinzipien und Forschungsergebnissen aus der UX-Community. Während die besprochenen Techniken in vielen Kontexten funktionieren, können die Ergebnisse je nach deinem spezifischen Publikum, deinem Kontext und deinem Design variieren. Wir empfehlen, die Prinzipien zu testen und an deine Situation anzupassen. Jede Seite ist unterschiedlich, und A/B-Tests sind das beste Werkzeug, um zu sehen, was für dein Publikum funktioniert.