Geschrieben von Christian Schnettelker

Schlagwörter: ,

Webdesign-Tipps 1: Du sollst nicht springen

Beim Surfen im Netz sehe ich leider sehr häufig folgenden, wie ich finde, störenden Effekt: der Inhalt zentrierter Seiten „springt“ beim Wechsel zwischen einzelnen Seiten um vielleicht einen halben Zentimeter von links nach rechts oder von rechts nach links.

Den Grund dafür hatte ich, als dies mir vor Jahren bei der Erstellung meiner eigenen Seiten das erste Mal aufgefallen war, schnell identifiziert: bei Seiten mit wenig Inhalt wird der Browser-Scrollbar rechts verborgen, ist die Seite länger angezeigt, um den Inhalt scrollen zu können.

Die Breite des Scrollbars war, so stellte ich fest, exakt der Wert, um den der Seiteninhalt beim Wechsel optisch „springt“.

Scrollbar rechts

Ich empfand schon damals diesen „Effekt“ als sehr störend, es macht den Seitenwechsel unruhig und durch das Springen sieht der gesamte Auftritt irgendwie unprofessionell aus. Genauso schnell, wie ich das Problem identifiziert hatte, fand ich durch eine Recherche im Internet auch eine Lösung des Problems, welche ich seitdem bei allen Projekten verwende. Ein kurzer Eintrag

html { overflow-y:scroll; }

in der CSS-Datei, zum Beispiel im Zuge eines CSS-Resets, genügt, um die Scrollbar vom Browser dauerhaft anzeigen zu lassen – vorbei ist es mit dem unschönen Springen.

Leider scheint sich dieser Trick bisher nur mäßig herumgesprochen zu haben; auch bei Seiten, die mir sonst sehr gefallen, sehe ich diesen „Sprungeffekt“ immer noch regelmäßig.

Kommentare

Kommentare

  1. OMU2014 schrieb:

    Ja spitze. Danach haben wir gesucht. Danke für den Tipp.

Kommentar schreiben

Aufgrund neuer rechtlicher Bestimmungen habe ich die Kommentarfunktion meines Blogs vorübergehend deaktiviert und muss Sie vorerst bitten, Kommentare per Email an mail [at] manoftaste.de zu senden.