Button (computing)

Last updated
Different types of buttons in GTK Gimp-buttons.png
Different types of buttons in GTK

In computing, a button (sometimes known as a command button or push button) is a graphical control element that provides the user a simple way to trigger an event, like searching for a query at a search engine, or to interact with dialog boxes, like confirming an action. [1]

Contents

Overview

A typical button is a rectangle or rounded rectangle, wider than it is tall, with a descriptive caption in its center. [2] The most common method of pressing a button is clicking it with a pointer controlled by a mouse, or a touchpad, but other input such as keystroke can be used to execute the command of a button. However, a button is not always restricted to a rectangular shape. The sole requirement of button interaction is that the user can execute a command by a click action. Thus, pictures and background areas can be programmed as buttons. When pressed, in addition to performing a predetermined task, buttons often undergo a graphical change to mimic a mechanical button being depressed.

Depending on the circumstance, buttons may be designated to be pushed only once and execute a command, while others may be used to receive instant feed back and may require the user to click more than once to receive the desired result. Other buttons are designed to toggle behavior on and off like a check box. [3] These buttons will show a graphical clue (such as staying depressed after the mouse is released) to indicate the state of the option.

A button often displays a tooltip when a user moves the pointer over it. The tooltip serves as built-in documentation that briefly explains the purpose of the button. If you hover your mouse over the blue window button below (without clicking it or moving your mouse), it will display a text saying "Window (computing)."

Some very common incarnations of the button widget are:

Appearance

macOS

Buttons in macOS's Aqua interface are usually depicted as rounded-rectangles of crystallized glass. Normally these buttons are light grey in color and turn blue when pressed. The button with keyboard focus (selectable with the spacebar) appears with a blue glow surrounding it. The default button in an active window (selectable with the return key) animates between a bright blue and a darker blue (the same color as a pressed button).

Also used, primarily within application toolbars, are slightly rounded rectangles with a light grey metallic appearance. These buttons appear darker and "pushed inward" when pressed.

Window management controls appear in the top left corner of each window. These buttons are similar in style to standard aqua buttons, but are color-coded as a memory aid. From left to right, these are: "Close Window", shown in red; "Minimize Window", shown in yellow; and "Zoom", shown in green, which causes the window to resize to best fit its contents.

Windows shell

Buttons in Microsoft Windows are usually rectangular, with mildly rounded corners in Windows XP, Vista, and 7, in Windows 11. In Windows 8, the buttons are rectangular with sharp corners. A button with active focus is shown with a black dotted line just inside the border of the button. In addition, more recent versions, the default button is shown with a blue border. In Windows Vista and Windows 7, the default button will slowly fade between its normal appearance and the blue border. Window management controls are in the upper right-hand corner of the application window, and, from left to right: "minimize" the window (causing it to disappear into the taskbar at the bottom of the screen); maximize the window (causing it to expand to cover the whole screen; if the window is already maximized, the button will restore it to its previous size and position); and close the window.

Linux and other Unix-like systems

The appearance and behavior of buttons in Linux and other Unix-like operating systems is defined primarily by which widget toolkit is being employed, the most popular being GTK and Qt, though other toolkits are used as well. The use of multiple toolkits can lead to less uniform look and feel across applications. Most widget toolkits also have theming capabilities, so there is no single standard appearance as there is with Mac OS and Windows.

HTML

Buttons appear as elements of HTML forms to carry out actions such as clearing user input or submitting the form contents to the server. Buttons specified in HTML may be rendered by web browsers in different ways, typically either using the native button appearance of the underlying OS, or by using a button definition from within the browser. Buttons may also be styled by the developer of the web site the form appears on by using cascading style sheets.

HTML links are sometimes represented by a graphic closely resembling a button. Sometimes this type of link is used in advertisements to induce the user to click the ad and visit the advertiser's site.

Related Research Articles

<span class="mw-page-title-main">Scrollbar</span> Graphical user interface element

A scrollbar is an interaction technique or widget in which continuous text, pictures, or any other content can be scrolled in a predetermined direction on a computer display, window, or viewport so that all of the content can be viewed, even if only a fraction of the content can be seen on a device's screen at one time. It offers a solution to the problem of navigation to a known or unknown location within a two-dimensional information space. It was also known as a handle in the very first GUIs. They are present in a wide range of electronic devices including computers, graphing calculators, mobile phones, and portable media players. The user interacts with the scrollbar elements using some method of direct action, the scrollbar translates that action into scrolling commands, and the user receives feedback through a visual updating of both the scrollbar elements and the scrolled content.

In computing, a window is a graphical control element. It consists of a visual area containing some of the graphical user interface of the program it belongs to and is framed by a window decoration. It usually has a rectangular shape that can overlap with the area of other windows. It displays the output of and may allow input to one or more processes.

<span class="mw-page-title-main">Text box</span> Boxes where text is entered in computing

A text box is a control element of a graphical user interface, that should enable the user to input text information to be used by a program. Human Interface Guidelines recommend a single-line text box when only one line of input is required, and a multi-line text box only if more than one line of input may be required. Non-editable text boxes can serve the purpose of simply displaying text.

