Computer users with widescreen monitors are sometimes the victims of software designed for a non-widescreen world - as most dialogs in the existing applications were not built with "plenty of horizontal space" in mind.

As time passes by, widescreen monitors gain popularity, and software developers have to take that into account. Today's example is Opera.

My habit is to open a lot of tabs and keep them there until all their reading material is analyzed and understood. Since there is a lot of good content on the Internet, it is difficult to keep up. As a result, after a series of my computer's hibernate cycles, I experience "tab avalanche" (note to self: find a better name for this effect).

(click for a larger image)

Follow up:

You can see that the tabs are so small that their titles are not readable.

This may not be a problem if you use the favicons to tell one tab from another, but if you have several tabs displaying pages from the same site (as it is usually the case with Wikipedia) - you have a usability problem. The screenshot above is not the "worst case scenario", at times it also happens that the tab markers become smaller - so it becomes difficult to click on them. This turns the browsing experience into empirical evidence that Fitt's law is true.

I have a widescreen monitor on another computer, Opera runs there too. As an experiment, I decided to place the tab-bar to the left side, vertically. This is what it looks like:

Vertical placement had several reasons behind it:

• I really get to see the title of each tab, so it makes navigation easier
• Many sites aren't designed to look good on a wide screen, so a lot of space is wasted. I shrink the browser's window so that I can open other programs and keep them on the remaining space (ex: see Pidgin on the right)

Problem solved? Yes, but no - Opera can only show a finite number of tabs one on top of another. If I open more - they are not visible until I close some. In the screenshot above, you see 26 tabs, but in reality 30 of them are open. Of course, I can use the built-in tab-switcher (you see it when you press Ctrl+Tab), but it makes navigation more difficult (that's why we have the usual tab bar in the first place).

Moreover, with the right number of tabs open, the built-in tab switcher will probably reach its limits too. Let's give it a try (I created numerous dummy tabs to fill it up):

(click to see a larger image)

The two columns layout is a good idea, as it makes the list easy to read and there is no need for scrolling. It is extremely unlikely that there will be three columns of such text (take a look at the tab bar and see how many pages are open); if you have that many tabs, you must be playing at the "nightmare" difficulty level and in that case you're on your own.

Solutions

• Add a widget that allows the tab bar to be scrolled. Firefox solves the problem this way - note the arrows at the edges:
  
• Use an OS X dock-style tab bar - it becomes bigger as you get close to it (thus it is easier to hit it), and as you move towards the right or left edge, it scrolls itself that way automatically - so that there is no need to actually click anything (as you do in Firefox)
• Modify the main window in such a way that if the mouse is kept on top of the tab bar for a while, the tab bar extends, turning itself into the multiple column (or row) tab switcher.

The third solution is much better than the Firefox one, because in the first case the price for readability is "plenty of scrolling". Worst case - you don't know which way to scroll, so you have to scroll all the way to one end, and then to the other one (the second solution is not affected by this).

A refined version of the third solution is to show the multi-column tab switcher if the mouse is moved to the edge (in my case - the left one, see the screenshot of Opera in Linux) of the screen. Because it is easier to hit that area than it is to aim for the tab bar and make sure you're exactly above it. Besides, currently if you hover above the tab-bar you see a thumbnail of the page - this functionality should not be lost. It should work like the OS X dock, the short time delay is introduced to prevent the list from being displayed if the mouse cursor was accidentally pushed to the edge of the screen.

Another advantage of this approach is that it is in tune with the idea of "question oriented UI design" - when I surf the net, I don't need to see everything on the screen, but only the necessary minimum to do the job. Since the multi-line tab switcher is not going to be visible all the time, it will not distract the user nor will it occupy space on the screen.