web design uiMay 1, 202610 min read

Das Problem mit der Preisseite

Die meisten Preisseiten sind Conversion-Theater, gebaut von Growth-Teams, die nie etwas anderes designen mussten. Die Preisseite ist der ehrlichste Screen der ganzen Website. Das machen die klaren richtig und das machen die aufgeblähten falsch.

By Boone
XLinkedIn
the pricing page problem

Die Preisseite ist die Seite, auf der das Team zugibt, dass es sich nicht entscheiden konnte, wofür es eigentlich Geld verlangt. Vier Tarife, acht Spalten voller Häkchen, ein „Talk to sales"-Gate in der Mitte, ein Jahres-Toggle versteckt in der Ecke. Das Growth-Team nannte es ein Conversion-Experiment und hat es ausgeliefert. Der Besucher scrollt einmal, klickt zurück und sagt dir nie, warum er gegangen ist.

Wenn ein Nutzer an der Headline nicht erkennen kann, in welchen Tarif er gehört, ist das Produkt das Problem, nicht das Layout. Preisgestaltung ist eine Produktentscheidung, die als Design gerendert wird. Die meisten Preisseiten fahren ein Layout auf, um eine Meinung zu kompensieren, die das Team nie zu Ende gebildet hat.

Die Preisseite ist der ehrlichste Screen der Website

Eine Preisseite zeigt, ob das Team weiß, wer es bezahlt und warum. Jede andere Marketingseite kann sich hinter Copy verstecken. Diese hier nicht.

Eine Homepage verkauft eine Stimmung. Eine Features-Seite verkauft eine Liste. Eine Preisseite muss sich festlegen: Tarife, Zahlen, für wen sie gedacht sind, was sich zwischen ihnen ändert. Jede Unklarheit anderswo taucht hier als vierte Spalte oder als Fußnote wieder auf.

Teams, die das richtig machen, wählen eine Seite, bevor sie ein Layout wählen. Teams, die das nicht tun, fahren einen A/B-Test aufs Layout und nennen es Strategie. „7 Varianten testen" ist ein Ersatz für Produktklarheit, und der Kunde spürt den Unterschied, auch wenn er ihn nicht benennen kann.

Die fünf Fehlermuster

Jede schwache Preisseite scheitert auf eine von fünf erkennbaren Arten. Alle fünf laufen gerade in Produktion.

Voxel-Raster aus vier beschrifteten Kacheln: VIER-TARIF-WAND mit identischen Spalten, HÄKCHENMEER mit gestapelten Zeilen, RECHNERSEITE mit Eingabefeldern und SALES-KONTAKT-GATE mit einer geschlossenen korallenroten Tür
Voxel-Raster aus vier beschrifteten Kacheln: VIER-TARIF-WAND mit identischen Spalten, HÄKCHENMEER mit gestapelten Zeilen, RECHNERSEITE mit Eingabefeldern und SALES-KONTAKT-GATE mit einer geschlossenen korallenroten Tür

Die Vier-Tarif-Wand. Hobby, Pro, Team, Enterprise, alle vier Spalten gleich hoch, mit überlappenden Featurelisten. Vier Tarife heißt meistens: Das Team konnte sich nicht auf drei festlegen und konnte zwei nicht rechtfertigen. Ein Hedge im Gewand der Auswahl.

Das Feature-Häkchenmeer. Acht Spalten, vierzig Zeilen, jede Zelle ein grünes Häkchen oder ein blasser Strich. Power-User brauchen es nicht. Gelegenheitskäufer können es nicht lesen. Das Auge des Besuchers steigt in Zeile vier aus.

Die Rechnerseite als Preisseite. Ein Slider für Seats, ein Toggle für Nutzung, ein Multiplikator für die Region. Der Nutzer designt jetzt die Tarife für das Unternehmen. Rechner funktionieren, wenn die Einheit der Rechner ist. Sie scheitern, wenn das Team zu einem greift, um einer Preisentscheidung auszuweichen.

