View source for Button (computing)

{{Short description|Graphical user interface element}}
{{for multi|the buttons used to identify a program used to build a web site|Web button|keyboard buttons|Keyboard (computing)}}

{{refimprove|date=April 2011}}
<!-- Unsourced image removed: [[File:Commandbuttons2.png|right|framed|Command buttons from Windows XP, Windows 2000, OS X and KDE 3.5]] -->[[File:Gimp-buttons.png|right|thumb|Different types of buttons in [[GTK]]]]
In [[computing]], a '''button''' (sometimes known as a '''command button''' or '''push button''') is a [[Graphical control element (software)|graphical control element]] that provides the user a simple way to trigger an [[event (computing)|event]], like searching for a query at a [[search engine]], or to interact with [[dialog box]]es, like confirming an action.<ref>[http://foldoc.org/button button] at [[FOLDOC]]</ref>

==Overview==
A typical button is a rectangle or rounded rectangle, wider than it is tall, with a descriptive caption in its center.<ref>{{Cite web |url=https://developer.mozilla.org/en/XUL/button |title=Mozilla button description |access-date=2009-09-18 |archive-date=2012-04-02 |archive-url=https://web.archive.org/web/20120402174040/https://developer.mozilla.org/en/XUL/button |url-status=dead }}</ref> However, a button is not always restricted to a rectangular shape. Other buttons may be square or round, with simple [[Icon (computing)|icons]].

The most common method of pressing a button is clicking it with a [[pointer (user interface)|pointer]] controlled by a [[mouse (computing)|mouse]] or [[touchpad]], but other inputs such as keystrokes can be used to execute the command of a button.

The sole requirement of button interaction is that the user can execute a command by a [[point-and-click|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]].<ref>[https://developer.mozilla.org/en/XUL/button#a-checkState checkState button attribute] in [[Mozilla]]'s [[XUL]]  {{Webarchive|url=https://web.archive.org/web/20120402174040/https://developer.mozilla.org/en/XUL/button#a-checkState |date=2012-04-02 }}</ref> These buttons will show a graphical clue (such as staying depressed after the mouse is released) to indicate the state of the option. Such a button may be called a latch button or a [[latching switch]].

A button often displays a [[tooltip]] when a user moves the pointer over it, especially if the button's content is a standalone icon. 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:
* An ''OK button'' for confirming actions and closing the windows
* A ''Cancel button'' for canceling actions and closing the [[window (computing)|window]]
* An ''Apply button'' for confirming actions without closing the window
* A ''Close button'' for closing windows after changes have already been applied

==Appearance==

=== macOS  ===
{{Update|section|date=June 2015}}
{{Further|Aqua (user interface)}}

Buttons in [[macOS]]'s [[Aqua (user interface)|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 ===
{{Further|Windows shell}}

Buttons in [[Microsoft Windows]] are usually rectangular, with mildly rounded corners in [[Windows XP]], [[Windows Vista|Vista]], and [[Windows 7|7]], in [[Windows 11]].  In [[Windows 8]], the buttons are rectangular with sharp corners.  A button with active [[focus (computing)|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 [[Computer monitor|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 (software)|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 operating systems|Mac OS]] and [[Microsoft Windows|Windows]].

=== HTML ===
{{Further|Web widget}}

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 browser]]s in different ways, typically either using the native button appearance of the underlying [[Operating system|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 anchor|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.

==References==
{{reflist}}

{{Graphical control elements}}

{{DEFAULTSORT:Button (Computing)}}
[[Category:Graphical control elements]]