Sunday, October 29, 2017

navigation - Best Practice for Tab Placement on Widget?


Recently I have been working on restyling tabs on a widget. Some problems I have encountered during the restyle is our 960 grid system which with a side navigation included allows me a space of 12 cols to work with.


While researching, top tab placement seemed to be a common pattern used. However if more tabs are added to max out the first row a second row is created which isn't very eye-catching.


top tabs


Side tab placement would allow the widget to display tabs in a single row going downwards. However less content doesn't look good in a large container.


side tabs


What is the best practice for tab placement on a widget? Which would provide for a better user experience?



Answer



Through research regarding tabs, top placement is best as a top tab can appear as a header to the associated content below.



It's also a good rule of thumb to constrain a tab count (usually 5 - 7) that adds a bit of control to user content. If tabs exceed the 5 - 7 limit content editors will continue to create new tabs which can overflow and create clutter. Even adding a more tab could create more user confusion as it can display even more information that creates more clutter.


Users like simplicity and being able to find information quickly!


No comments:

Post a Comment

technique - How credible is wikipedia?

I understand that this question relates more to wikipedia than it does writing but... If I was going to use wikipedia for a source for a res...