Wir haben die GitLab-Dokumentationsseite komplett redesigned

Die GitLab-Dokumentationsseite hat jetzt ein völlig neues Look-and-Feel. Was als Anfrage für gezielte Design-Fixes begann, wurde zu einem umfassenden Redesign mit vier wichtigen Verbesserungen:

Auch und gerade für deutsche Entwicklungsteams: Diese Verbesserungen machen es einfacher, die englische Dokumentation zu nutzen. Dark Mode und die klarere Navigation helfen dabei, auch bei längeren Sessions die benötigten Informationen zu finden – ohne dass Sprachbarrieren durch schlechte UX verstärkt werden.

Die vier wichtigsten neuen Features

Der Dark Mode: Das meistgewünschte Feature ist endlich da. Du kannst zwischen hellen und dunklen Themes in der oberen rechten Ecke wechseln für bessere Lesbarkeit und weniger Augenbelastung.

Die Redesigned Navigation: Wir haben die primäre Navigation nach oben verschoben und die linke Sidebar umstrukturiert, damit unsere 2 300+ Seiten weniger überwältigend und besser auffindbar sind.

Das Simplified Feedback: Du kannst jetzt Thumbs-up/down-Feedback geben und Kommentare direkt auf jeder Dokumentationsseite hinzufügen.

Die Technical Debt Fixes: Dutzende kleiner, aber wirkungsvoller Fixes für Typography, Spacing, Code Blocks und visuelle Inkonsistenzen, die wir über die Jahre gesammelt haben.

Die Brand Alignment mit GitLab's Marketing-Site sorgt außerdem für eine einheitlichere Experience über alle GitLab Properties hinweg.

Warum jetzt? Das Fundament für Veränderung

Anfang des Jahres hat unser Documentation Engineering Team unter Leitung von Sarah German ein kritisches Replatforming-Projekt durchgeführt und von Nanoc zu Hugo migriert. Während diese Änderung für Teams größtenteils unsichtbar war, brachte sie dramatische Performance-Verbesserungen – 130x schnellere lokale Builds und 30x schnellere vollständige Builds – und bot die solide technische Grundlage für diese Verbesserungen.

Mit diesem Replatforming haben wir die Grundlage geschaffen, die es uns ermöglicht hat, uns auf User Experience-Verbesserungen zu konzentrieren, anstatt mit veralteter Infrastructure zu kämpfen.

Schauen wir uns die Änderungen genauer an.

Dark Mode

Möglicherweise die größte News für dieses Release: Dark Mode ist jetzt über die gesamte Dokumentationsseite verfügbar. Du änderst die Einstellung in der oberen rechten Ecke, und die Site merkt sich deine Präferenz. Für viele Teams macht Dark Mode Content einfacher zu lesen und reduziert Eyestrain.

Redesigned Navigation

Wir standen vor der großen Herausforderung, über 2 300 Seiten so zu organisieren, dass Teams nicht überwältigt werden. Unsere vorherige einzelne linke Navigation war zwar umfassend, aber schuf eine einschüchternde Experience:

Der neue Ansatz verschiebt die primäre Navigation nach oben und schafft kürzere, überschaubarere Table-of-Contents-Sections, die sich weniger überwältigend navigieren lassen:

So zeigen wir die Relationships zwischen Features besser, während einzelne Sections verdaulicher werden.

Simplified Feedback Mechanism

Wir haben den Feedback-Prozess vereinfacht. Anstatt zu verlangen, dass Teams die Docs-Site verlassen und GitLab Issues erstellen, können sie jetzt sofortiges Feedback mit Thumbs-up/down-Ratings und Comments direkt auf jeder Page geben. Scroll einfach auf jeder Dokumentationspage nach unten, um diese neue Functionality in Action zu sehen.

Style Updates und Technical Debt

Über die Jahre hatten sich kleine Style-Inkonsistenzen angesammelt – inkonsistente Padding in Lists, zusätzliche Spacing um Alerts und verschiedene Typography-Issues. Die sehen zwar klein aus, aber zusammen schufen sie eine subtil störende Experience für Daily Users.

Unsere Tabs und Code Blocks haben besondere Aufmerksamkeit bekommen und sind jetzt besser definiert.

Vorher sahen Tabs mit Code so aus:

Und jetzt, mit ein paar kleinen Tweaks, sehen sie so aus:

Diese Papercut-Fixes sind einzeln klein, aber zusammen schaffen sie eine viel poliertere, professionellere Experience.

Was kommt als nächstes?

Dieses Redesign zeigt, wie wir bei GitLab iterieren – wir shippen meaningful Improvements und bauen gleichzeitig für eine noch bessere Zukunft. Wir erwarten, die Struktur weiter zu verfeinern und Features hinzuzufügen, die Teams helfen, leichter zu finden, was sie brauchen.

User Feedback wird unsere nächsten Iterationen antreiben, und mit unserem neuen simplified Feedback Mechanism sind wir besser positioniert denn je, direkt von unseren Documentation-Teams zu hören.

Das Team

Das ganze Team hat an dieser Transformation gearbeitet. Kudos an UX Papercuts und Julia Miocene dafür, aus einer einfachen Anfrage eine umfassende Design Vision zu machen. Thanks an die Engineers im Technical Writing: Sarah German, Pearl Latteier und Hiru Fernando, die diese Designs zum Leben erweckt haben.

Das neue Design balanciert Information Density mit Visual Clarity, modernisiert unsere Site unter Beibehaltung von Usability- und Accessibility-Standards und ist ein großer Schritt nach vorn in User Experience und Visual Design.