CTAs_text

Calls to action – or CTAs – help websites make a connection with site visitors. If you don’t make a connection and your reader leaves and goes to another site, you may never see him again. With more and more websites coming online every day, it is vital that you not only put CTAs in place, but also that you write effective ones that will entice your site visitors to take action.

In an analysis of more than 93,000 CTAs, it was found that the ones that targeted users based on personas were viewed 42 percent more than generic CTAs. This means you want to create a funnel of CTAs that target your reader, offering different things and different wording, depending on what the site visitor is looking for at any given time.

The place where many Web designers fail is in not adding CTAs at all or adding CTAs that aren’t targeted to turn website visitors into conversions. If you’re going to take the time to add a CTA, take the time to add one that will work.

Make CTAs Work for You

The best calls to action are not only targeted to what the site visitor wants, but they also contain other elements that will entice the reader to click on the CTA.

There are 20 websites below that use amazing CTAs that:

  • Are highly targeted to a specific persona
  • Are colorful
  • Demand an action
  • Entice the reader with the promise of something free or discounted
  • Get them to call or sign up for more information

At the same time, the overall design of the page needs to draw the reader’s eye to the CTA and thus encourage the person to convert to a subscriber or customer rather than bouncing away from the page.

Don’t just assume that a CTA should be placed above the fold, or first thing, on the page. Instead, take into account the entire site when making a decision on where to place the CTA.

There are many factors that can impact how successful a CTA is. You should do A/B testing and try different colors, words and even positions on the page to find out what works best with your audience.

Even the size of the CTA can make a difference in how high the CTA converts. For example, making the CTA button just 20 percent larger can result in a higher success rate for conversions, because the reader’s eye is drawn to the call to action.

20 Samples of Excellent CTAs

1. Here Is Today

Here Is Today offers a simple graphic representation of time. The CTA is a simple invitation of the word “Okay” and a plus sign. Click on it and the image expands to show the month, year, century, millennium, epoch and so on. Once you click the first call-to-action text, a second option of going back in time appears next to the primary CTA.

2. Cienne NY

cienne_ny

Cienne New York has a very minimalist design. The full-page-width image fills the background. Then, they invite you to “Shop.” Even more subtle is the arrow near the middle of the page that invites the user to scroll down and look at the current product offerings. While the arrow serves as a CTA, there are no words to accompany the graphic.

What makes the page unique is the simplicity of vivid images and short phrases inviting the user to “shop dresses,” “shop tops” or “follow on Instagram.” Limiting the number of choices funnels site visitors directly where Cienne New York wants them to go.

3. Penxo

penxo

The Penxo pencil offers an elegant and functional design in refillable lead pencils. The majority of the page shows an image of the Penxo pencils, but then there is a pop of color that serves as the CTA button and reads “Preorder: Shipping Now.” The words invite the user, but also create a sense of urgency because shipping is on the horizon.

Adding a pop of color for the CTA button makes it stand out from the rest of the page in stark contrast. Contrast draws the eye of the user and makes them want to take action.

4. Crazy Egg

crazy_egg

Everything on the landing page steers site visitors to the CTA on Crazy Egg. There is an illustration of two people in the basket of a hot air balloon. The woman holds binoculars pointed toward the CTA, and the man is pointing at it. Elements directing attention to the button pull the reader’s eye over to the action the site wants them to take.

The call to action only requires the user to start with their website URL, and then invites with the first-person narrative “Show me my Heatmap” and an arrow. Again, the arrow points the way toward the desired action.

5. KFC

KFC offers a simple option of finding their restaurants by location. The CTA appears near the bottom right of the landing page but draws the eye because it’s a pop of brilliant red, which also matches their brand color palette.

Once you click the CTA, the site invites you to enter your ZIP code or city and can further refine your choices to restaurants offering catering or free Wi-Fi.

6. Levy Online

levy_online

Levy steps out from the crowd and lists their phone number in an easy-to-find spot. Adding additional contact information builds a sense of trust with consumers because they know they can reach the company quickly.

In a recent study, researchers discovered 69 percent of respondents distrusted advertising from a brand. Another 37 percent stated they trust brands less today than they used to.

Levy invites site visitors to call and find out how they can help and places their CTA above the fold as well as at the top of every page of their website. They repeat contact information in the footer.

7. Mailchimp

mail_chimp

Mailchimp uses a contrasting color to draw user attention to the CTA. They offer a free account for up to 2,000 subscribers and 12,000 emails per month to let people try out their service. Once you go over that amount, they offer a variety of plans, depending upon your needs. Providing a smaller, free plan attracts people interested in this service. Users can test out what Mailchimp offers before committing to a monthly fee.

Their CTA repeats in the header, where users can either log in or sign up for the free account. The main CTA button is larger than the other buttons on the page, which also draws the eye.

 

