HOME

TheInfoList



OR:

In interface design, a tab is a graphical user interface object that allows multiple
documents A document is a written, drawn, presented, or memorialized representation of thought, often the manifestation of non-fictional, as well as fictional, content. The word originates from the Latin ', which denotes a "teaching" or "lesson": ...
or panels to be contained within a single
window A window is an opening in a wall, door, roof, or vehicle that allows the exchange of light and may also allow the passage of sound and sometimes air. Modern windows are usually glazed or covered in some other transparent or translucent ma ...
, using tabs as a navigational widget for switching between sets of documents. It is an interface style most commonly associated with
web browser A web browser, often shortened to browser, is an application for accessing websites. When a user requests a web page from a particular website, the browser retrieves its files from a web server and then displays the page on the user's scr ...
s,
web application A web application (or web app) is application software that is created with web technologies and runs via a web browser. Web applications emerged during the late 1990s and allowed for the server to dynamically build a response to the request, ...
s,
text editor A text editor is a type of computer program that edits plain text. An example of such program is "notepad" software (e.g. Windows Notepad). Text editors are provided with operating systems and software development packages, and can be used to c ...
s, and preference panels, with
window manager A window manager is system software that controls the placement and appearance of window (computing), windows within a windowing system in a graphical user interface. Most window managers are designed to help provide a desktop environment. They ...
s and tiling window managers. Tabs are modeled after traditional card tabs inserted in paper files or card indexes (in keeping with the
desktop metaphor In computing, the desktop metaphor is an interface metaphor which is a set of unifying concepts used by graphical user interfaces to help users interact more easily with the computer. The desktop metaphor treats the computer monitor as if it is ...
). They are usually graphically displayed on webpages or apps as they look on paper. Tabs may appear in a horizontal bar or as a vertical list. Horizontal tabs may have multiple rows. In some cases, tabs may be reordered or organized into multiple rows through
drag and drop In computer graphical user interfaces, drag and drop is a pointing device gesture in which the user (computing), user selects a virtual object by "grabbing" it and dragging it to a different location or onto another virtual object. In general, i ...
interactions. Implementations may support opening an existing tab in a separate window or range-selecting multiple tabs for moving, closing, or separating them.


History

The WordVision DOS word processor for the
IBM PC The IBM Personal Computer (model 5150, commonly known as the IBM PC) is the first microcomputer released in the List of IBM Personal Computer models, IBM PC model line and the basis for the IBM PC compatible ''de facto'' standard. Released on ...
in 1982 was perhaps the first commercially available product with a tabbed interface. Don Hopkins developed and released several versions of tabbed window frames for the
NeWS News is information about current events. This may be provided through many different Media (communication), media: word of mouth, printing, Mail, postal systems, broadcasting, Telecommunications, electronic communication, or through the te ...
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. The
NeWS News is information about current events. This may be provided through many different Media (communication), media: word of mouth, printing, Mail, postal systems, broadcasting, Telecommunications, electronic communication, or through the te ...
version of UniPress's Gosling Emacs text editor was another early product with multiple tabbed windows in 1988. It was used to develop an authoring tool for Ben Shneiderman's
hypermedia Hypermedia, an extension of hypertext, is a nonlinear medium of information that includes graphics, audio, video, plain text and hyperlinks. This designation contrasts with the broader term ''multimedia'', which may include non-interactive linear ...
browser HyperTIES (the NeWS workstation version of The Interactive Encyclopedia System), in 1988 at the University of Maryland Human-Computer Interaction Lab. HyperTIES also supported pie menus for managing windows and browsing hypermedia documents with
PostScript PostScript (PS) is a page description language and dynamically typed, stack-based programming language. It is most commonly used in the electronic publishing and desktop publishing realm, but as a Turing complete programming language, it c ...
applets. While Boeing Calc already utilized tabbed sheets (as so-called ''word pads'') since at least 1987,
Borland Borland Software Corporation was a computing technology company founded in 1983 by Niels Jensen, Ole Henriksen, Mogens Glad, and Philippe Kahn. Its main business was developing and selling software development and software deployment products. B ...
's Quattro Pro popularized tabs for spreadsheets in 1992.
Microsoft Word Microsoft Word is a word processor program, word processing program developed by Microsoft. It was first released on October 25, 1983, under the name Multi-Tool Word for Xenix systems. Subsequent versions were later written for several other platf ...
in 1993 used them to simplify submenus. 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 An Internet Explorer shell is a class of computer program (web browser or otherwise) that uses the Internet Explorer browser engine, known as MSHTML and previously Trident. This engine is closed-source, but Microsoft has exposed an application p ...
NetCaptor in 1997. These were followed by several others like IBrowse in 1999, and
Opera Opera is a form of History of theatre#European theatre, Western theatre in which music is a fundamental component and dramatic roles are taken by Singing, singers. Such a "work" (the literal translation of the Italian word "opera") is typically ...
in 2000 (with the release of version 4 - although an MDI interface was supported before then), MultiViews October 2000, which changed its name into MultiZilla on April 1st, 2001 (an extension for the
Mozilla Application Suite The Mozilla Application Suite (originally known as Mozilla, marketed as the Mozilla Suite) is a discontinued cross-platform integrated Internet suite. Its development was initiated by Netscape Communications Corporation, before their acquisition ...
), 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 A safari (; originally ) is an overland journey to observe wildlife, wild animals, especially in East Africa. The so-called big five game, "Big Five" game animals of Africa – lion, African leopard, leopard, rhinoceros, African elephant, elep ...
in 2003. With the release of
Internet Explorer 7 Windows Internet Explorer 7 (IE7) (codenamed Rincon) is a version of Internet Explorer, a web browser for Windows. It was released by Microsoft on October 18, 2006. It was the first major update to the browser since 2001. It does not support ve ...
in 2006, all major web browsers featured a tabbed interface. Users 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 A search engine is a software system that provides hyperlinks to web pages, and other relevant information on World Wide Web, the Web in response to a user's web query, query. The user enters a query in a web browser or a mobile app, and the sea ...
results at least once during that period. Numerous additional browser tab capabilities 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).
Microsoft Internet Explorer Internet Explorer (formerly Microsoft Internet Explorer and Windows Internet Explorer, commonly abbreviated as IE or MSIE) is a retired series of graphical web browsers developed by Microsoft that were used in the Windows line of operating ...
marks tab families with different colours.


