Design vs Art Blog

Action buttons are a way to represent the beginning of an action. There are HTML buttons and image buttons. It is very important that image action buttons look like buttons, with some 3D effect. For example at Twitter all the buttons are flat, thing that could erode usability and bring confusion to the user.

Twitter Sign In flat button

I wrote about this topic before but I would like to show you other examples of action buttons I have found.

Google Mail "Send Invite" button

h5.com "Find Friends" button starts the search process

Ebay "Sign In" 3D button starts the process

Adobe Buttons start the download process

The "Sign In" button at Ta-da List is just perfect. A user can not get confuse.

Popularity: 13% [?]

Placing action buttons in the right position is something that could improve usability and the whole user experience at your site. Action buttons are used when user input is required. For example a "vote" or "add to cart" button (see more on action buttons).

"Placing a checkout button on a visible location is very important and will prevent users from flying away…"

The checkout button is an action one, it’s used at online shop websites to start the checkout process that finishes a purchase. Placing a checkout button on a visible location is very important and will prevent users from flying away from the website just before buying the products. Once again, this is a clear example of how usability can have an important impact on sales.

Best Buy, the online retailer for electronics, places the checkout button in a position that could be out of the sight of the user if she has a small screen or if the screen resolution is too big. In this example, the user has to scroll down to see the checkout button (below the red line).

Amazon has a smart design, they place the Proceed to Checkout button not only at the bottom of the page but also in a very top position. This way, there is no chance not to see the checkout button.

Popularity: 18% [?]