Page Laubheimer sagt, dass, wenn Sie einen Sticky Header machen wollen...
- Halten Sie ihn klein.
- Heben Sie ihn visuell vom Rest der Seite ab.
- Wenn er sich bewegen soll, halten Sie ihn minimal. (Ich würde sagen, respektieren Sie
prefers-reduced-motion.) - Erwägen Sie „teilweise persistente Header“. (Jemima Abu nennt sie eine Smart Navbar.)
- Eigentlich, vielleicht sollten Sie es gar nicht tun.
Ich mag generell den Begriff „sticky“ Header, weil er impliziert, dass man dafür position: sticky verwenden sollte, was meiner Meinung nach auch der Fall sein sollte. Früher wurde dies mit position: fixed realisiert, aber das war schwieriger umzusetzen, da der Header aus dem Dokumentfluss heraus und wieder hinein bewegt wurde. Die Verwendung von Sticky-Positionierung hilft, diesen Platz automatisch zu reservieren, ohne JavaScript oder magische Zahlen.
Wirklich informativer Beitrag. Ich habe nach etwas Ähnlichem gesucht. Ich habe viele Videos auf YouTube gesehen, aber keines war so informativ wie dieser Beitrag. Er hat mir wirklich sehr geholfen.
Danke!