Tabbed document interface

In the area of graphical user interfaces, a tabbed document interface (TDI) is one that allows multiple documents to be contained within a single window, using tabs to navigate between them. It is an interface style most commonly associated with web browsers, web applications, text editors and preference panes.

The name TDI implies similarity to the Microsoft Windows standards for multiple document interfaces (MDI) and single document interfaces (SDI) but TDI does not form part of the Microsoft Windows User Interface Guidelines. [cite web|url=http://msdn2.microsoft.com/en-us/library/ms997505.aspx|title=Design Specifications and Guidelines - Window Management|work=Microsoft Developer Network|accessdate=2007-05-05]

History

The NeWS version of UniPress's Gosling Emacs text editor was the first commercially available product to pioneer the use of multiple tabbed windows in 1988. It was used to develop an authoring tool for the Ben Shneiderman's HyperTIES browser (the NeWS workstation version of The Interactive Encyclopedia System), in 1988. [cite web | url=http://www.donhopkins.com/drupal/node/101 | title=HyperTIES Hypermedia Browser and Emacs Authoring Tool for NeWS | author=Don Hopkins | date=September 29, 2005 | work=Don Hopkins' Web Site | accessdate=2007-05-05] HyperTIES also supported pie menus for managing windows and browsing hypermedia documents with PostScript applets. Don Hopkins developed and released several versions of tabbed window frames for the NeWS window system as free software, which the window manager applied to all NeWS applications, and enabled users to drag the tabs around to any edge of the window.cite web | url=http://www.donhopkins.com/drupal/node/97 | title=The Shape of PSIBER Space: PostScript Interactive Bug Eradication Routines | author=Don Hopkins | date=October 1989 | work=Don Hopkins' Web Site | accessdate=2007-05-05]

NOTE: HyperTIES was not a web browser since the first web browser came out in 1990, cite web | url=http://www.w3.org/People/Berners-Lee/WorldWideWeb.html | title=The WorldWideWeb browser | accessdate=2008-01-14] and the World Wide Web was not invented until 1990. cite web | url=http://www.w3.org/Proposal.html | title=WorldWideWeb: Proposal for a HyperText Project | accessdate=2008-01-14]

Six years later, in 1994, BookLink Technologies featured tabbed windows in its InternetWorks browser. That same year, a text editor called UltraEdit also appeared with a modern multi-row tabbed interface. The tabbed interface approach was then followed by the Internet Explorer shell NetCaptor in 1997. These were followed by a number of others like IBrowse in 1999, Opera in 2000 (with the release of version 4), Mozilla in 2001 (through the MultiZilla extension developed by HJ van Rantwijk in October 2000 and a built-in tabbed browsing mode added to Mozilla 0.9.5 in October 2001), Konqueror 3.1 in January 2003, and Safari in 2003. As of 2006, most graphical web browsers support a tabbed interface, including Internet Explorer 7. Software, such as the freeware AM Browser, is also available to add a TDI around earlier versions of Internet Explorer. OmniWeb version 5, released August 2004, includes visual tabbed browsing which displays preview images of pages in a drawer to the left or right of the main browser window. Avant Browser, Enigma Browser, Maxthon and Slim Browser are some of the most popular tabbed browsers using Internet Explorer's rendering engine.

Compliance To Microsoft User Interface Guidelines

There is some debate about how the TDI interface fits in with the Microsoft Windows User Interface Guidelines. In many ways the Workbook window management model most closely resembles TDI. [cite web | url=http://msdn2.microsoft.com/en-us/library/ms997512.aspx | title=Design Specifications and Guidelines - Window Management | work=Microsoft Developer Network | accessdate=2007-05-05] However this is a relatively recent addition to the Windows User Interface Guidelines, and most developers still prefer to view SDI or MDI as the primary document models for Windows.

Comparison to SDI

Advantages

One important advantage of the tabbed document interface is that it holds many different documents logically under the one window, instead of holding a large number of small child windows. Another is that sets of related documents can be grouped within each of several windows. Using tabs instead of new windows to display content creates a smaller memory footprint and therefore reduces the strain on the operating system.Fact|date=February 2008 Tabbed web browsers often allow users to save their browsing session and return to it later.

Disadvantages

Although the tabbed document interface does allow for multiple views under one window, there are problems with this interface. One such problem is dealing with many tabs at once. When a window is tabbed to a certain number that exceeds the available area of the monitor, the tabs clutter up (this is the same problem as with SDI but moved to another place in the user interface).

Multi-row tabs are a second issue that will appear in menu dialogs in some programs. Dealing with multiple rows of tabs in one window has two disadvantages:

*It creates excess window clutter
*It complicates what should be an easy-to-read dialog

Finding a specific tab in a 3 or 4 level tabular interface can be difficult for some people. Part of the issue with this difficulty lies in the lack of any sorting scheme. Tabs can be strewn about without any sense of order, thus looking for a tab provides no meaningful understanding of a position to a tab relative to other tabs. Additionally, the clutter created by multiple tabs can create a dialog that is unusually small, with the tabs above it dominating the window.

Thus, although tabbed windows are adequate in environments where there is a minimal necessity for tabs (around ten tabs or less), this scheme does not scale, and alternate methods may be required to address this issue.

Among the methods for addressing scalability of many tabs:
* reduce the width of individual tabs, so that more can fit within the available area
* introduce scrolling to enable tabs to occupy a non-visible region of the screen
* introduce sections through any of various means, to spread tabs out to multiple areas
* introduce real-time zooming of a tab, based on the position of the mouse cursor [cite web | url=http://lkozma.net/fisheyetabs | title=FishEyeTabs, tab zooming extension for Mozilla Firefox | author=LKozma | date=April 10, 2007 | work=Laszlo Kozma personal page | accessdate=2007-05-05]
* discard tabs in favor another interface element such as a listbox or drop-down list

Large numbers of tabbed windows scale better with the tabs along the left or right edges of the window, instead of the top or bottom edges. That is because tab labels are usually much wider than they are tall. The NeWS version of the UniPress Emacs text editor placed tabs along the right window edge, and laid windows out in a vertical column, so each tab was initially visible, and the user could use them to raise and lower the windows, drag them around in the column, or pull them out to anywhere on the screen.

[
PostScript programming environment for NeWS, with tabbed windows around objects on and off the stack.]

Better yet, tabbed window interfaces can give the user the freedom to position the tabs along any edge, so all four edges are available to organize different groups of tabs as the user or application sees fit. The PSIBER visual PostScript programming environment for NeWS had tabbed views that you could stick onto the stack (represented as a "spike"), and you could move the tabs to any edge. The NeWS pie menu and tab window manager enabled users to position the tabs anywhere along any edge, and the tabs popped up pie menus with window management functions, to uncover and bury windows, etc.

Comparison to MDI

Advantages

For people used to SDI, MDI can be confusing as windows can be hidden behind other windows Fact|date=September 2008. Some MDI applications lack a taskbar or menu to allow quick access to all windows, so for these applications in some cases a window can only be found by closing all others. On the other hand, since in TDI applications most tabs are visible and directly accessible, it is much harder for windows to get "lost". Some MDI applications such as Opera and Eudora also have this advantage, by having tabs to access the windows.

Disadvantages

TDI windows must always be maximized inside their parent window, and as a result two tabs cannot be visible at the same time. This makes comparing of documents or easy copy-and-pasting between two documents more difficult. Full MDI interfaces allow for tiling or cascading of child windows, and do not suffer from these limitations.

One example of an application that allows either TDI or MDI browsing is Opera. Using TDI by default, this application also supports full MDI and can also run as an SDI application. [cite web | url=http://my.opera.com/ResearchWizard/blog/operasdi | title=Opera Single Document Interface | author=Christian | date=October 22, 2006 | work=Christian's MyOpera Blog | accessdate=2007-05-05]

In order to mitigate these problems, some integrated development environments, such as recent versions of XEmacs and Microsoft's Visual Studio, provide a hybrid interface which allows splitting the parent window into multiple MDI-like "panes," each with their own separate TDI tab set. The Ion window manager does the same for the entire desktop.This provides many of the advantages of both MDI and TDI, although it can still be difficult for users to get used to. The Konqueror browser (available for the K Desktop Environment on Unix and Unix work-alikes, such as Linux) supports multiple documents within one tab by splitting documents. In a Konqueror tab, documents can be split horizontally or vertically, and each split document can be re-split.

ee also

*IDE-style interface
*Comparison of text editors

References

External links

* [http://developer.yahoo.com/ypatterns/pattern.php?pattern=navigationtabs Navigation] and [http://developer.yahoo.com/ypatterns/pattern.php?pattern=moduletabs Module] tabs at the Yahoo! Design Pattern Library.