8. Netstager

netstager

Netstager offers dual CTA buttons, capturing user attention but also allowing for site visitors who already know their work and don’t need to see examples. For first-time visitors, clicking on the “View Our Work” button takes them to a page portfolio filled with examples of web design, mobile apps and a variety of logo work.

On the site, users find multiple ways to contact the company. Clicking on “Get a Quote” takes the user to a contact form with just a few fields, but also provides the company’s address, phone number and email.

9. Beyond

beyond

A recent survey found 90 percent of millennials state authenticity from a brand matters, but generation X comes in right behind them at 85 percent and baby boomers at 80 percent. Beyond seems to understand the desire for transparency and information with their CTA, which invites the user to “Read More.” Clicking on the CTA button takes the site’s visitor to a page that details what drives them as a brand.

10. Wilsen Davil

wilsen_devil

Davil’s portfolio has a casual feel to it, and the CTA button matches the overall tone of the page. Davil starts by telling a little about himself and then follows with the CTA that reads “See my Works.”

Matching the call to action to the mood of the page engages the user and avoids confusion over what your personality is.

11. Square

Square offers options that funnel new users toward the type of account they need. Their focus is on business owners and they provide solutions for “every business,” including two filters above the fold. Two boxes outlined in white with a transparent background appear, and as the user makes choices, the background image changes slightly.

The options include selecting business size and type, and the CTA reads “Sign up With Square.” Adding filters creates a more personalized experience for users.

12. Uber

uber

Uber’s website has a very minimalist look as well, with limited text and photos. There is plenty of white space on the page, which draws the eye to the CTA button “Sign up to drive.” The use of arrows entices visitors to click on the button. There is also a CTA for getting a ride with Uber, but it isn’t as pronounced as the drive button, showing this particular landing page focuses mainly on acquiring drivers for the company.

13. GoToMeeting

GoToMeeting snags the interest of potential customers by offering a discount when people sign up. The CTA “Buy Now” button is in bright orange in front of a dark solid background. However, they also offer a free 14-day trial and a separate CTA just under the first.

14. Wufoo

wufoo

Wufoo offers both a free account and a pro account for their online forms, so they state that upfront and show consumers the options available. The two CTA buttons sit side-by-side above the fold. One is a bright blue and the other a bright green, but both pop against the coral background. Wufoo’s free option allows users to try the service, but the pro account enables them to skip right to the rich features that package includes.

The free account lets visitors create five forms, but the site also offers pro packages that allow business owners to create 10 forms and 1,000 entries, unlimited forms and 5,000 entries, or unlimited forms and 25,000 entries. Any needs beyond that require users to sign up for their ultimate package.

15.Nutrisystem

Nutrisystem uses a CTA that directly targets their target audience. In addition to two bright orange CTAs inviting users to “Order Now” or “Shop Plans,” there is a green invitation for a free diet analysis.

16. Sriracha2Go

s_2_go

One thing Sriracha2Go does that works particularly well for an e-commerce site is explaining the advantages of their product above the CTA button, before inviting users to “Buy Now.”

The image serves as a sort of CTA of its own by showing the portable condiment bottle is a mere 1.6 inches by 4.4 inches, fitting neatly into a backpack or purse.

17. Backlinko

The entire focus of this page is getting those who land on the page to sign up for Backlinko’s mailing list. Note the arrow pointing to the form field. A bright CTA pops against the white area and situated within the field itself.

18. Zuli

zuli

Zuli offers smart plugs that allow users to control appliances and lights from a single app. Their landing page features a transparent CTA button that allows the background to show through, but is outlined in a vivid green that stands out against the wood tones of the background. They also add a button titled “Watch Video” in an attempt to teach the user more about their product.

19. Panic

panic

Panic features an animated background on their homepage with a simple call to “View Showreel” and an arrow. The overall look meshes perfectly with the tone of the page. Click on the play arrow to view a video featuring designs from the previous year. The entire process engages the user from start to finish with fun animated images, such as apples sitting on a bench laughing or Santa’s tongue stuck to a TV antenna pole.

20. Call for Cake

call_for_cake

Call for Cake features several calls to action on their landing page, each geared toward a different buyer persona. For example, there is an option to gift a cake, order delivery or order online. They also offer a telephone number, if you prefer to order over the phone.

 

 

Buffer

About the author

Lexie Lu

Hello! My name is Lexie and I have a fervor for design, writing, and coffee. I graduated with a dual major in Creative Writing and Commercial Design, and through those grueling study hours (facilitated by coffee, of course) I always found time to write for myself.

My posts feature design trends throughout all industries and show how the field is always changing. There’s never a dull moment in the design world!

Leave a Comment

This site uses Akismet to reduce spam. Learn how your comment data is processed.