HubSpot verabschiedet sich von Orange: Wie Barrierefreiheit das Design des CRM-Systems verändert hat

Das neue HubSpot-Theme ist nicht nur eine Überarbeitung des Designs. Dahinter steckt ein komplett neu entwickeltes Designsystem – und eine Entscheidung, die letztendlich auf WCAG zurückzuführen ist.

Stand: 31. August 2026 HubSpot hat eine neue Benutzeroberfläche Und die orangefarbenen Schaltflächen sind verschwunden. Für viele Nutzer war das am schwersten zu akzeptieren: Orange war HubSpot. Der Grund für die Entscheidung ist jedoch interessanter als die Entscheidung selbst. Diese Farbe erfüllte die WCAG-Kontrastanforderungen nicht. Es ist ein Zeichen für etwas Tieferliegendes. HubSpot verändert die Art und Weise, wie Nutzer mit dem Produkt interagieren, und musste dafür die visuellen Grundlagen der Plattform neu gestalten. Barrierefreiheit ist einer der Gründe dafür, wie das Unternehmen offen erklärt.

Woher der Wandel kommt

Ausgangspunkt ist eine Beobachtung von HubSpot über sich selbst: Jahrelang verlangte Software von den Nutzern etwas, bevor sie ihnen etwas zurückgab. Man musste das Tool erst erlernen, sich zurechtfinden und herausfinden, wie man Aufgaben erledigt. Die Verantwortung, den Nutzen aus dem Produkt zu ziehen, lag beim Anwender selbst.

Das erklärte Ziel ist es, dieses Verhältnis umzukehren: ein Produkt, das das Wesentliche anzeigt, ohne dass man danach suchen muss, wobei KI in den Arbeitsablauf integriert ist und nicht als separate Funktion hinzugefügt wird.

Der Plan läuft in zwei Phasen ab:

  • Phase 1 – die visuelle Auffrischung , ist bereits live. Ein leichteres Erscheinungsbild, eine klarere Typografie, bewusstere Abstände und leichtere Überschriften, damit der Inhalt selbst im Mittelpunkt steht.

  • Phase 2 – die Neugestaltung der Funktionsweise des Produkts Die Einführung erfolgt schrittweise über die nächsten sechs Monate.

Die Überarbeitung ist also kein bloßes Redesign um seiner selbst willen: Sie bildet das Fundament für alles Weitere. HubSpot hat sich entschieden, sie zuerst und schrittweise einzuführen, damit sich die vollständige Neugestaltung vertraut anfühlt und nicht abrupt wirkt. Und genau hier kommt die Barrierefreiheit ins Spiel.

Was ändert sich und wann?

  • 30. Juni 2026 — optionale öffentliche Betaversion

  • 31. August 2026 — automatische Bereitstellung für alle Benutzer

Ändern: Farben, Typografie, Eckenradien, Symbole, Abstände, Erhebungen und Bewegung.
Unverändert: Navigation, Struktur, Arbeitsabläufe und Berichtslogik. Es gibt nichts neu zu lernen.

Warum überhaupt die Farben und die Benutzeroberfläche ändern?

HubSpots Antwort ist technischer Natur und weniger ästhetisch.

Das Designsystem der Plattform war fast zehn Jahre lang nicht aktualisiert worden. In dieser Zeit wuchs das Produkt auf Hunderte von Apps an, jede mit leicht unterschiedlichen Komponenten, Farben und Interaktionsmustern. Deshalb verhielt sich ein Dropdown-Menü in einer App anders als dasselbe Dropdown-Menü in einer anderen – und deshalb wurde der Dunkelmodus nie eingeführt.

In den vergangenen zwei Jahren hat das Unternehmen das gesamte System von Grund auf neu aufgebaut und Filter, Tabellen, Modalfenster und alle anderen Bausteine standardisiert. Das neue Design ist die visuelle Umsetzung dieses Systems.

Laut HubSpot ist der Abschluss dieser Migration die Voraussetzung für die Veröffentlichung von drei Dingen: Dunkelmodus, eine erweiterte Auswahl an Designs und volle Produktzugänglichkeit Die

Hier ist ein wichtiger Punkt, den man sich genauer ansehen sollte. Barrierefreiheit wurde nicht als nachträglich hinzufügbare Funktion betrachtet, sondern als etwas, das einen kompletten Neuaufbau der visuellen Infrastruktur erfordert. Wenn Hunderte von Komponenten sich jeweils unterschiedlich verhalten, ist es unrealistisch, sie einzeln barrierefrei zu gestalten.

Der orangefarbene Koffer

Nun folgt die wichtigste Entscheidung – und diejenige, gegen die sich die Nutzer am heftigsten gewehrt haben.

Orange war die charakteristische Farbe von HubSpot für die primären Aktionsschaltflächen. Im neuen Design ist sie verschwunden. Der Grund: wie vom Unternehmen angegeben: Orange auf Weiß erfüllt nicht den von WCAG 2.1 Stufe AA geforderten Mindestkontrast. was das Lesen für Menschen mit Sehbehinderungen erschwert.

HubSpot versuchte, den Farbton abzudunkeln. Um jedoch ein ausreichend dunkles Orange zu erzielen, würde die Farbe braun werden und ihre ursprüngliche orange Farbe verlieren. Daher wurde entschieden, sie aus den primären Aktionen zu entfernen, mit der Option, sie später über alternative Designs wieder einzuführen.