Das „Talk to sales"-Gate in der Mitte. Drei Tarife sichtbar, der mittlere ein Button mit Fragezeichen statt einer Zahl. Der Nutzer kam, um sich selbst zu qualifizieren, und die Seite hat ihn gerade disqualifiziert. Das Muster signalisiert: Das Team verkauft in Calls, weil es den Wert nicht auf einer Seite formulieren kann.

Die Vergleichstabelle, die niemand liest. Eine aufgeklappte Matrix unter den Karten, vermarktet als „Transparenz". Ist sie nicht. Sie ist das Spec-Dokument, das das Produktteam nicht in Preise übersetzen konnte. Echte Transparenz ist eine klare Meinung.

Preisgestaltung ist eine Produktentscheidung, die als Design gerendert wird

Die klarsten Preisseiten spiegeln eine klare Produktmeinung darüber, wer der Nutzer ist und wofür er zahlt. Die Seite ist kurz, weil die Meinung kurz ist.

Eine Preisseite ist die Hero-Section des Conversion-Pfads. Was du dort sagst, ist das Angebot. Der Besucher liest die Seite als das Produkt, so wie eine Landingpage als die Marke gelesen wird.

Die meisten Preisseiten werden jedes Quartal schwerer, weil das Team Tarife hinzufügt, statt sie zu entfernen. Jedes neue Segment wird zur Spalte. Jeder Sales-Einwand wird zum Sternchen. Zwei Jahre später ist die Seite ein Museum interner Meinungsverschiedenheiten in Häkchen.

Beispiele, die sich den Screen verdient haben

Echte Namen, echte Details an der Oberfläche.

Voxel-Diagramm mit drei Podesten namens HOBBY, TEAM, BUSINESS, die jeweils einen korallenroten Chip tragen, der eine einzelne Entscheidung benennt: SOLO, SEATS, SCALE, mit cyanfarbenen Buttons am Fuß
Voxel-Diagramm mit drei Podesten namens HOBBY, TEAM, BUSINESS, die jeweils einen korallenroten Chip tragen, der eine einzelne Entscheidung benennt: SOLO, SEATS, SCALE, mit cyanfarbenen Buttons am Fuß

Linear. Free, Standard, Plus, Enterprise. Rechnung pro Seat, echte Zahlen above the fold, eine kurze Vergleichstabelle, deren Spalten tatsächlich etwas Unterschiedliches bedeuten. Klare Meinung dazu, für wen Plus gedacht ist, kein Abstecher in „Marketing-Landingpage"-Territorium.

Vercel. Hobby, Pro, Enterprise. Pro Seat ist ehrlich, Bandbreite und Build-Minuten sind sichtbar, der Rechner taucht nur dort auf, wo er zur Einheit passt. Hobby gratis, Pro zwanzig pro Seat, Enterprise ist der Anruf. Drei Entscheidungen, drei Buttons, kein Gate in der Mitte.

Stripe. Der seltene Fall, in dem der Rechner die Preisseite ist. Pro Transaktion ist die Einheit, also ist der Rechner das Produkt. 2,9 % plus 30 Cent ist der Benchmark, den die Branche aus dem Gedächtnis zitiert.

Cursor. Pro Seat, einfach, der AI-Plan als Standard positioniert. Free ist ein echter Tarif, kein Reha-Programm. Pro hat eine Zahl, kein Sternchen. Business ist für Teams, die SSO brauchen.

GitHub. Free, Team, Enterprise. Das Modell hat sich in einem Jahrzehnt kaum verändert und funktioniert noch. Solo zahlt nichts. Team bekommt geteilte private Repos. Enterprise bekommt SAML, SCIM, Audit-Logs. Jeder Tarif entspricht einem echten organisatorischen Zustand.

Superhuman. Dreißig Dollar im Monat und sie meinen es ernst. Kein Gratisplan, kein Lockvogel-Tarif, kein „Starter"-Hedge. Entweder du brauchst das Produkt zu diesem Preis oder eben nicht.

Figma. Seat mit Rolle. Editoren zahlen, Viewer nicht. Dev Mode ist ein Chip an der Seite, kein vierter Tarif, der zwischen Professional und Organization gequetscht wird.

