I noticed that there is a mobile version shown for the tables pattern but not for the tabs navigation pattern.
Wondering if mobile patterns could be included for all patterns? #MobileFirst
1 Like
Thanks for this. We are always looking to provide a responsive patterns. In the case of the tabbed navigation (which hasn’t been published to our site yet, but you can see it action here), we will look into a mobile version for this - an option is to have the tabs convert into a drop down box, but this could be seen as poor UX given the mental model users have for drop downs i.e. it being a form field. I will consult our UX manager @mike.hall and FE developer @SeanElliott to see what we can do with this.
Thanks
Mason
Thanks Mason. We aim for a mobile first approach to our digital channels – and are increasingly thinking about voice assistants as well – so it’s good to know that you are taking this requirement into consideration.
Looking forward to seeing all of the patterns incorporate a responsive design as an integral part of the development.
Hi @jennifer.weiley,
Tabs on a mobile is always a difficult problem to solve gracefully without completely changing the pattern to something else as @mason.phan mentioned.
Being an open community if you have seen any examples you felt worked well it would be amazing if you could share them here with us, that way when we look into this we have lots of material to go through and evaluate.
Cheers
Sean
2 Likes
Hi @SeanElliott - JB HiFi does a pretty good job of this. They do convert the tabs into accordions, with the first tab/accordion being in an open state. They use this pattern for product information across the whole site so the consistency makes for a more predictable user experience too.
Thanks for the example Jennifer, we will look into JbHiFi’s pattern when we start to approach this.
1 Like