Vergleichbarkeit ist eine Aufgabe der Informationsstruktur
Eine umfangreiche Tabelle ist noch kein verständlicher Vergleich. Besucher müssen erkennen, welche Leistungen gleichartig sind, wo Unterschiede bestehen und welche Details für ihre eigene Situation relevant werden könnten. Farbe und Größe helfen bei der Orientierung, ersetzen aber keine präzisen Bezeichnungen.
Für die Konzeption empfiehlt sich zunächst eine fachliche Ordnung: Merkmale benennen, vergleichbare Inhalte zusammenführen und Unterschiede eindeutig zuordnen. Erst danach sollte entschieden werden, wie die Informationen auf Desktop und Smartphone dargestellt werden. So entsteht die mobile Ansicht aus der Aufgabe heraus.
ottonova: Details verfügbar halten
Während seiner Arbeit im Designteam von ottonova war Flo unter anderem für zwei Website-Redesigns verantwortlich. Eine dokumentierte Herausforderung waren mobile Vergleichstabellen. Wichtige Informationen blieben direkt sichtbar; zusätzliche Erläuterungen konnten über Tooltips und einblendbare Details aufgerufen werden. Zum ottonova-Projekt.
Die praktische Frage dahinter ist weiterhin relevant: Was braucht jemand für den Überblick, und welche Erklärung benötigt er für eine genauere Einordnung? Diese beiden Ebenen lassen sich verbinden. Sie sollten jedoch nicht verwechselt werden: Eine verkürzte Übersicht ist kein Ersatz für die vollständige Leistungsbeschreibung.
Fressnapf | petolo: Zuerst den passenden Produktweg finden
Für Fressnapf | petolo arbeitete Flo drei Monate an Konzepten und Designs für die Versicherungswebsite. Dazu gehörten Seiten zu Haftpflicht- und Krankenversicherung, eine übergeordnete Einstiegsseite und eine Darstellung zum besseren mobilen Tarifvergleich. Zum Projekt Fressnapf | petolo.
Das Beispiel zeigt, dass Vergleichbarkeit nicht erst innerhalb einer Tabelle beginnt. Wer noch nicht beim richtigen Produkt angekommen ist, benötigt zunächst einen verständlichen Weg dorthin. Produktnavigation und Tarifdarstellung sollten deshalb zusammen konzipiert werden.
Alteos: Die gesamte Website als zusammenhängendes System
Alteos ist ein langjähriger Kunde von uns. Wir haben die gesamte Website in Webflow umgesetzt und dabei auch die rechtlichen Anforderungen des Projekts berücksichtigt. Diese Erfahrung ergänzt die Arbeit an einzelnen Vergleichsansichten um die Perspektive auf einen vollständigen Auftritt.
Für andere Projekte leiten wir daraus eine Gestaltungsaufgabe ab: Inhalte, Komponenten und Verlinkungen müssen über viele Seiten hinweg verständlich zusammenarbeiten. Eine gut gelöste Vergleichskarte allein hilft wenig, wenn Erläuterungen an anderer Stelle anders bezeichnet werden oder wichtige weiterführende Inhalte schwer auffindbar sind.
Auf kleinen Bildschirmen bewusst priorisieren
Ein mobiles Vergleichskonzept muss beantworten, wie Besucher zwischen Tarifen wechseln, Unterschiede wiederfinden und Details öffnen können. Breite Tabellen lassen sich zwar horizontal scrollen; damit ist ihre Bedienbarkeit aber noch nicht geklärt. Zeilenbezeichnungen und ausgewählte Spalten müssen verständlich zugeordnet bleiben.
Eine mögliche Alternative ist ein gezielter Vergleich weniger ausgewählter Tarife. Eine andere ist eine Übersicht mit klar gegliederten Detailbereichen. Die Entscheidung sollte mit realen Leistungsbeschreibungen geprüft werden. Sehr kurze Mustertexte lassen fast jedes Layout funktionieren und sind deshalb kein ausreichender Test.
Erklärungen benötigen mehr als einen Hover-Effekt
Auf einem Touchscreen steht kein klassischer Maus-Hover zur Verfügung. Zusätzliche Erläuterungen brauchen daher eine bedienbare Alternative. Auch Tastaturbedienung, sichtbarer Fokus, verständliche Beschriftungen und das Schließen eines Hinweises gehören zum Entwurf.
Ein Icon allein erklärt nicht immer, welche Information sich dahinter verbirgt. Wo ein Begriff zentral für das Verständnis ist, kann eine kurze Erklärung direkt im Inhalt die bessere Wahl sein. Lange oder entscheidende Informationen sollten nicht ausschließlich in kleinen schwebenden Hinweisen stehen.
Gestaltung und fachliche Verantwortung zusammenführen
Designteams sollten Leistungsinhalte nicht eigenständig vereinfachen, wenn dadurch ihre Bedeutung verändert werden könnte. Für einen Relaunch empfiehlt sich deshalb ein gemeinsamer Prüfweg für Inhalt, Gestaltung und technische Darstellung. Wer Inhalte fachlich freigibt, sollte auch die mobile Ansicht sehen.
Das ist eine Empfehlung für den Projektablauf, keine Aussage über einzelne interne Freigabeprozesse der genannten Kunden. Der Artikel behandelt Website- und UX-Gestaltung; er ersetzt weder eine Versicherungsberatung noch eine Prüfung konkreter Produktinformationen.
Was wir vor dem Launch prüfen würden
Eine realistische Aufgabe lautet: Finde einen Tarif, erkläre einen relevanten Unterschied und zeige, wo du weitere Informationen erhältst. Solche Aufgaben machen Verständnisprobleme sichtbar, die ein reiner Sichtcheck übersieht. Ergänzend gehören Gerätevarianten, lange Inhalte und geöffnete Detailzustände in die Prüfung.
Ein verbesserter Tarifvergleich kann einen Entscheidungsprozess unterstützen. Welche Auswirkungen er auf Anfragen oder Abschlüsse hat, muss für das jeweilige Projekt gemessen werden. Aus den beschriebenen Designentscheidungen folgt keine pauschale Ergebnisgarantie.
{{callout}}
{{cta}}
Häufig gestellte Fragen
Welche Versicherungsprojekte fließen ein?
Sind alle genannten Websites in Webflow entstanden?
Reicht eine scrollbare Tabelle für mobile Vergleiche?
Dürfen Detailinformationen hinter einem Tooltip stehen?
Welche Ergebnisse werden behauptet?
