Semantically Grouped Browser Tabs Steve Jb

By SteveJB (Steve J Bayer) For Mozilla Labs Concept Series Design Challenge Summer 09 This work is licensed under a Creative Commons Attribution 3.0 United States License Semantically Grouped Browser Tabs

Reinventing Tabs in the Browser: How can we create, navigate and manage multiple websites within the same browser instance?

The idea: Group tabs that have similar information. Standard Tabs in the Tab Bar Tab Groups in the Tab Bar Collapsed Tab Group, Stand alone tab and an expanded Tab group.

Tab Groups based on shared Information: The row of tabs in the image above has 6 tabs in total. 3 tabs are about the 'Eiffel Tower,' 1 tab links to a page about the 'Champ De Mars' and the last visible 2 tabs are about 'Gustave Eiffel.' Since the first 3 tabs contain information about the Eiffel Tower, they can be grouped together into a tab group about the Eiffel tower. The last 2 tabs both contain information about Gustave Eiffel and can be grouped together as well. The image below, represents how the above tabs can be grouped in the tab bar: Each tab group has a text label which represents the information that the tabbed pages have in common with each other. To the right of the tab group label is an X button that can close all the tabs in the tab group and to the left of the group label is a button to minimize the tab group into a single tab.

Collapsing and Expanding Tab Groups: If the Eiffel Tower tab group were minimized (this can happen manually by clicking on the minus button to the left of the tab label of an open tab group, or tab groups can automatically collapse themselves if they do not contain the currently open, active tab), the tabs would appear similar to the image below: The tab group now appears similar to a single tab. The collapsed tab group consists of the label of the tab group, a number to represent the number of tabs in the group and an X button to close the entire tab group. If the number in the collapsed tab group (which represents the number of tabs in a collapsed tab group) were clicked, the tab group expands to show all its tabs.

The inspiration behind the idea: Quite a few websites today use categories to tag information on a page. Grouping articles into categories is especially useful when there are scores of articles on a website and quite a few articles have similar topics. On a website with categories, users can click on a title of a particular category and they are then taken to a list of articles sharing that category term. An article does not have to be defined under a single category and users can find the same article listed under multiple categories. The image below displays a blog entry titled 'Browser Dock' with the tags 'browser,' 'docked website urls,' 'experience design' and 'Interaction Design.' Similar to how websites categorize articles based on frequently written topics, a browser can group tabs whose web pages share similar information.

Integrating content categories to group browser tabs: Websites that are well structured also include category tags of a page into the meta keywords tags which are placed in the header section of a web pages HTML markup (which can be seen by viewing the page source.) In addition to picking up meta keywords from html markup, semantically marked up page content (eg. RDFa tags) could be read by the browser for even more accurate tab grouping. A browser could pick up pages that share meta keywords and semantically marked up information and group tabs of website pages with shared information together.

How semantic tab grouping can benefit casual web browsing: A user, such as myself, can have the browser open while networking on facebook, researching work and also have tabs created from a few miscellaneous links that friends have sent from an instant messaging service such as Gtalk, Window Live Messenger or Twitter. The browser can automatically create a single set of tabs for facebook pages and separate tab groups for each particular topic that a user is researching that a browser can recognize by reading the meta data and semantic data within the web pages. When links sent from instant messaging services share similar information, the browser can create tabs groups based on the shared information within the web pages..

More detailed information on tab grouping for more intensive browsing activities: When searching for information on the Eiffel tower, a user (myself in this case) performs a google search for the Eiffel tower, opens links from the search results, while reading a few of the pages in the linked results, the user opens up a few in page links to information that is of further interest, the user then decides to read more about its founder (Gustave Eiffel) and finally decides to focus their interest on the river Seine. On the next slide, there is an image that displays how the default tab history (accessed by clicking on the icon to the extreme right of the tab bar in firefox) appears after performing the above activities:

Default Tab History Notes: - Pages are ordered based on when the tab was opened. - Difficult to browse through tabs based solely on the page title and bookmark icons. - Duplicated Tabs.

Tab History with Semantically Grouped Tabs

Tab History with Semantically Grouped Tabs Groups of tabs labeled according to a shared content category. The Number of pages sharing a category term is displayed next to the tab group label. When tab groups are collapsed, the Standard Tab History appears below the tab groups.

Tab History with an expanded Tab Group Container

- Tabs are ordered according to the relevance of the category title and the content of the tab. - Duplicate copies of pages within a tab group are removed. - [ Not shown ] pages can appear in more than one tab group. - Optionally, the standard tab history list can hides pages that are already on display when a tab group is opened. Tab History with an expanded Tab Group Container

Conclusion There are issues about pages existing on the web today that do not have meta keywords in their HTML markup's header tags. In the immediate future, the adoption of semantic tagging may not be widespread or accurately integrated into every website building system. Despite the above issues: Grouping tabs could be the first step towards more efficient tab management. Grouping tabs that have similar information can make it easier for users to find information when browsing through dozens of open tabs.

Semantically Grouped Browser Tabs Steve Jb

by SteveJB on Jun 03, 2009

Accessibility

Categories

Tags

Upload Details

Usage Rights

1 Embed 1

Statistics

Semantically Grouped Browser Tabs Steve Jb — Presentation Transcript