zum Inhalt springen

Responsive Design

Mit dem Webrelaunch 2015 reagiert die Universität auch darauf, dass ihre Webseiten inzwischen sehr oft über mobile Endgeräte wie Smartphones oder Tablets aufgerufen werden. Klassische Webseiten sind auf solchen Geräten meist nur sehr schwer zu bedienen, weil zum Beispiel Navigationselemente für einen Touchscreen zu dicht beieinander liegen oder Texte unleserlich klein dargestellt werden.

Eine Website mit Responsive Design passt sich hingegen dem verwendeten Endgerät an. Abhängig davon wieviel Platz zur Anzeige verfügbar ist, werden Inhaltselemente im Grid neu arrangiert oder anders dargestellt. Ein klassisches Beispiel ist das Navigationsmenü. Auf einem großen Bildschirm wird es voll ausgeklappt. Ein normaler Smartphone-Bildschirm hat dafür nicht genug Platz. Deshalb wird auf diesem Gerät das Menü zusammengefaltet und erst eingeblendet, wenn Sie den Button betätigen.

vergrößern:
Klassische Ansicht der RRZK-Website auf einem PC-Bildschirm. Inhaltselemente werden nebeneinander dargestellt und das Menü ist voll ausgeklappt.
vergrößern:
Wenn Sie die gleiche Seite auf einem Smartphone nutzen, werden die Inhaltselemente untereinander dargestellt und das Menü wird zugeklappt (siehe Kreis). Sie müssen nun scrollen, aber die einzelnen Inhaltselemente sind gut zu lesen ohne dass Sie in die Seite reinzoomen müssten.

Mit dem Responsive Design wurden neue Inhaltselemente eingeführt. Auch diese sind im Corporate Design gehalten und ermöglichen eine einfachere Gestaltung von Webseiten, die auf allen Endgeräten gut funktionieren.

Ein Paradigmenwechsel ist der Wechsel zur logischen Auszeichnung von Elementen. Sie markieren einen wichtigen Textabschnitt nicht mehr als (zum Beispiel) "Arial, 22pt, rot", sondern mit dem Textstil "wichtig". Er wird deutlich hervorgehoben, aber das immer angepasst an das aktuelle Endgerät.

Gerade bei der Verwendung von Bildern hat sich viel getan. Das neue Design setzt stärker auf visuelle Kommunikation und die Anzeige von Bildern wird an das Endgerät angepasst.

Kontakt
Bei Fragen und für eine individuelle Beratung wenden Sie sich bitte an TYPO3-Master.
Bei Fragen speziell zu unserem Angebot UniTy3, verwenden Sie bitte dieses Kontaktformular: UniTy3-Support.