Jump to content

Tab (interface)

From Wikipedia, the free encyclopedia

This is an old revision of this page, as edited by Taking Out The Trash (talk | contribs) at 01:47, 5 December 2021 (Reverted 1 edit by 174.247.224.89 (talk): Unexplained removal of content). The present address (URL) is a permanent link to this revision, which may differ significantly from the current revision.

"New Tab" redirects here. For the novel, see New Tab (novel). For other uses, see Tab (disambiguation).

Example of tabbed interface with two sets of tabs: Horizontal tabs, at the top, allow navigation to different pages within the Wiktionary website. Vertical tabs, to the left, represent languages in which a given spelling occurs, where the selected tab shows the word jam ('already') in Esperanto.

In interface design, a tabbed document interface (TDI) or Tab is a graphical control element that allows multiple documents or panels to be contained within a single window, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with web browsers, web applications, text editors, and preference panes, with window managers, especially tiling window managers, being lesser known examples.

GUI tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the desktop metaphor).

Tabs may appear in a horizontal bar or as a vertical list, of which the former takes typically less screen space whereas the latter can show more items at once while still having space for individual titles. Horizontal tabs may have multiple rows. Tabs may be organizable by changing their order through drag and drop, creating a separate window from an existing tab, and implementations may support range-selecting multiple tabs for moving, closing, and separating.[1]

History

The WordVision DOS word processor[2] for the IBM PC in 1982[3] was perhaps the first commercially available product with a tabbed interface.[3] PC Magazine later wrote that it "has served as a free R&D department for the software business—its bones picked over for a decade by programmers looking for so-called new ideas".[3]

HyperTIES browser and Gosling Emacs authoring tool with pie menus on the NeWS window system

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.[4]

The NeWS version of UniPress's Gosling Emacs text editor was another early product with multiple tabbed windows in 1988.[5] It was used to develop an authoring tool for Ben Shneiderman's hypermedia browser HyperTIES (the NeWS workstation version of The Interactive Encyclopedia System), in 1988 at the University of Maryland Human-Computer Interaction Lab.[6][7] HyperTIES also supported pie menus for managing windows and browsing hypermedia documents with PostScript applets.

While Boeing Calc already utilized tabbed sheets (as so called wordpads) since at least 1987,[8][9] Borland's Quattro Pro popularized tabs for spreadsheets in 1992. Microsoft Word in 1993 used them to simplify submenus.[3] In 1994, BookLink Technologies featured tabbed windows in its InternetWorks browser. That same year, the text editor 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, and Opera in 2000 (with the release of version 4 - although a MDI interface was supported before then), MultiViews October 2000, which changed its name into MultiZilla on 1 April 2001 (an extension for the Mozilla Application Suite[10]), Galeon in early 2001, Mozilla 0.9.5 in October 2001, Phoenix 0.1 (now Mozilla Firefox) in October 2002, Konqueror 3.1 in January 2003, and Safari in 2003. With the release of Internet Explorer 7 in 2006, all major web browsers featured a tabbed interface.

Users have quickly adopted the use of tabs in web browsing and web search. A study of tabbed browsing behavior in June 2009 found that users switched tabs in 57% of tab sessions, and 36% of users used new tabs to open search engine results at least once during that period.[11]

Numerous special functions in association with browser tabs have emerged since then. One example is visual tabbed browsing in OmniWeb version 5, which displays preview images of pages in a drawer to the left or right of the main browser window. Another feature is the ability to re-order tabs and to bookmark all of the webpages opened in tab panes in a given window in a group or bookmark folder (as well as the ability to reopen all of them at the same time). Links can most often be opened in several modes, using different user interface options and commands:

  • in a new main window
  • in the same main window and tab panel
  • in the same main window and a new tab panel, which is instantly activated
  • in the same main window and a new tab panel, which remains in the background until the user switches to it.

There are minor usability issues such as whether a new tab opens in the end of the tab list or next to its "parent". For example, Internet Explorer marks tab families with different colours.

Development

In 2021, researchers published the first in-depth study of Web browser tab interfaces in over a decade. They found that many people struggle with tab overload and conducted surveys and interviews about people's tab use. Thereby they formalized pressures for closing tabs and for keeping tabs open. The authors then developed related UI design considerations which could enable better tools and changes to the code of Web browsers – like Firefox – that allow knowledge workers and other users to better manage – and make use of – their browser tabs.[12][13]

