Offcanvas
Zuletzt aktualisiert
Zuletzt aktualisiert
© Atloss GmbH. All rights reserved.
Ein Offcanvas im Online-Shop bezieht sich auf eine Design- und Benutzeroberflächen-Technik, bei der zusätzlicher Inhalt außerhalb des sichtbaren Bildschirmbereichs platziert wird und bei Bedarf eingeblendet werden kann. Dabei wird der zusätzliche Inhalt in der Regel seitlich oder unten außerhalb des Hauptinhaltsbereichs positioniert.
Der Zweck eines Offcanvas besteht darin, zusätzliche Informationen bereitzustellen, ohne dass der Hauptinhalt der Seite verdeckt wird. Wenn der Benutzer auf einen speziellen Button oder ein Icon klickt, wird das Offcanvas animiert und der zusätzliche Inhalt wird sichtbar. Durch Klicken auf einen Schließen-Button oder außerhalb des Offcanvas-Bereichs kann das Element wieder ausgeblendet werden.
In Shopware wird ein Offcanvas beispielsweise für folgende Zwecke verwendet:
Warenkorbvorschau: Ein Offcanvas-Warenkorb zeigt dem Benutzer eine Vorschau auf den aktuellen Inhalt seines Warenkorbs, ohne dass er die Seite verlassen muss. Der Benutzer kann den Warenkorb öffnen, um den Inhalt anzuzeigen, Artikel hinzuzufügen oder zu entfernen und den Checkout-Prozess zu starten.
Mobile Navigation: Auf kleinen Bildschirmen wie Smartphones wird das Offcanvas-Menü als Alternative zur herkömmlichen horizontalen Navigationsleiste genutzt. Es ermöglicht eine platzsparende und zugleich leicht zugängliche Navigation für mobile Benutzer.
Zusätzliche Filteroptionen: In einer Kategorie Seite kann ein Offcanvas-Menü verwendet werden, um erweiterte Filteroptionen anzuzeigen. Der Benutzer kann das Offcanvas-Element öffnen, um spezifischere Filter wie Preisbereiche, Farben, Größen usw. auszuwählen, ohne den Hauptinhalt der Seite zu überladen.
Die Verwendung von Offcanvas-Elementen im Online-Shop kann die Benutzerfreundlichkeit verbessern, indem zusätzlicher Inhalt bereitgestellt wird, der bei Bedarf sichtbar wird, ohne den Hauptinhalt zu überlasten oder die Benutzererfahrung negativ zu beeinflussen.
