Profil

Eine neue Website-Familie: die Uni Kassel und ihre Fachbereiche.

Die Ausgangssituation

Die im Jahre 1971 gegründete Universität Kassel zeichnet sich vor allem durch ihre vielfältige und interdisziplinäre Forschung und Lehre aus. So umfasst das Profil u. a. die Schwerpunkte Umwelt-, Klima- und Energieforschung, Informationstechnik-Gestaltung, Nanostrukturwissenschaften und Bildungsforschung sowie bildende Kunst.

Auf ihrer Website informiert die Uni Kassel umfassend über ihre Studiengänge, Fachbereiche und Institute sowie über Forschung, das Leben in Kassel und vieles mehr. Der Auftritt umfasst tausende von Seiten, gruppiert in Sub-Websites – z. B. für die Fachbereiche – mit jeweils bis zu vier eigenen Navigationsebenen und zahlreichen Gestaltungs- und Inhaltsformaten.

Das jedoch die vielen unterschiedlichen Angebote für ganz verschiedene Zielgruppen gedacht sind, war im bisherigen Design kaum ersichtlich. Ein weiteres Problem war die mangelnde Responsivität der Website: In Hinblick auf die stetig zunehmende Nutzung des Webs mit mobilen Geräten, bestand hier dringender Handlungsbedarf.

Unsere Aufgabe

Die sich durch die vielen Inhalte und Sub-Websites und deren jeweils unterschiedliche Schwerpunkte ergebende Komplexität war die große Herausforderung dieses Projektes.

  • Im Fokus stand dabei die Entwicklung eines neuen responsiven Designs auf Basis des Atomic Design Ansatzes: Kleine Gestaltungseinheiten wie Farben und Schriften, die zu immer komplexeren Funktionen, Elementen und Seiten modular zusammengesetzt werden können. 
  • Da eine weitere Anforderung die Migration aller Inhalte war, musste sichergestellt werden, dass jedes bisherige Element im alten Design eine Entsprechung im neuen fand.
  • Auf konzeptioneller Ebene galt es, die diversen Zielgruppen und ihre Bedürfnisse besser zu verstehen. Dazu gehörten u. A. Studieninteressierte, Bewerber*innen, Studierende, Wissenschaftler*innen und Mitarbeitende. Die Nutzenden sollten künftig auf möglichst klaren und kurzen Wegen zu den für sie passenden Inhalten gelangen. Gleichzeitig war wichtig, im Geflecht der Subwebsites eine verbesserte Orientierung zu schaffen.
  • Nicht zuletzt wünschte sich die Uni Kassel Beratung und Unterstützung bei der zielgruppen- und suchmaschinengerechten Überarbeitung zentraler Inhalte. Da es über die Sub-Websites hinweg etwa 1.500 redaktionsberechtigte Mitarbeiter gibt, waren entsprechende Schulungen für potentiell große Teilnehmerzahlen auszurichten.

Die Umsetzung

  • Wir entwickelten sechs gut fundierte Personas, stellvertretend für die wichtigsten Zielgruppen; so fiel das Hineinversetzen in die Nutzenden von Beginn an leicht. Mithilfe unserer Zielgruppenmatrix, die Content und Personas in Bezug zueinander setzt, ließ sich die Gewichtung und Priorisierung der verschiedenen Inhalte erheblich vereinfachen, um so die für die Website gesetzten Ziele möglichst gut erreichen zu können.
  • Ausgehend von unserem Basisdesign entwickelten wir gemeinsam mit der Uni Kassel das Screen-Design weiter. Hierbei stand die Verwendung feiner Linien, die für das Uni Kassel CD typisch sind, sowie farbiger Flächen zur Hervorhebung besonders wichtiger Informationen im Vordergrund. Verschiedene Teaser-Formate ermöglichen zudem eine abwechslungsreiche Gestaltung.
  • Auf Basis des CSS-Frameworks Bootstrap 4 entwickelten wir das Frontend. Hierbei implementierten wir zahlreiche spezifische Anpassungen, um den hohen Ansprüchen im Bildungsbereich und den Anforderungen an die Barrierefreiheit der Website gleichermaßen gerecht zu werden.

Responsive Ansichten der neuen Website der Uni Kassel auf verschiedenen Geräten.
Responsive Ansichten der neuen Website der Uni Kassel.
Ansicht des Navigationsmenüs und des Kopfbereiches auf der Startseite
Aufgeräumtes Navigationsmenü, Zielgruppen- und Themeneinstiege auf der Startseite.
Ausschnitt der Startseite mit Newswall-Extension
Auf der Startseite und einigen Übersichtsseiten kommt die Newswall-Extension von cosmoblonde zum Einsatz und sorgt - entsprechend ihrer redaktionellen Einstellungen - stets für eine lebendige Einstiegssituation.
Ausschnitt einer Detailseite
Auf der Detailebene sorgen Aufgeräumtheit und ein leichtgewichtiges Menü für vollen Fokus auf die Inhalte.

Steckbrief

  • URL: www.uni-kassel.de
  • Kunde: Universität Kassel
  • Umsetzung: Launch der Dachseite im Juni 2018, Seiten der Studiengänge folgen sukzesive
  • Technologie: Bootstrap 4, HTML5 / CSS, Jenkins
  • Leistungen: UX-Berarung, Konzeption, Design, responsive Frontend-Umsetzung, Einrichtung eines Build-Prozesses 

Aktuell