: How can I ensure that users will think a button is clickable? I had to make a page with a couple links on it, so I thought I would try to make the links big and decorative: But I ran

@Kristi927

I think the color and border style of your button is not the main issue of your button. It might be that it is too big! It looks more like a word/title in a frame than a button. Try to just make it a bit smaller so the text inside it fills out (at least for the height).

As others have said, it will also help to have it pop out somehow on mouseover.

Vote Up Vote Down

@Sherry646

Why don't you underline the text on the button (or make it blue even) - this way it will be perceived as a link and users will know clicking it would get them somewhere.

Vote Up Vote Down

@Dunderdale640

The key here is affordance - visual clues for the user to be able to determine the behaviour and intended use of something from a distance - before interacting with it - like a flat plate on a door says push and a handle says pull.

See bit.ly/irzAfP for my own examples of affordance.

The main cues are beveled edges and gradient fills for a 3D feel and if appropriate with distinct drop-shadowed edges indicating a real raised and rounded button that makes you just feel you want to push it, combined with a clear call to action such as an appropriate label and/or well chosen icon. Note that rounded corners are more friendly and square corners seem harsh to the eye.

See also my tutorial on creating simple metal and glossy/glass effect buttons using Inkscape: bit.ly/iV6hHD

Vote Up Vote Down

@Berumen635

you should use two kind of image one is on active and one is normal state normal state will look bit embossed

attaching a SS and see how they clarifying different stats of a button,



and whenever user get on your button change cursor to hand it will feel like link,if possible you can write in small click here to instal..or you can point this button with the help of any arrow or something like that...

see how others showing there download/install buttons.





Follow these tutorial to create such nice looking buttons


Create a glossy download button
for creating some attractive
buttons...

Vote Up Vote Down

@Nickens508

This isn't really a "graphic design" answer, but you may also want to see if you can change the text. In your examples, I don't think the art of the "install" button is particularly more button-like than your Outlook button. However, the text on it is a well-known verb so it is associated with performing an action. In the same vein, "Launch Outlook" may attract more clicks than simply "Outlook".

From a graphics standpoint, (and further to jhocking & luckycypher's comments), some other things you could try:


Make the edges glow on hover
change background/border color schemes on hover
add a subtle shadow (with or without beveling the surface) so the button appears raised from the page
add a small icon next to the text to indicate what action is to be performed (if I 'Outlook', what am I doing?)
place your button in a location where other buttons are typically placed on your site
make the button theme match other navigation links/buttons on the site.


You could also try asking over on UX for other UI-centric thoughts.

Vote Up Vote Down

@Cody3331749

Bevel the graphic so it looks 3 dimensional.

Vote Up Vote Down