Die Bauhaus-Universität Weimar ist eine Kunst- und Gestaltungshochschule in der Tradition des Bauhauses. Ihre Website war über 15 Jahre gewachsen: Fakultäten, Institute und Projekte hatten sich jeweils eigene Bereiche angebaut, und die Struktur folgte dem Organigramm statt den Fragen der Nutzenden. Aus dem Webauftritt war ein Archiv geworden. Mit dem Relaunch 2026 hat die Universität einen Auftritt bekommen, der dem Bauhaus-Prinzip „Form follows function“ folgt: eine Schrift, kräftige Farbflächen und die Grundformen Kreis, Dreieck und Quadrat. Dahinter steht ein komplett neu aufgebautes TYPO3 14, das schneller, sicherer und für die Redaktion deutlich einfacher zu pflegen ist.
Die Farbe hat keine inhaltliche Bedeutung, und das ist Absicht. Neun Themes aus Farbe und Pattern werden bei jedem Aufruf neu ausgewählt, sodass dieselbe Seite immer wieder anders aussieht. Nicht verhandelbar ist dabei nur eines: der Kontrast. Statt Stockfotos gibt es 90 generierte Pattern als SVG, in drei Formaten, nur wenige Kilobyte groß und beliebig skalierbar.
Statt die bestehende Installation zu aktualisieren, haben wir die Website auf einem leeren TYPO3 14 neu aufgebaut, ohne technische Altlasten. Aus 43 alten Inhaltstypen wurden 19 eigene Inhaltselemente. 24 Migratoren haben die Inhalte aus 15 Jahren automatisiert übernommen und dabei aufgeräumt. Migratoren arbeiten auf Datensätzen, die bereits im Zielsystem liegen, und verändern sie dort direkt. Sie wandeln zum Beispiel alte Inhaltselemente in neue Content-Elemente um, verschieben Feldinhalte in andere Felder, bereinigen HTML oder passen Verknüpfungen und Dateireferenzen an.
Ein kompletter Durchlauf der gesamten Migration dauerte sechs Stunden. So konnte die Redaktion von Anfang an in einem stabilen, sicheren System arbeiten, statt Inhalte von Hand zu übertragen.
Das Design liegt in einem Styleguide auf einer eigenen Domain und läuft unabhängig von TYPO3. Styleguide und Website rendern aus demselben Code: Was im Styleguide zu sehen ist, sieht auf der Website genauso aus. Farben, Typografie und Komponenten lassen sich dort direkt prüfen und kopieren, statt sie in einem PDF nachzuschlagen. Damit ist der Styleguide die verbindliche Grundlage für den weiteren Ausbau der Website und für die Gestaltung von Drittsystemen.
An der Website arbeiten viele Redakteurinnen und Redakteure. Deshalb gilt: Jede Auswahl, die wir weglassen, ist eine Entscheidung, die niemand falsch treffen kann. Die Redaktion legt fest, welche Bedeutung eine Überschrift hat (Hierarchieebene H2, H3 oder H4) - wie sie aussieht, bestimmt das Design im Kontext zu anderen Elementen auf der Seite. Jeder Seiteninhalt zeigt bereits im Backend, wie dieser im Frontend dargestellt wird. Ebenfalls stehen der Redaktion nur relevante Einstellungsmöglichkeiten zur Verfügung.
Der „Magic Container“ zeigt dieselben Inhalte wahlweise als Slider oder als Kachelraster mit zwei bis vier Spalten und optionalem Filter. Redakteure legen einfach News, Kontakte, Galerien oder Downloads hinein. Jede Meldung, jede Person und jedes Bild wird automatisch zu einer eigenen Kachel. Den Namen hat die Redaktion übrigens aus dem Arbeitstitel übernommen, weil er ihr so gut gefiel.
Aus 19 historisch gewachsenen News-Vorlagen haben wir fünf klar definierte gemacht. Redakteure finden so auf Anhieb die passende Vorlage, alle Meldungen erscheinen einheitlich, und das System ist deutlich leichter zu pflegen.
Für Fakultäts-, Projekt- und Personenseiten liegen fertige Vorlagen im Seitenbaum, die sich mit wenigen Klicks kopieren lassen. Struktur und Inhaltselemente sind bereits angelegt, sodass Redakteure nur noch ihre Inhalte einfügen müssen. Das beschleunigt die Pflege, erleichtert den Einstieg für neue Redakteure und hält das Erscheinungsbild der gesamten Website einheitlich.
Drei Agenturen mit klar verteilten Rollen: Atelier Disko verantwortete Konzept und Gestaltung, in2code die komplette Umsetzung in Frontend und Backend, 3pc Intranet und Suche. Auf Seiten der Universität steuerten drei Projektverantwortliche das Vorhaben, unterstützt von vielen helfenden Händen in der Redaktion.
Los ging es mit einem zweitägigen Kick-off vor Ort in Rosenheim. Noch vor der ersten Zeile Code haben wir in einem Git-Flow-Workshop ein Branching-Modell festgelegt, das für alle Beteiligten verbindlich ist. So konnten drei Teams parallel an einer gemeinsamen Codebasis arbeiten.
Ein fester Wochenrhythmus hielt das Projekt auf Kurs: Zum Wochenstart stimmten wir uns intern ab, im Laufe der Woche folgten ein Jour fixe mit dem Kunden und eine große Runde mit allen beteiligten Agenturen. So waren Fragen schnell geklärt, Abhängigkeiten früh sichtbar und alle Beteiligten jederzeit auf demselben Stand.
Die Website erreicht in Performance, Accessibility, Best Practices und SEO jeweils die volle Punktzahl. Vor dem Relaunch lagen die Werte zwischen 59 und 92. Der Largest Contentful Paint, also die Zeit, bis der größte sichtbare Inhalt geladen ist, sank von 9,0 auf 1,2 Sekunden. Das ist kein Zufall: Die Werte haben wir während der Projektlaufzeit immer wieder kontrolliert und unsere eigene Arbeit entsprechend angepasst.
Hinter der Performance steckt nicht eine einzelne Maßnahme, sondern viele kleine: Code-Splitting, Responsive Images, Lazy Loading, selbst gehostete Schriften, StaticFileCache, HTTP/2 und mehr. Für Sicherheit sorgen unter anderem eine strikte Content Security Policy für Frontend und Backend, Single Sign-on über Shibboleth und Zugangsdaten, die nicht im Code liegen.
Besonderes Augenmerk haben wir auf eine Optimierung im Bereich “Agentic Browsing” gelegt. Die Website kann besonders gut von AI-Agenten gelesen und auch bedient werden. So gibt es jede Seite in zwei Formaten: als HTML für den Browser und als Markdown für KI-Agenten mit nur einem Fünftel der Datenmenge. Strukturierte Daten (JSON-LD) beschreiben zum Beispiel Studiengänge mit Abschluss und Regelstudienzeit, eine llms.txt hilft Sprachmodellen bei der Orientierung. In der robots.txt ist hinterlegt, dass KI-Systeme Inhalte lesen, aber nicht für das Training nutzen sollen.
Videos und Instagram-Beiträge laden erst, wenn Interessierte zustimmen. Die Statistik läuft mit Matomo ohne Cookies auf einem eigenen Server der Universität. Deshalb braucht die Website keinen Cookie-Banner. Nicht aus Nachlässigkeit, sondern weil ohne Zustimmung nichts gespeichert wird.
Vimeo-Videos, Livestreams über Vimeo Events, Vimeo Showcases und Podcasts von Podigee bindet die Redaktion einfach per URL ein, so wie ein Bild. Ohne eigenes Inhaltselement und ohne Plugin. Die Suche auf Basis von YaCy findet auch Inhalte außerhalb von TYPO3, schlägt schon während der Eingabe Begriffe vor und lässt sich flexibel filtern.
uni-weimar.de ist …
Mit dem Relaunch 2026 zeigt die Bauhaus-Universität Weimar auch im Web, wofür sie steht: Gestaltung mit Haltung. Für uns ist das Projekt ein Beispiel dafür, was entsteht, wenn Design, Technik und Redaktion von Anfang an zusammen gedacht werden. Mit dem Living Styleguide und einem aufgeräumten TYPO3 14 hat die Universität eine Grundlage, auf der sich ihr Auftritt langfristig weiterentwickeln lässt.
