Sticky – jetzt wird’s klebrig?
„Sticky“ kommt von „klebrig“
Mit „Sticky“ beschreibt man im Web-Design etwas, das an einer Stelle „klebt“. Es bewegt sich also nicht und verändert seine Position nicht mehr. Oft tritt dieses Verhalten erst ab einem bestimmten Punkt ein, zum Beispiel bei der Navigation. Ab einem gewissen Punkt während des Scrollens bleibt die Navigation oben am Browserrand kleben. Man nutzt dieses Verhalten, um wichtige Informationen auf der Website immer präsent zu haben. Der Vorteil: Ist die Navigation immer zu sehen, egal wie weit man auf der Website bereits gescrollt hat, kann man von beliebiger Stelle einer Seite auf eine andere Seite navigieren. Man spart sich damit das oft lästige und langwierige „wieder nach oben scrollen“.
Wichtiges immer im Blick
Für viele weitere Daten ist es gut oder wünschenswert, wenn man von jeder Position aus darauf zugreifen kann. Dazu gehören z.B. Kontaktdaten oder der Anmeldebereich eines Newsletters. Unser Kunde baumfritze hatte sich für seine Website einen solchen Bereich gewünscht. Oben direkt unter der Navigation sollte man stets Zugriff auf die Kontaktdaten haben. Deshalb bewegt sich nun beim Scrollen ein Kasten mit Icons am rechten Browser-Rand mit. Dieser Kasten klappt beim Antippen mit dem Mauszeiger auf und zeigt Telefonnummer und die Links zum E-Mail-Schreiben sowie den Social-Media-Seiten.
Was kann man noch machen?
Unser Kunde Familienerholungswerk wollte bereits gleich zu Beginn der Corona-Pandemie einen gut sichtbaren Hinweis zum aktuellen Pandemiegeschehen und Öffnungsmöglichkeiten seiner Feriendörfer. Dieser prominente Hinweis in Form eines roten Corona-Icons ist beim Öffnen der Seite aufgeklappt, die Information also gleich zu lesen. Wenn man die Info nicht mehr braucht, kann man diese durch das Klicken auf das „x“ schließen. Der runde Button mit dem Corona-Icon klebt trotzdem beim Scrollen am rechten Bildschirmrand und bleibt so immer präsent.
Bei Klima-Kollekte soll ein breites Band bzw. Banner am unteren Bildschirmrand stetig auf den Newsletter und Direktkompensations-Rechner hinweisen. Dieser Bereich bewegt sich ebenfalls beim Scrollen mit.