How to use “Call to Action” to Make Your Website More Successful

---

Example 3: FatCow

The call to action here is the bright orange/yellow “Get Started!” button. It sticks out well because of 2 factors. (1) It’s the only significant object colored yellow, and (2) there is a green arrow-like structure above pointing directly to it. They’ve used a glossy effect on the button and placed a drop shadow. on the “Get Started!” text to make it stand out..

---

Example 4: Red is White

In this example, we can see two different call to action’s taking place. The most prominent call to action is the “PRE-ORDER” button, which sticks out the most because it’s position to the left of the screen, and contrasts the most with the black background and the bright pink button color.

---

Example 5: Slack

The call to action here is the big “Continue” button, and it’s emphasized with a 1 pixel green border around the container that surrounds it. The button uses a green gradient, a drop shadow. on the text as well as a light white-to-green gradient on the text.

---

Elements of Successful Call To Action

• Contrast
  Anything you want people to see and take action on needs to be easily seen. The more your buttons or your forms contrast with the background they’re placed on, the more people are likely to see it.
• Stroke
  Adding a stroke (or outline) can also create an extra element of contrast. It’s not always 100% necessary, but if you can add a stroke in a way that does not clash with the design, go for it!
• Gradients
  Gradients can be a great way to make elements stand out more. In almost every example above, a gradient was used in some form. Be careful not to misuse your gradients, they can very easily become an eyesore than a beneficial factor of your design.
• Drop Shadows
  As with gradients, shadows can make elements stick out. But even more so than gradients, drop shadows are almost always misused by amateur designers. A drop shadow can either be a great asset to your design, or the death of your design by making it look cheesy. If you look in the examples above, you will see when drop shadows are used, they’re used very conservative.

---

Split-Testing Call to Action

If your goal is to maximize orders, leads, followers, subscribers, or any type of data from the result of visitor action, split testing is a must. Simple A/B split testing can reveal design flaws and lead to significant increases in conversions. A fatal flaw of designers can be ego, thinking that their first attempt is their best attempt which is hardly ever the truth. Often times one simple change is all it takes to create a XX% increase of conversions.

There are many split-testing tools available, but a great one to start out with is Google’s Website Optimizer. It’s 100% free and offers an easy way to get your feet with split testing.

---

Authors Comment

---

Pages: 1 2