An example of Mozilla Firefox with two tabs open. Each tab, here ordered in a horizontal row, shows a different webpage, thus allowing multiple pages to be contained within a single browser window.
Tab list on Kiwi browser, a mobile browser derived from Google Chromium. Both title and URL are shown and can be expanded through hovering.

Compliance with Microsoft User Interface Guidelines

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.[14] There is some debate about how the TDI fits in with the Microsoft Windows User Interface Guidelines. In many ways the Workbook window management model most closely resembles TDI.[15] 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 MS Windows.

Comparison to SDI

Advantages

Because the tabbed document interface holds many different documents logically under one window, it keeps the primary operating system interface free of the clutter that would be created by a large number of small child windows. Another advantage is that sets of related documents can be grouped within each of several windows. Tabbed web browsers often allow users to save their browsing session and return to it later.

Disadvantages

Geany text editor with vertically oriented tabs, showing the large number of documents that can be accommodated

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 display area, 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. Some prefer to have many tabs open, and some programs help making these compact yet identifiable,[16] while normally dealing with multiple rows of tabs in one window is seen to have two disadvantages:

  • It creates excess window clutter, unless it is limited to about 3 rows that can be scrolled by the mouse wheel.
  • It complicates what should be an easy-to-read dialog, and at the same time makes it easier to see the titles of many tabs at once.

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. Without such 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 the problems of the scalability of many tabs:

  • group tabs by dragging/moving them, and or freeze their position, and then reduce the width of individual tabs, so that more can fit within the available area, including multiple tab rows, and [17]
  • change the color of selected tabs or according to source,[18] along with the use of favicons for identification and tooltips on mouseover
  • 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[19][20]
  • discard tabs in favor of 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, and because it is now common to use displays which are considerably wider than needed for displaying documents and web pages. 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.

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

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 the user could stick onto the stack (represented as a "spike"), and the user could move the tabs to any edge.[4] 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.[citation needed] 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 or moving all others. Practically, however, most MDI environments provide for much richer window-switching functionality than SDI-oriented environments. 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.[21]

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. Tiling window managers such as Ion do 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 by KDE (available on Unix and Unix work-alikes, such as Linux, and Windows) 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.

Another strategy for dealing with the limitation that only one tabbed document would ordinarily be visible at one time is to allow a tab to be dragged outside the parent window and converted to a separate window (which can itself have multiple tabs). This is supported in the Google Chrome, Mozilla Firefox 3.5, and Internet Explorer 9 web browsers, for example.

Window managers that provide a tabbed document interface

The following window managers provide a tabbed document interface:

Patent dispute

Adobe Systems holds patents in the United States and Europe on certain uses of GUI tabs,[25] which are widely held to be trivial patents. There was prior art, in both GUI and text user interfaces (TUI).[citation needed]

Adobe used these patents to sue Macromedia Inc. for employing tabs in its Macromedia Flash product. Adobe won the case and $2.8 million in damages. However, Macromedia initiated a countersuit which ended in a $4.9 million ruling against Adobe. The suits were settled on undisclosed terms.[26] In 2005, Adobe ended further dispute between the two companies when it bought Macromedia for roughly $3.4 billion.

On April 18, 2007, the intellectual property agency IP Innovation LLC and its parent Technology Licensing Corporation filed a lawsuit against Apple Inc. regarding its infringement upon a US Patent originally filed by Xerox researchers in 1987.[27][28]

See also

