Wann sich das Offcanvas lohnt
Die eingeklappte Navbar von Bootstrap schiebt das Menü nach unten auf. Das funktioniert gut, solange die Navigation kurz ist – und schlecht, sobald sie länger wird als der Bildschirm hoch ist.
Das Offcanvas nimmt stattdessen eine eigene Ebene: es fährt von der Seite herein, legt sich über den Inhalt und scrollt für sich. Die Seite darunter bleibt, wo sie war – nach dem Schließen steht der Besucher wieder an derselben Stelle.
Drei Dinge gehören zwingend dazu. Der Fokus muss beim Öffnen in das Panel wandern und dort bleiben, solange es offen ist, sonst tabbt man unsichtbar durch die Seite dahinter. Escape muss schließen. Und der auslösende Button braucht aria-expanded, damit Screenreader den Zustand ansagen.
Bootstrap bringt alle drei mit, sobald die Komponente über die data-bs-Attribute eingebunden wird. Wer das Panel selbst nachbaut, muss die Fokusfalle von Hand implementieren – und genau daran scheitern die meisten Eigenbauten.