Development

Tab behavior in an application is determined by the underlying
widget toolkit A widget toolkit, widget library, GUI toolkit, or UX library is a library (computing), library or a collection of libraries containing a set of graphical control elements (called ''widgets'') used to construct the graphical user interface (GUI) of ...
(for example Firefox uses
GTK GTK (formerly GIMP ToolKit and GTK+) is a free software cross-platform widget toolkit for creating graphical user interfaces (GUIs). It is licensed under the terms of the GNU Lesser General Public License, allowing both Free software, free and ...
) framework. Due to lack of standardization, behavior may vary from one application to the next, which can result in usability challenges.


Tab hoarding

''Tab hoarding'' is digital hoarding of web browser tabs. Users may accumulate tabs as reminders of tasks to research or complete (rather than using dedicated reminder software). They may use multiple browser windows to organize tabs or direct focus; however, leaving multiple windows open can exacerbate tab clutter. Tab hoarding can lead to stress and information overload, distraction, and reduced computer performance. It can develop into emotional attachment to the set of open tabs, including fear of losing them upon a crash or other reboot, and conversely,
relief Relief is a sculpture, sculptural method in which the sculpted pieces remain attached to a solid background of the same material. The term ''wikt:relief, relief'' is from the Latin verb , to raise (). To create a sculpture in relief is to give ...
when tabs are properly restored. Tab hoarders have attributed the behavior to
anxiety Anxiety is an emotion characterised by an unpleasant state of inner wikt:turmoil, turmoil and includes feelings of dread over Anticipation, anticipated events. Anxiety is different from fear in that fear is defined as the emotional response ...
, fear of missing out, procrastination, and poor personal information management practices. The prevalence of tab hoarding is acknowledged by browser vendors such as Mozilla, and has inspired
memory Memory is the faculty of the mind by which data or information is encoded, stored, and retrieved when needed. It is the retention of information over time for the purpose of influencing future action. If past events could not be remembe ...
and tab management features in browsers and extensions. Such features include tab grouping, which allows related tabs to be visually organized and collapsed; conversion of tabs into a list of
hyperlink In computing, a hyperlink, or simply a link, is a digital reference providing direct access to Data (computing), data by a user (computing), user's point and click, clicking or touchscreen, tapping. A hyperlink points to a whole document or to ...
s; and alternative interface paradigms, such as framing high-level tasks as first-class objects instead of tabs. A 2021 study developed UI design considerations which could enable better tools and changes to the code of web browsers that allow
knowledge worker Knowledge workers are workers whose main capital is knowledge. Examples include ICT professionals, physicians, pharmacists, architects, engineers, scientists, designers, public accountants, lawyers, librarians, archivists, editors, and ...
s and other users to better manage and utilize their browser tabs.


Implementations

CSS framework A CSS framework is a library allowing for easier, more standards-compliant web design using the Cascading Style Sheets language. Most of these frameworks contain at least a grid (graphic design), grid. More functional frameworks also come with mor ...
s which have tabs include Bootstrap,
Tailwind CSS Tailwind CSS is an open-source CSS framework. Unlike other frameworks, like Bootstrap (front-end framework), Bootstrap, it does not provide a series of predefined classes for HTML element, elements such as buttons or tables. Instead, it creates ...
and Foundation.
Widget toolkit A widget toolkit, widget library, GUI toolkit, or UX library is a library (computing), library or a collection of libraries containing a set of graphical control elements (called ''widgets'') used to construct the graphical user interface (GUI) of ...
s which have tabs include
GTK GTK (formerly GIMP ToolKit and GTK+) is a free software cross-platform widget toolkit for creating graphical user interfaces (GUIs). It is licensed under the terms of the GNU Lesser General Public License, allowing both Free software, free and ...
using the widget as well as the Adwaita library using the widget. Qt using the widget.


See also

* Comparison of document interfaces *
Microsoft Internet Explorer Internet Explorer (formerly Microsoft Internet Explorer and Windows Internet Explorer, commonly abbreviated as IE or MSIE) is a retired series of graphical web browsers developed by Microsoft that were used in the Windows line of operating ...
marks tab families with different colours * IDE-style interface * Ribbon (computing)


References


External links


TabPanel Widget

ASP.NET AJAX Control Toolkit

Scriptaculous AJAX tabs

Tab Window Demo
deDevelopmentmo of the Pie Menu Tab Window Manager for The NeWS Toolkit 2.0 (1991). {{Graphical control elements Graphical user interface elements Document interface Graphical control elements