Neue Möglichkeiten im Responsive Design

08.05.2020

Das responsive Design wird im Detail ständig weiterentwickelt. Eigene Social Media-Kanäle, Call-to-Action-Button, zusätzliche Icons – ein Überblick unserer Neuerungen der letzten Wochen.

Social Media-Kanäle im Footer

Jede Webseite schließt mit einem sog. Footer ab. Hier, ganz am Ende der Seite, sind neben Links zum Impressum oder der Datenschutzerklärung standardmäßig fünf Social Media-Kanäle der TU Darmstadt mittels Icons verlinkt. Diese Kanäle werden zentral mit Inhalten aus der gesamten TU bespielt.

Sollte etwa ein Fachbereich oder ein Forschungsprojekt eigene Social Media-Kanäle betreiben, können diese nun individuell im Footer platziert werden.

Die Einstellung wird einmalig in der Struktur vorgenommen, und zwar in den Metadaten des Startordners eines Webauftrittes. Im Reiter „nur Responsive Design“ / „Footer“ können eigene Kanäle bzw. Fanpages bei Facebook, Instagram, Twitter, YouTube und/oder LinkedIn verlinkt werden. Einmal gesetzt, gelten die Einstellungen für den gesamten Webauftritt.

Sobald hier ein Eintrag gesetzt wird, werden die Standardeinstellungen mit den fünf Kanälen der TU Darmstadt überschrieben und die Redakteurinnen und Redakteure entscheiden selbst, welche und wie viele Kanäle im Footer zu sehen sein sollen.

Call-to-Action (CTA)

Ein Call-to-Action-Button ist eine eigene, neue Absatzvorlage. Er fordert Nutzerinnen und Nutzer zu einer bestimmten Aktion auf. Im Kern handelt es sich um einen Link, der mittels eines farbigen Buttons dargestellt wird. Im Kombination mit einer direkten Ansprache („jetzt entdecken“, „mehr lesen“) wird eine größere Aufmerksamkeit geschaffen, den Button zu klicken, als bei einem einfachen Link. Ein CTA eignet sich gut für Start- und Verteilerseiten, z.B. nach News-Teasern oder Veranstaltungslisten.

Infobox

Innerhalb einer Infobox kann nun optional ein Icon eingefügt werden. Aktuell stehen sechs Icons zur Auswahl, z. B. ein Ausrufezeichen oder eine Sprechblase. Diese grafischen Elemente sollen Usern helfen, intuitiv zu erkennen, ob es sich bei den Inhalten einer Infobox um einen wichtigen Hinweis, ein Service-Angebot oder eine Zusatzinfo handelt.

Weitere Anpassungen

  • News-Teaser werden jetzt auf mobilen Devices nicht mehr untereinander, sondern als „Karussell“ dargestellt. Nur die aktuellste News wird angezeigt und User können mittels einer Wischbewegung nach rechts/links durch die einzelnen News scrollen.
  • Freitextinformationen bei einem Kontakt-Datensatz sowie weitere Absätze wurden vorher standardmässig auf Kontakt-Detailseiten als eingeklapptes Akkordeon ausgegeben. Nun steht es den Redakteurinnen und Redakteuren frei, diese Akkordeons beim Laden der Seite ausgeklappt auszugeben.
  • Die Absatzvorlage „Links & Downloads“ kann jetzt in einer Absatzgruppe verwendet werden.
  • Bei Newsdatensätzen ist es jetzt möglich, für jede News einen individuellen Kontakt bzw. mehrere Kontakte anzugeben.