Notion. Pro Seat mit einem AI-Add-on als eigene Zeile. Diese Entscheidung sagt dem Käufer: Die AI ist ein echter Kostenfaktor und ein echtes Feature, keine versteckte Preiserhöhung im Bundle.

Anthropic. Zwei Splits, Entwickler und Unternehmen, mit Nutzungsstufen innerhalb jedes Splits. Der Split ist die Meinung. Ein Solo-Entwickler an der API ist nicht derselbe Käufer wie ein Team auf Claude for Work.

Framer. Das Gegenbeispiel, das die meisten Leser erkennen werden. Tarif-Wildwuchs hat eine Seite erzeugt, die mehr Fragen stellt, als sie beantwortet. Das Produkt ist exzellent, die Preisseite liest sich, als hätte das Team noch nicht zu Ende entschieden, was es ist.

Das namenlose Gegenbeispiel: die SaaS-Preisseite mit 27 Features pro Tarif, die den Käufer in Zeile vier verliert. Du hast diesen Tab geschlossen. Jeder Interessent auch.

Fünf Regeln für eine Preisseite, die eine Meinung ausliefert

Diese Regeln potenzieren sich. Erfüllst du vier, funktioniert die Seite. Erfüllst du zwei, hast du die Vier-Tarif-Wand.

Voxel-Stapel aus fünf geneigten Balken mit den Beschriftungen EINE PRODUKTMEINUNG, EINE ENTSCHEIDUNG PRO TARIF, ECHTE ZAHLEN GANZ OBEN, KEIN RECHNER, WENN DIE EINHEIT NICHT DER RECHNER IST, KEIN SALES-GATE VOR DER QUALIFIZIERUNG
Voxel-Stapel aus fünf geneigten Balken mit den Beschriftungen EINE PRODUKTMEINUNG, EINE ENTSCHEIDUNG PRO TARIF, ECHTE ZAHLEN GANZ OBEN, KEIN RECHNER, WENN DIE EINHEIT NICHT DER RECHNER IST, KEIN SALES-GATE VOR DER QUALIFIZIERUNG

Regel 1: Eine Produktmeinung, formuliert above the fold

Die Seite beginnt mit einem Satz darüber, für wen das Produkt gedacht ist. Nicht der Slogan der Homepage. Ein Satz, mit dem sich der Käufer in drei Sekunden selbst qualifizieren kann. Linear startet mit Team und Workflow. Vercel startet mit Entwickler und Deploy. Superhuman startet mit Preis und Versprechen.

Regel 2: Eine Entscheidung pro Tarif

Jeder Tarif entspricht einer Entscheidung, die der Käufer trifft. Solo oder Team. Fünf Seats oder fünfzig. Self-Serve oder Vertrag. Wenn zwei Tarife für dieselbe Entscheidung existieren, hast du zwei Tarife zu viel. Tarifnamen sollten die Entscheidung beschreiben, nicht Edelsteine.

Regel 3: Echte Zahlen above the fold

Eine Preisseite ohne Zahl above the fold ist ein Lead-Gen-Formular im Kostüm. Der Preis ist der wichtigste Pixel auf dem Screen. Wenn die Seite die Zahl hinter einem „Preise ansehen"-CTA versteckt, verkauft das Team etwas anderes als das Produkt.

Regel 4: Kein Rechner, es sei denn, die Einheit ist der Rechner

Stripe verdient sich einen Rechner, weil die Einheit pro Transaktion gilt. AWS verdient sich einen, weil die Einheit pro Sekunde gilt. Seat-Rechnungen verdienen ihn nicht. Wenn das Team zum Rechner greift, um einer Tarifentscheidung auszuweichen, macht der Rechner die Seite schlechter. Der Beitrag Friction mit Absicht designen zeigt, wann Friction ihren Platz verdient. Friction auf Preisseiten verdient ihn fast nie.

Regel 5: Kein „Contact sales", bevor sich der Nutzer selbst qualifizieren kann

Enterprise bekommt einen Kontakt-Button. Okay. „Contact sales" in den mittleren Tarif zu setzen ist eine Steuer auf die Zeit des Käufers. Wenn das Team den Call braucht, um den Preis zu nennen, hat es die Preisgestaltung nicht abgeschlossen.

