Relaunch dhbw.de
Responsive Webdesign
Browser Darstellung: Desktop
Browser Darstellung: Tablet
Die Webseite der Dualen Hochschule Baden Württemberg erscheint seit August 2015 in einem neuen, zeitgemäßen Look. Das Projekt-Team der Dualen Hochschule Baden-Württemberg um Florian Löffelad und Front- und Backendentwickler von cron IT GmbH brachten die Webseite auf den aktuellen Stand von Design, Technik und Usability. Egal ob auf Smartphones, Tablets oder Desktop-Computern. Dabei wurden auch die Inhalte von ihrer Struktur vereinfacht, um den Nutzer möglichst einfach zu den für ihn relevanten Inhalten zu führen.
Leistungen
Responsive Webdesign, HTML5, TYPO3-Integration
URL
www.dhbw.de
Konzeption & Zielsetzung
Ziel des Projektes war es, die Webseite der Dualen Hochschule Baden Württemberg einen neuen, zeitgemäßen Look zu versehen und die Webseite auf den unterschiedlichsten Endgeräten darstellbar zu machen.
Design & Usability
Das Frontend der Webseite wurde komplett neu gestaltet und entwickelt.
Das Responsive Webdesign der Webseite ist Mobile First angelegt. Beginnend mit kleinen Bildschirmauflösungen von Smartphones wird das Design hier schrittweise an mehr verfügbare Bildschirmfläche angepasst. Die Menüführung der Webseite setzt konsequent auf "Burger" - das Menü lässt sich auch auf Desktop-Browsern über das Menü-Icon aufklappen und zeigt dann den vollständigen Menübaum der Webseite.
Technische Realisierung
Um den verschiedenen Verbindungsgeschwindigkeiten und Auflösungen der Endgeräte besser gerecht werden zu können, sind die Bilder auf der Webseite als Responsive Images angelegt. Dabei werden von einen Bild verschiedene Auflösungen und / oder Ausschnitte angelegt, um auf dem jeweiligen Endgerät den relevanten Bildinhalt möglichst gut darstellen zu können. Alle Icons wurden konsequent als SVG-Grafiken eingebunden, um verlustfrei auf unterschiedlichsten Auflösungen betrachtet werden zu können.
Im Backend setzt die Webseite auf ein aktuelles TYPO3 CMS. Die Inhaltselemente der Webseite werden zeitgemäß mit der Extension Fluidcontent realisiert. Für die Verwaltung der Kontaktdaten steht eine zentrale Datenbank zur Verfügung, die mit einer eigens entwickelten TYPO3-Extension auf Basis von Extbase verwaltet werden kann.
Technologie & Systeme
Twitter Bootstrap, TYPO3 CMS, JSON, jQuery, Responsive Images, Fluidcontent, Extbase