: What is the difference between an icon and a button? Since we are getting more UI questions here on icons and I didnt see this question here I thought it would be on topic to ask what the

@Jessie844

@Lauren Ipsum and @sambler have of course answered beautifully - I just thought I'd add a different perspective.

We tend to think of icons as those little digital images that almost always trigger some digital event of some sort. They do not have to trigger anything, there are examples of digital icons that are merely demonstrating a context or process.



However, icon is originally a word for image, referring to religious paintings particularly from the Eastern Catholic Church. Traditional icon painting have some pretty specific methods and materials. But never mind.



So what are icons? They more or less have an entire scientific field dedicated to them....:


Semiotics: is the study of signs and sign processes (semiosis),
indication, designation, likeness, analogy, metaphor, symbolism,
signification, and communication. Semiotics is closely related to the
field of linguistics, which, for its part, studies the structure and
meaning of language more specifically. However, as different from
linguistics, semiotics also studies non-linguistic sign systems.
(Wikipedia).


Pictograms, ideograms, icons convey some meaning by representing physical objects (or process). Roadsigns, metro maps, hazard signs, signage, wayfinding... all sorts of stuff have little images that we do not even notice that we notice. But we find the right toilet anyway (it is of course hilarious when cultural differences and misunderstandings mess that up).

Just to give you some pretty pictures, here are the icons used for the Olympics in Munich, 1972. They are certainly not inferior to more current sports imagery:



And here are some piss-takes on pictograms that can be pretty obscure. More over at airtoons:

Vote Up Vote Down

@Speyer780

An icon is representative of something. You can have a company newsletter with icons in the margin of each story representing HR, IT, Sales, Marketing, etc.

A button is by definition interactive. You click on it and something happens. It may have pictures, words, or both.

You can have an interactive icon which acts as a button, but if you click on a little ideogram and nothing happens, it's not a button.

Vote Up Vote Down

@Tiffany317

An icon is a small image, a button is a GUI widget that responds to a mouse click.

It is common to show an icon on a button. Sometimes the 'button' drawing is also disabled so the button appears to be nothing more than an icon.

So while they are two distinct things, developers often configure buttons so that the distinction is blurred.

Vote Up Vote Down