Anti-Patterns, die du sofort löschen solltest

Fünf Muster, die in fast jedem Pricing-Audit auftauchen. Jedes ist ein Indiz dafür, dass sich das Team hinter dem Layout versteckt.

Die „Angebot anfragen"-Ausweichmanöver im Fake-Modal. Ein Button, der ein Formular öffnet, statt eine Zahl zu zeigen. Der Nutzer füllt ein Formular aus, um das Privileg zu bekommen, von einem Sales-Rep qualifiziert zu werden.

Der versteckte Jahresabrechnungs-Toggle. Ein kleiner Schalter in der Ecke, der jeden Preis zwischen monatlich und jährlich umschaltet, standardmäßig auf die Zahl, die im Screenshot besser aussieht. Das Prinzip der Progressive Disclosure erklärt, wann man Dinge verbirgt. Das hier ist das Gegenteil.

Der Dark-Pattern-Durchstrich. „Vorher 99 $, jetzt 79 $." Dauerhaft. Der Durchstrich zeigt seit zwei Jahren auf keinen echten früheren Preis mehr. Der Käufer weiß es. Das Vertrauen ist weg.

Das „Most Popular"-Badge auf dem Tarif, den das Team verkaufen will. Echte Beliebtheits-Badges auf Basis echter Daten sind in Ordnung. Badges, die auf den Tarif mit der besten Marge geklebt werden, sind Theater, und Käufer durchschauen den Zug. Der Beitrag Empty States sind das Produkt gilt auch hier: Die Stimme auf verkaufenden Screens muss zur Stimme auf ehrlichen passen.

Tarife, benannt nach Edelsteinen. Bronze, Silber, Gold, Platin. Die Namen sagen dem Käufer nichts darüber, für wen der Tarif gedacht ist. Sie verschwenden die einzige Chance der Seite, den Besucher auf einen Blick zu qualifizieren.

Das Preisseiten-Audit

Voxel-Entscheidungsbaum, der von einem einzelnen korallenroten Fragen-Chip mit der Aufschrift BESTEHT DIE SEITE sechs kleine Voxel-Karten verzweigt, beschriftet mit TARIFE, ZAHLEN, MEINUNG, GATE, BADGE, AUDIT, jede mit einer cyanfarbenen Checkbox
Voxel-Entscheidungsbaum, der von einem einzelnen korallenroten Fragen-Chip mit der Aufschrift BESTEHT DIE SEITE sechs kleine Voxel-Karten verzweigt, beschriftet mit TARIFE, ZAHLEN, MEINUNG, GATE, BADGE, AUDIT, jede mit einer cyanfarbenen Checkbox

Lass jede Preisseite durch diese sieben Fragen laufen. Wenn du nicht jede mit einem klaren Ja beantworten kannst, ist die Seite nicht fertig.

  1. Kann ein Erstbesucher seinen Tarif in unter zehn Sekunden wählen? Keine Tour, kein Scrollen, keine Matrix. Headline plus drei Karten sollten reichen. Wenn sie die Tabelle brauchen, haben die Karten versagt.
  2. Gibt es für mindestens einen Tarif eine echte Dollarzahl above the fold? „Kontaktiere uns" überall ist eine Kontaktseite im Kostüm, keine Preisseite.
  3. Beschreibt jeder Tarifname die Entscheidung, nicht das Metall? „Solo", „Team", „Enterprise" schlagen „Bronze", „Silber", „Gold". Wenn sich deine Tarifnamen austauschen ließen, ohne die Bedeutung zu ändern, leisten sie keine Arbeit.
  4. Ist die Vergleichstabelle kurz genug, um sie auf einem Screen zu lesen? Wenn sie scrollt, hat sie verloren. Die Toleranz des Käufers ist ein Screen, eine Sekunde pro Zeile.
  5. Funktioniert die Seite ohne den Toggle? Jährlich oder monatlich sollte eine klare Wahl sein, kein Versteckspiel. Standardmäßig gilt der Preis, den das Team schriftlich verteidigen würde.
  6. Ist das „Most Popular"-Badge vertretbar? Wenn das Team keine Daten dahinter vorweisen kann, ist das Badge Theater, und der Käufer ist einen Schritt davon entfernt, es zu durchschauen.
  7. Ist „Contact sales" für Enterprise reserviert? Überall sonst ist es Friction, die die Seite nicht braucht.

