Tab Pages Prototype

In this experiment, I’m interacting with a web page without activating the tab it’s contained in. Say you want to pause a song playing in one tab. You would have to switch from your current tab, pause, then switch back to your last tab. This demo shows the possibility of surfacing common functionality when you simply roll over the tab.

This demo was built as a Firefox add-on to quickly prototype the idea. Ideally, this would be a browser feature. Here is my original blog post on the idea.

How does the browser know to show a mini site when the tab is moused over?

This is up to the site developer. The developer would create a mini site, and added a link to it in the header of the main page. If the browser sees this link, it will know to display the mini site on rollover.

How do the two pages talk to each other?

Right now, I’m opening a web socket between the two pages (using to power this). This allows the two pages to communicate back and forth. So when I click a button in the mini page, a message is sent to the main page and handled accordingly. This goes both ways, too… a main page should be able to update content on the mini page as needed.

What else could this do?

  • It’s almost like giving each site it’s own add-on without having to create an add-on.
  • It could be powered by user scripts instead of waiting for developers to implement a mini.html page. However, lots of security risks there.

Possible Improvements

  • It might be nice for the tab to show some kind of visual cue that if they roll over it, something will happen.
  • It should have the option to be disabled for certain sites.
  • Could be triggered with key commands?
  • Would not open the panel immediately, give it a timer before opening