Tabs Want to be Seen

I’ve been posting lately about how browsing in Firefox could be greatly enhanced with visual navigation. Last month, I posted about Control+Tab, a new Firefox 3.1 feature which is the first step in this direction. Now, let’s take another step by improving Control+Tab to meet the needs of more users.

Design for everyone is hard…

The hardest thing about designing for Firefox is that the solutions have to meet the needs of everyone, and everyone is different. There are generalizations that can be made about how humans tend to behave, but each person works and even thinks differently – even from moment to moment. So, good designs for Firefox should support different ways of working and thinking.

An issue with the current design of Control+Tab is that it supports one way of working but neglects others. For people that often switch between two tabs, this is an excellent quick key-stroke. But for people who switch between three or four or hundreds of tabs, it isn’t very efficient. A better system would adapt as a user’s browsing session changes and allow for multiple modes of use, drawing on the many ways our memory encodes and recalls items.

…let’s go shopping (for existing solutions)!

If you’re on Windows or Gnome/KDE, hit Alt+Tab (Cmd+Tab on Mac). What you should see is a visual preview of your running windows or applications, and likely in most-recently-used order. This display does some important things that the new Control+Tab feature doesn’t. Most importantly, it allows for visual search as well as quick-switching. If your last used item is in your short-term memory, it’s a quick keystroke to flip back to it – just like Control+Tab. However, if you have an idea of what something looks like, just visually scan to the match. If your item is recent, tab over to it – if not select it with your cursor. Another benefit of this system is that it gives you a survey of your whole inventory so you can get a sense of not only what kinds of items are open, but how much content there is.  This is a positive solution for operating systems, and I believe it’s a positive solution for Firefox too.

This method even integrates well with operating system seach: Cmd, Alt, and Ctrl are all near each other, so you change between OS-wide and browser-wide preview by a shift of the thumb. It could also be designed to have a visual look identical to the current OS previews.

This new version would also solve some of the general problems with Control+Tab, such as only showing three previews at once and having to wait for distracting animations. Also, by introducing grid-view, the linear view of Control+Tab would no longer compete visually with the linear list of tabs in the shelf chrome.

This is, like the previous Control-Tab, is only a step in the right direction. There will be plenty more to do from here. For instance, application icons are recognizable and therefore don’t need labels – tabs probably do. There are also ways to enable search and content organization from this window eventually – but I’ll blog about that later. For now, I just want to continue the discussion on Control+Tab that’s currently going on in bugs and hopefully reach a consensus on what to build for 3.1.

No Comments