Eine Seite, die diese sieben besteht, ist eine, der der Käufer vertraut. Eine Seite, die an einer davon scheitert, ist die, die der Käufer verlassen hat, ohne dir zu sagen, warum. Der Beitrag The Anti-Dashboard wendet dieselbe Disziplin auf Produktoberflächen an, und der Artikel zu den Webdesign-Prinzipien zeigt, wie der Rest der Marketingseite nachzieht.

Geschwindigkeit gehört zur Seite

Eine Preisseite, die drei Sekunden zum Rendern braucht, hat den Besucher verloren, bevor die Karten gezeichnet waren. Performance ist Teil der Preisentscheidung, keine separate Engineering-Aufgabe. Der Beitrag Speed is the Brand erklärt, warum Ladezeit ein Markenattribut ist. Preisseiten bestrafen Langsamkeit härter als jede andere Oberfläche der Website.

Die saubersten Preisseiten rendern schnell, weil sie weniger tun. Drei Karten, eine kurze Tabelle, ein CTA. Kein Logo-Marquee, kein automatisch startendes Video. Die Meinung ist die Seite, und die Seite wiegt deshalb weniger.

Häufig gestellte Fragen

Wie viele Preistarife sollte ein SaaS haben?

Drei für die meisten, zwei für manche, vier nur, wenn jeder Tarif eine klar andere Entscheidung abbildet. Ab vier verwässert jede Spalte den Rest der Seite. Ein fünfter Tarif heißt meistens, dass sich das Team nicht festgelegt hat, für welchen Käufer das Produkt gedacht ist.

Sollte eine Preisseite echte Preise zeigen oder sie hinter „Contact sales" verstecken?

Zeige echte Preise für jeden Tarif, in den der Käufer per Self-Serve einsteigen kann. Reserviere „Contact sales" für echtes Enterprise, wo der Deal einen Vertrag, Procurement und eine individuelle Integration erfordert. Self-Serve-Preise hinter einem Sales-Gate zu verstecken signalisiert, dass das Team dem Preis nicht traut.

Manchmal, aber nur, wenn das Badge echtes Kundenverhalten widerspiegelt. Badges, die auf den Tarif mit der besten Marge geklebt werden, erziehen den Käufer dazu, der Seite zu misstrauen. Der Zusammenhang zwischen Brand-Identity-Design und Preisen ist wichtig: Ein unehrliches Badge kostet mehr Vertrauen, als es Conversion bringt.

Wähle die Meinung, dann liefere die Seite aus

Die meisten Preisseiten scheitern nicht, weil das Layout falsch ist. Sie scheitern, weil das Team nicht zu Ende entschieden hat, wofür das Produkt da ist. Die Seite liegt stromabwärts der Produktmeinung. Kein Variantentest der Welt schließt diese Lücke.

Die Seiten, die 2026 funktionieren, sind kurz, meinungsstark und offensichtlich. Linear, Vercel, Stripe, Cursor, GitHub, Superhuman, Figma, Notion. Keine liefert eine Vier-Tarif-Wand aus. Keine versteckt die Zahl. Keine bittet den Käufer, seinen eigenen Tarif zu designen. Sie haben sich für eine Seite entschieden, und die Seite trägt diese Entscheidung.

Wenn du ein Team willst, das die Preisseite als Produktentscheidung designt statt als Growth-Experiment, hire Brainy. Wir liefern Preisoberflächen, die zur Marke passen und den Käufer in unter zehn Sekunden qualifizieren.

Want a pricing page that ships an opinion instead of four indecisive tiers? Brainy designs pricing pages as a product decision, not a growth experiment.

Get Started

More from Brainy Papers

Keep reading