AMP is mobile first and that is reflected in many elements. One of them is sidebar: a menu that is fully optimized for mobile.
Like most mobile menus the mobile menu the sidebar menu is initial not visible. You can make the menu apear with a button. By initial hiding the menu you have the full screen for the content of the page.
When the menu slides into the screen you it takes almost up almost the enitre screen. Leaving a small part of the website visible for orientation. The available space allows you add more then simple menu items. A search function for instance.
The sidebar element allows you to seperatly design a menu specific targetted on mobile users. Leaving out options that aren't optimized for mobile and adding features that would benefit from mobile.
The mobile menu also gives you plenty of space to add some branding to your website espesially when there are limited branding options in the layout of the website itself.
The sidebar element has a simple clean design. It lays a dark transparent layer over de website illustrating the fact the website itself is temporary unavailable. On top of this layer is a clean white menu leaving a lot of room for branding. The menu has a small drop shadow indicating it lays on top of the dark transparent layer. To emphasize this it litterly slides over the layer when activated.
The sidebar, espesially in Webanizr AMP, is intuitive and easy to control. You can let the menu slide in by clicking on the well known hamburger menu. Sliding in empasize the fact that is just as easy to slide it out to go back to the website.
You can close the menu by clicking on the cross on the top right. To the left op the menu you can still see the website. By clicking on the website the menu closes and the website reapears.
The hamburger icon, menu and close button are all set on the right side of the menu by default making it reachable even on large phones.
The AMP sidebar element is tested on all common devices. It will work as well on iOS, Android and as well on mobile as on tablet and desktop. When new devices are launched and gain in popularity, the sidebar will again be tested to ensure your website has an great user experience on every device.
Do you want to get started with AMP? Or just a bit more information about what it can do for you? Please contact us.