Chime in Leave a Comment

  1. Gen Kanai says:

    Boriss, thank you for the update. I’m using Dao’s addon now and it’s getting a daily workout from me. My hand is still learning the keybindings for this and I’m not yet sure if what is currently default is best. I realize that is a challenging area but to hit 3 keys with 1 hand is tougher than say 2 with one and 1 with the other.

    (Irrespective of this, I personally don’t like the Snap url previews that come default with wordpress.com. Dunno what your thoughts are on this but…)

  2. jboriss says:

    Gen -

    Definitely it takes some getting used to. Do you find that the add-on makes sense with how you work and view content? That may be easier to answer once you get used to it, but I’d love to hear how you navigated tabs before Dao’s addon.

    Those snap preview are especially useless when the link goes to a bigger version of the link. :)

    - Boriss

  3. Gen Kanai says:

    The other thing I’ve noticed with the current default keybindings for this is that it’s pretty easy to hit Cmd+W by mistake as the W and A are near each other.

    Absolutely I myself and many others are now using many, many tabs so something like this is absolutely needed. The trick is the details of course.

    Will there be any way to navigate the collected view of tabs via the keyboard? If so, some guidance on how to do that would be important, imo.

  4. My biggest complaint with the current implementation on trunk is that I cannot see all my tabs. It looks like the mockups here solve that problem, so yay!

  5. David Naylor says:

    I have also found the Ctrl+Tab functionality to be very difficult to use since I often have more than just two tabs on the go at the same time.

    I like your suggestions. But I agree that websites probably need the titles visible. Also, I would suggest having the favicon visible, but in its recognizable 16×16 size. (When we switch between tabs in Firefox 3.0 one often uses titles + favicons as the first information to get to the right tab.)

  6. jboriss says:

    Gen – I’d hope that something like this would allow you to tab horizontally, and use arrow keys to navigate the grid.

    David – I agree. I didn’t put those on this mockup because I wanted to drive home the point that this has to look and feel native. But really, tabs aren’t applications and some differences for them can be made without breaking too much consistency.

  7. Jeria says:

    The suggestion above reminds me of IE7′s implementation.

    Would there be any scrollbars to see more tabs? Or would the preview just get smaller the way that IE 7 does it? It is difficult to see what page it is when the thumbnails get too small.

    Why not go all the way and also have a button like IE 7 where a single clicks show you the tab overview? It does not necessarily need to be binded to alt + tab.

  8. jboriss says:

    Jeria – I definitely wouldn’t rule out a way to access this from the chrome. As for seeing all vs scrollbars – considering the whole screen real estate is available, it seems you’d have to have one heck of a lot of tabs to need a scrollbar. That said, maybe seeing the tabs at a good size has benefits too. This is something I’d want to test before deciding on.

  9. Alex Faaborg says:

    This is great work Boriss, I like how you have merged the two use cases (quickly returning to the most recently used tab vs. invoking the UI to select something farther back in the MRU order). Some other thoughts:

    -it seems like we should add a very slight delay for displaying the UI like apple does, so when you command-tab very quickly between two apps you don’t see the UI quickly appear and disappear (this happens on Windows).

    -I wonder if focusing more on the upper left corner of the page would make the thumbnails easier to view, instead of downsizing the entire page.

  10. David Naylor says:

    Actually, after watching the first 15 or so minutes of Aza’s talk here:
    http://www.youtube.com/watch?v=EuELwq2ThJE

    …I’m beginning to feel more and more sceptical to the whole Ctrl+Tab thing. He really does have a point about the tab switching in Firefox 1.0 being better than in 2.0 and 3.0.

  11. Mike Beltzner says:

    The benefit of a fast-switching mechanism is, indeed, to switch quickly from the full set of things one has open. As mentioned in here, there’s a potential scaling problem, but there are some decent overflow patterns (pagination, scrolling, only showing the most recent N tabs by default with an indication that more are available, etc) which could be applied.

    I’m also eager to enable the browse -> search use case, where someone starts by flipping open the fast switch UI and then wants to narrow down the selection field based on the name of the tab. Potential feature creep, although app-switchers in OS are also providing this functionality and it’s been a long-asked-for UI addition in our product.

    Anyway – good stuff. Let’s get rolling on it.

  12. Olly says:

    One thing I’ve not seen explored as part of this debate is to use Exposé on OSX builds.

    The idea being that the user presses the appropriate F-key and Firefox displays all the tabs as separate boxes in Exposé. Of course there might be an issue for users with a metric-buttload of tabs (how does Exposé deal with that usually? Really tiny boxes?).

    I’ve also no idea if it’s actually possible…

  13. FWIW, GNOME only has that if you’re using Compiz–that is, if you have enabled Compiz and have a video driver that supports it (and the vast majority of people require a non-open-source driver to make that work).

    -Max

Trackbacks for this post

  1. Aza’s Thoughts » Firefox 3.1: Control-Tab Woes
  2. Tabbing Through the Tabs « Not The User’s Fault
  3. Tab View vs. Application View « Boriss’ Blog
  4. Dubroy.com/blog - Wrestling with Tabs
  5. New Control+Tab Discussion Thread « Boriss’ Blog
  6. Recent Links Tagged With "tabs" - JabberTags

Comments are now closed for this article.