CSS: Einblendung von Links "springt" bei Seitenrand

[Gunnar Bittersmann]

@@Rolf B

das Problem ist, dass die Animation die Sidebar von left:-300px nach left:0 bewegt.

Und du erwähnst nicht, was daran das Problem ist‽

Man sollte nicht left animieren – aus Performanzgründen. Findet man etliche Male im Archiv (Threads, an denen du auch beteiligt warst).

Zum Rein- und Rauschieben(!!) des Menüs sollte man translate (transform) verwenden.

Ja, zum Rausschieben – gerade diese (bei TimNie fehlende) Animation ist bedeutsam. Denn die gibt Nutzern die Gewissheit, dass das Menü nicht gänzlich weg ist, sondern sich gleich außerhalb des Viewports befindet und bei Bedarf wieder reingeschoben werden kann.

Eben weil das animierte Rein-/Rausschieben des Menüs sinnvoll ist und auch Nutzer, die „Bewegung reduzieren“ eingestellt haben, nicht nerven dürfte, kann man dies auch durchaus für alle Nutzer tun. „Reduzierte Bewegungen“ heißt nicht „gar keine Bewegungen“.

Fun fact: Ich habe bei der Implementierung des Menüs beim Tagesspiegel das Rein-/Rausschieben nicht für @prefers-reduced-motion gemacht. Spätestens bei der Vorbereitung der Präsentation Respect user preferences beim UXcamp kam ich drauf, dass das nicht die beste Idee ist. Ich dachte, ich hätte das schon geändert. Hab ich aber nicht. Gleich mal ein Ticket anlegen – oder suchen, ob ich schon eins angelegt habe.

Kwakoni Yiquan