User:Aravindet/Multirow tabs: Difference between revisions

From MozillaWiki
Jump to navigation Jump to search
(Created page with 'This is adding to Ben Goodger's and Mike Connor's ideas about managing large numbers of tabs. See [[https://wiki.mozilla.org/Tabbed_Browsing/User_Interface_Design/Tab_Overflow#Ot…')
 
No edit summary
Line 1: Line 1:
This is adding to Ben Goodger's and Mike Connor's ideas about managing large numbers of tabs. See [[https://wiki.mozilla.org/Tabbed_Browsing/User_Interface_Design/Tab_Overflow#Other_threads_about_tabs.2C_tab_overflow.2C_and_tab_design]. Mike had concluded that while traditional multi-row tabstrips have the advantage of displaying all the tabs, they suffer from shifting rows or disconnect between the selected tab and the content area.  
This is adding to Ben Goodger's and Mike Connor's ideas about managing large numbers of tabs ([[https://wiki.mozilla.org/Tabbed_Browsing/User_Interface_Design/Tab_Overflow]]). Mike had concluded that while traditional multi-row tabstrips have the advantage of displaying all the tabs, they suffer from shifting rows or disconnect between the selected tab and the content area.  


Shifting rows are not acceptable because they disorient the user. I believe that this is because it changes the percieved tab order (users "read" tabs from the top left, like a book). I've come up with a possible solution for this.  
Shifting rows are not acceptable because they disorient the user. I believe that this is because it changes the percieved tab order (users "read" tabs from the top left, like a book). I've come up with a possible solution for this.  

Revision as of 14:02, 13 January 2010

This is adding to Ben Goodger's and Mike Connor's ideas about managing large numbers of tabs ([[1]]). Mike had concluded that while traditional multi-row tabstrips have the advantage of displaying all the tabs, they suffer from shifting rows or disconnect between the selected tab and the content area.

Shifting rows are not acceptable because they disorient the user. I believe that this is because it changes the percieved tab order (users "read" tabs from the top left, like a book). I've come up with a possible solution for this.

Instead of arranging tabs in rows from left to right, arrange them on a flexible "tab-ribbon" which folds into multiple rows without "breaking". The closest example I can think of is how Lanthanides and Actinides are usually shown the periodic table of elements.

Users can "read" the tabs along the ribbon, generally from left to right. When the user switches between tabs, the "fold" in the ribbon will shift position (changing the ribbon shape), pushing some tabs to the upper rows and the selected tab and its neighbours to the lowest row (adjacent to the content). However, the position of tabs relative to the ribbon remains the same.

Here are the "tab-ribbon" shapes for a two-row layout:

Tab-ribbon.gif
A mockup of how this would look in firefox 4.0:

Tabribbon-mockup.gif

The folding indicators (torn-off tabs) are just to make the concept clear... I feel they aren't really required. A short animation while the user switches tabs would be better. This is an exaggerated version, of course - in practice tabs would probably shrink more before "folding" into a second row... my guess is this should happen at around 15 tabs.