Diese Entscheidung verdient eine genauere Betrachtung: Ein Unternehmen mit enormer Markenbekanntheit hat akzeptiert, auf seine charakteristische Farbe bei einem zentralen Interface-Element zu verzichten, weil es eine Anforderung an Barrierefreiheit nicht erfüllte.

Die Spannung zwischen Markenidentität und Compliance ist real und wird üblicherweise anders gelöst – die Farbe wird beibehalten und das Problem aufgeschoben. Hier verlief es anders.

Die Neugestaltung betrifft die Benutzeroberfläche von HubSpot, nicht die Inhalte, die Sie mit HubSpot veröffentlichen.

  • Der Backend — was Sie innerhalb des CRM arbeiten sehen — profitiert von dem Update.

  • Der Frontend — Ihre Website, Landingpages, E-Mails und Formulare, die Sie mit HubSpot erstellen und die Ihre Nutzer erreichen — bleiben genau so zugänglich, wie Sie sie gestaltet haben.

Ein aktualisiertes Design im CRM macht eine Landingpage nicht barrierefrei, wenn sie zu wenig Kontrast bietet, ein Formular ohne zugehörige Beschriftungen enthält oder ein Bild ohne Alternativtext aufweist. Genau diese Seiten fallen unter die Bestimmungen der europäischen Barrierefreiheitsrichtlinie.

Barrierefreiheit ist mittlerweile Standard in der Geschäftspraxis.

Eines ist bemerkenswert: In der gesamten Kommunikation von HubSpot wird Barrierefreiheit nie als gesetzliche Verpflichtung dargestellt. Es wird weder von Strafen noch von Fristen oder Anforderungen gesprochen. Sie erscheint vielmehr als Teil einer Produktentscheidung – neben dem Dunkelmodus, anpassbaren Designs und der einheitlichen Komponentengestaltung.

Das ist ein Zeichen von Reife. Barrierefreiheit entfernt sich von der reinen Pflichterfüllung und rückt in den Bereich der Nutzererfahrung, wo sie schon immer hingehört hat.

Und der orangefarbene Fall verdeutlicht dies besser als jede Grundsatzerklärung: Unzureichender Kontrast benachteiligt nicht nur Menschen mit Sehbehinderung. Er benachteiligt jeden, der bei hellem Sonnenlicht arbeitet, jeden, der einen billigen Monitor benutzt, und jeden, der am Ende eines langen Tages auf die Benutzeroberfläche schaut. Gut lesbare Schaltflächen verbessern die Benutzererfahrung für alle, nicht nur für eine Minderheit.

Wenn Barrierefreiheit auf diese Weise konzipiert wird – als eine Einschränkung, die die Gesamtqualität erhöht, und nicht als eine zu erfüllende Aufgabe –, dann hört sie auf, Kosten zu verursachen und wird zu dem, was sie schon immer war: gutes Design.

Prüfen Sie die Barrierefreiheit Ihrer Website kostenlos mit Eye-Able®!

Filter

Filter nach Kategorie

Bestätige nach Auswahl der Kategorien deine Eingabe mit dem Button am Ende der Liste

Filter zurücksetzen

Barrierefreiheit und Datenschutz: Vertrauen in der digitalen Welt

Geschichte lesen

Zurück an die Uni: Eye-Able® und der Weg zu einer inklusiveren Bildungslandschaft

Geschichte lesen
In the picture on the background of the Eye-Able design the two company names "dotfly" and "Eye-Able" are to be seen.

Grünes Internet: Der Zusammenhang von Barrierefreiheit und Nachhaltigkeit

Geschichte lesen
The picture shows a woman in a wheelchair wearing VR glasses.

Was bringt digitale Barrierefreiheit überhaupt? Die Fakten schwarz auf weiß – Teil 2

Geschichte lesen
The picture shows a woman in a wheelchair wearing VR glasses.

Was bringt digitale Barrierefreiheit überhaupt? Die Fakten schwarz auf weiß

Geschichte lesen
A person in a wheelchair has thrown a ball into the air with their left hand. The ball is already in the air and the person is pointing upwards with their left index finger. In the background, the crowd in a stadium applauds while a sporting event is shown on a large screen. The person is wearing a red sports jersey.

Jenseits von Stereotypen? Darstellung von Behinderungen in den Medien

Geschichte lesen
Es ist eine Straßensperrung zu sehen, welche eine Straße Richtung Strand blockiert. Auf der Sperrung hängt ein Schild, auf dem "Straße gesperrt" auf englisch steht. Im Hintergrund sind Sanddünen und blauer Himmel zu sehen.

Hindernisse erkennen: Die häufigsten Barrieren im Alltag

Geschichte lesen
Two people are depicted speaking sign language together. Both are blonde and the person on the left is wearing glasses. They are sitting on a grey couch in a living room.

Die faszinierende Welt der Gebärdensprache – Kommunikation ohne Laute

Geschichte lesen

Du brauchst mehr Informationen?

Contact us and we will be happy to help you.

Kontaktiere uns und wir freuen uns Dir zu helfen.

a man with down syndrome shows a woman something on the computer. they both laugh