<span class="mw-page-title-main">Checkbox</span> Element of graphical user interfaces

A checkbox is a graphical widget that allows the user to make a binary choice, i.e. a choice between one of two possible mutually exclusive options. For example, the user may have to answer 'yes' (checked) or 'no' on a simple yes/no question.

<span class="mw-page-title-main">Drag and drop</span> Action in computer graphic user interfaces

In computer graphical user interfaces, drag and drop is a pointing device gesture in which the user selects a virtual object by "grabbing" it and dragging it to a different location or onto another virtual object. In general, it can be used to invoke many kinds of actions, or create various types of associations between two abstract objects.

The taskbar is a graphical user interface element that has been part of Microsoft Windows since Windows 95, displaying and facilitating switching between running programs. The taskbar and the associated Start Menu were created and named in 1993 by Daniel Oran, a program manager at Microsoft who had previously collaborated on great ape language research with the behavioral psychologist B.F. Skinner at Harvard.

<span class="mw-page-title-main">Aqua (user interface)</span> User interface of macOS by Apple

Aqua is the graphical user interface, design language and visual theme of Apple's macOS and iOS operating systems. It was originally based on the theme of water, with droplet-like components and a liberal use of reflection effects and translucency. Its goal is to "incorporate color, depth, translucence, and complex textures into a visually appealing interface" in macOS applications. At its introduction, Steve Jobs noted that "... it's liquid, one of the design goals was when you saw it you wanted to lick it".

<span class="mw-page-title-main">Graphical widget</span> Element of interaction in a graphical user interface

A graphical widget in a graphical user interface is an element of interaction, such as a button or a scroll bar. Controls are software components that a computer user interacts with through direct manipulation to read or edit information about an application. User interface libraries such as Windows Presentation Foundation, Qt, GTK, and Cocoa, contain a collection of controls and the logic to render these.

<span class="mw-page-title-main">Window manager</span> Type of system software

A window manager is system software that controls the placement and appearance of windows within a windowing system in a graphical user interface. Most window managers are designed to help provide a desktop environment. They work in conjunction with the underlying graphical system that provides required functionality—support for graphics hardware, pointing devices, and a keyboard—and are often written and created using a widget toolkit.

In human–computer interaction, a cursor is an indicator used to show the current position on a computer monitor or other display device that will respond to input.

<span class="mw-page-title-main">GNOME Terminal</span> Terminal emulator from GNOME

GNOME Terminal is a terminal emulator for the GNOME desktop environment written by Havoc Pennington and others. Terminal emulators allow users to access a UNIX shell while remaining on their graphical desktop.

A menu bar is a graphical control element which contains drop-down menus.

Tkinter is a Python binding to the Tk GUI toolkit. It is the standard Python interface to the Tk GUI toolkit, and is Python's de facto standard GUI. Tkinter is included with standard Linux, Microsoft Windows and macOS installs of Python.

The Windows shell is the graphical user interface for the Microsoft Windows operating system. Its readily identifiable elements consist of the desktop, the taskbar, the Start menu, the task switcher and the AutoPlay feature. On some versions of Windows, it also includes Flip 3D and the charms. In Windows 10, the Windows Shell Experience Host interface drives visuals like the Start Menu, Action Center, Taskbar, and Task View/Timeline. However, the Windows shell also implements a shell namespace that enables computer programs running on Windows to access the computer's resources via the hierarchy of shell objects. "Desktop" is the top object of the hierarchy; below it there are a number of files and folders stored on the disk, as well as a number of special folders whose contents are either virtual or dynamically created. Recycle Bin, Libraries, Control Panel, This PC and Network are examples of such shell objects.

<span class="mw-page-title-main">Workbench (AmigaOS)</span> Graphical user interface for the Amiga computer

Workbench is the desktop environment and graphical file manager of AmigaOS developed by Commodore International for their Amiga line of computers. Workbench provides the user with a graphical interface to work with file systems and launch applications. It uses a workbench metaphor for representing file system organisation.

<span class="mw-page-title-main">Features of the Opera web browser</span> List of software application features

This article details features of the Opera web browser.

fpGUI Graphical user interface toolkit in Object Pascal

fpGUI, the Free Pascal GUI toolkit, is a cross-platform graphical user interface toolkit developed by Graeme Geldenhuys. fpGUI is open source and free software, licensed under a Modified LGPL license. The toolkit has been implemented using the Free Pascal compiler, meaning it is written in the Object Pascal language.

ReAction GUI is the widget toolkit engine that is used in AmigaOS 3.2–4.1.

<span class="mw-page-title-main">Mouse button</span> Electric switch on a computer mouse

A mouse button is an electric switch on a computer mouse which can be pressed (“clicked”) to select or interact with an element of a graphical user interface. Mouse buttons are most commonly implemented as miniature snap-action switches.

References

  1. button at FOLDOC
  2. "Mozilla button description". Archived from the original on 2012-04-02. Retrieved 2009-09-18.
  3. checkState button attribute in Mozilla's XUL Archived 2012-04-02 at the Wayback Machine