References

  1. ^ Elliott, Matt (2014-01-28). "How to manipulate multiple tabs in Chrome or Firefox". CNET. Retrieved 2021-10-29.
  2. ^ Manes, Stephen (1984-04-03). "Taking A Gamble With Word Vision". PC Magazine - The Independent Guide To IBM Personal Computers. Vol. 3, no. 6. PC Communications Corp. pp. 211–221. ISSN 0745-2500. Archived from the original on 2015-03-17. Retrieved 2015-02-15.
  3. ^ a b c d Seymour, Jim (1994-03-15). "Everything Old Is New Again". PC Magazine. Vol. 13, no. 5. Ziff-Davis Publishing Company. pp. 99–100. ISSN 0888-8507. Retrieved 2015-02-15.
  4. ^ a b c Hopkins, Don (October 1989). "The Shape of PSIBER Space: PostScript Interactive Bug Eradication Routines". Don Hopkins' Web Site. Retrieved 2010-03-01.
  5. ^ Hopkins, Don (1988-08-17). "Email from Don Hopkins to James Gosling, David S H Rosenthal, Owen Densmore, Jerry Farrell about Text selection in NeMACS". Don Hopkins' Web Site.
  6. ^ Hopkins, Don (2005-09-29). "HyperTIES Hypermedia Browser and Emacs Authoring Tool for NeWS". Don Hopkins' Web Site. Retrieved 2010-03-01.
  7. ^ Hopkins, Don. "HCIL Demo - HyperTIES Authoring". YouTube.
  8. ^ Malloy, Rich (June 1987). "Spreadsheets - This new crop of advanced programs offers multidimensionality and natural language". BYTE. Review (Sommer 1987 Bonus ed.). p. 69–75. Retrieved 2020-02-12. [1][2][3]
  9. ^ corwyn. "Boeing Calc - The first truly 3-D spreadsheet". Archived from the original on 2006-02-19.
  10. ^ van Rantwijk, HJ. "Mozdev.org - multizilla: history". Mozilla. Retrieved 2010-03-01.
  11. ^ Jeff Huang, Ryen W. White (2010). "Parallel Browsing Behavior on the Web" (PDF). Proceedings of the 21st ACM Conference on Hypertext and Hypermedia (HT '10).
  12. ^ "Overcoming tab overload: Researchers develop tool to better manage browser tabs". techxplore.com. Retrieved 2021-06-14.
  13. ^ Chang, Joseph Chee; Hahn, Nathan; Kim, Yongsung; Coupland, Julina; Breneisen, Bradley; Kim, Hannah S; Hwong, John; Kittur, Aniket (2021-05-06). "When the Tab Comes Due:Challenges in the Cost Structure of Browser Tab Usage". Proceedings of the 2021 CHI Conference on Human Factors in Computing Systems. Association for Computing Machinery: 1–15. doi:10.1145/3411764.3445585. ISBN 9781450380966. S2CID 233987809. Available under [https://creativecommons.org/licenses/
  14. ^ "Design Specifications and Guidelines - Window Management". Microsoft Developer Network. Microsoft. Retrieved 2010-03-01.
  15. ^ "Design Specifications and Guidelines - Window Management". Microsoft Developer Network. Microsoft. Retrieved 2010-03-01.
  16. ^ http://forum.maxthon.com/viewthread.php?tid=80713&pid=528941&page=7&extra=#pid528941 [bare URL]
  17. ^ "Tab Mix Plus – Add-ons for Firefox". addons.mozilla.org. Retrieved 2018-04-16.
  18. ^ "ColorfulTabs – Add-ons for Firefox". addons.mozilla.org. Retrieved 2018-04-16.
  19. ^ Kozma, László (2007-04-10). "FishEyeTabs, tab zooming extension for Mozilla Firefox". Laszlo Kozma personal page. Retrieved 2010-03-01.
  20. ^ Kozma, László (2009-03-02). "FishEyeTabs". Mozilla. Retrieved 2010-03-01.
  21. ^ Christian (2006-10-22). "Opera Single Document Interface". Christian's MyOpera Blog. Opera Software. Archived from the original on 2008-09-07. Retrieved 2010-03-01.
  22. ^ "Fluxbox's old website". Archived from the original on 2011-07-26.
  23. ^ Hopkins, Don (ed.). "Demo of the Pie Menu Tab Window Manager for The NeWS Toolkit 2.0 (1991)" (QuickTime).
  24. ^ "PekWM features".
  25. ^ U.S. patent 5,546,528 for a "Method of displaying multiple sets of information in the same area of a computer screen"
  26. ^ "Adobe Wins Patent Trial Against Macromedia" (Press release). Adobe Systems. 2002-05-02. Retrieved 2010-03-01.
  27. ^ U.S. patent 5,072,412 for a "User Interface with Multiple Workspaces for Sharing Display System Objects"
  28. ^ Marsal, Katie (2007-04-21). "Apple's interface held to the fire in dubious suit". Appleinsider.com. Retrieved 2010-03-01.
Wikimedia Commons has media related to Tab (GUI).
Retrieved from "https://en.wikipedia.org/enwiki/w/index.php?title=Tab_(interface)&oldid=1058689833"