When designing a web page, we need to plan the user's path through our site. Browsing the content should lead to performing some action, e.g. making a purchase, making contact, or subscribing to the newsletter. A CTA button is an element that, when properly used, can help your business increase the conversion rate. Learn what a call to action is and how to create effective call to action buttons. Check out the most interesting examples of CTAs.
What is CTA?
The CTA initialism stands for a call to action. This term is used to describe an element that takes the user to another page within the website or that allows performing a specific action. Most often it comes in the form of a button or link and a short slogan. The CTA is an interactive element of a website. This means that when the user interacts with it (by clicking on it), some action will take place, e.g. a message, form, or login field will appear, or the person will be transferred to another page within the given site (e.g. to a contact page) or outside of it (e.g. to a landing page).
The basic function of a call to action is to motivate the user to act and help them in performing a certain action (e.g. moving to a form or placing an order), and thus increasing the effectiveness of a company website. The purposes of creating such a button may be almost as numerous as there are goals that the organization wants to attain with the help of a company web page. A call to action can help you to increase the conversion rate, get leads, or guide users to specific subpages.
CTA buttons may appear in various areas on a website (e.g. on blogs, offer subpages, a form, a pop-up, etc.). They're usually most effective when their placement has been carefully considered.
What should a CTA button look like?
Calls to action may vary in size, appearance, and content – it all depends on the goal you want to achieve with them. A call to action button should be visible enough to draw attention. You should keep in mind, however, that while it's important, it's only one of many components of a website, so it shouldn't take up too much space. In order for a CTA to stand out from the rest of the page, it may be slightly larger than other elements, have a bright color, and sometimes also an unusual shape.
How to write a call to action?
The text of a call to action needs to be rather short, but also original and catchy. While most often it contains just a slogan with one to three words, sometimes a complete sentence appears on a button.
Everyone has probably seen a button with the word Click here more than once in their life. It's a classic and simple solution, but it isn't very original and doesn't provide much information. It's quite important for a call to action to contain information about what action will occur when it's clicked. Therefore, it's better to write Start a trial period instead of Trial period, so that the user knows what actually happens when they interact with that element. Quite a lot can be conveyed in just a few words. For example, a Try for free slogan which encourages you to take action shows two benefits:
- you can try the product you're interested in,
- you don't incur any costs.
It's also an interesting idea to address the recipient using the first-person singular. Instead of writing an encouragement like Order the product you can write I want to order the product. It turns out that such an approach can increase the CTR (click-through rate) by up to 90%. CTR tells you how effectively your company's campaigns are.
If you prefer single-word CTAs, make sure that the button is accompanied by a relevant headline or short text explaining to the potential customer what they can gain by clicking the CTA.
Button CTA – examples
Call to action buttons are usually classified according to what their creators intended and what activity they expect from their potential customers. A CTA may:
- allow making a purchase,
- help the user to check out the offer (buttons redirecting the user between subpages),
- appear when the customer wants to leave the website (in order to make them stay longer).
Within these three basic categories, it's also possible to distinguish additional button types that are related to specific activities.
The purpose of this button is to start a sales process, trial period, using the product or to make a reservation. This type of call to action is usually put next to the description of a specific product, on a landing page or home page.
After going to the description of one of the functionalities of the Xero solution, you see the CTA almost immediately, at the top of the page. Just like the first button in the Hero section, the call to action in the upper right corner redirects to the page with the form, which, after filling out, gets the user free access to a 30-day trial period. The abovementioned button is visible all the time, regardless of which subpage the user is viewing. With the call to action visible from the very first seconds of browsing the site, regardless of the viewed tab, a person redirected to your website by an ad can start the trial period right away or learn more about the solution.
The second button in the Hero section takes the Internet user to the offer page with described plans to choose from. There, the user can immediately purchase the selected service. It's worth noting how the more important button (the one related to the trial period) is distinguished by a different color and shape. It's more distinct, so it's the first one that catches the eye of the potential customer.
2. Click Funnels
In addition to the fixed buttons in the top-right corner of the web page, the Click Funnels website also features an extensive CTA in the Hero section, accompanied by a promotional video, and the content that highlights the benefits of the tool.
The call to action itself is quite extensive. There are two sentences on the button, in two lines. The first one motivates the user to take advantage of the 14-day trial period immediately (Start now) and informs them that this option is free of charge. The second sentence informs that thanks to this tool a potential customer can immediately start creating their own sales funnel. The advantage of a CTA constructed in this way is that it provides users with more useful data on the offered solution.
These calls to action allow you to contact the company. The most common effect of clicking the button is the transfer of a user to a contact form or application (calendar) where they can arrange a conversation with a customer advisor. Using this type of button, however, may also be aimed at obtaining the contact details of a potential customer, e.g. a telephone number or email address.
3. Lasik MD
The website of the Lasik MD ophthalmology clinics uses CTA to encourage a potential client to sign up for a free consultation and arrange a face-to-face meeting with the advisor. The button is located in the main menu and stands out due to its distinctive blue color. The area and chosen color make the button practically impossible to miss, so the user is aware, from the very first moment spent on the website, that they can take advantage of such an offer.
The CTA clearly defines what action the button makes possible (making a reservation), and also informs that the consultation is free. Clicking on this call to action redirects the user to a form allowing them to book an appointment at the clinic.
The call to action (booking an appointment) is located in the Hero section and just below the fold line of the Indochino home page. The simple Book an appointment CTA uses contrasts (white text on a black button) and, in the case of its second occurrence, stands out due to its darker color when compared to other page elements. After clicking on this call to action, the user is taken to a map where they can select their preferred location and click on Book now placed underneath. Then they click on the option from the list that corresponds to the purpose of their visit, and in the next step, they select the date most convenient for them on the calendar.
Learn more button
A call to action, encouraging to learn more about a product, service, or brand often appears on the home page, near the first short product descriptions. Another popular place for such a call to action is a product page that showcases a large number of products or services. Then the CTA usually redirects to expanded descriptions. The purpose of such a call to action is to extend the user's stay on the page and enable them to learn more about the company and its offer.
5. Here Technologies
The subtle and simple CTAs (learn more) on the Here Technologies home page that we've been working on, take you further down the product and service descriptions page, as does Find out more in the Hero section. The buttons are visible to the user, but they're composed with the rest of the page in such a way as not to distract the visitor and interfere with the website's reception.
Source: Here Technologies website
In this case, the CTA allows limiting the content on the homepage and at the same time informs the user that additional information is available. This makes the website more legible and organized.
6. Get Harvest
Get Harvest uses classic, minimalist CTAs with the Discover all features encouragement on the home page of their solution. In this way, it makes the potential customer understand that the solution has many useful tools and allows them to further explore the website and get to know the offer better.
The company unobtrusively invites the user to continue their journey on the web page if they aren't ready to make a purchase yet and gives itself more time to evoke positive associations with the brand.
Newsletter subscription CTA
A newsletter subscription improves a brand's communication with its users and allows for sending of commercial information. Such CTA appears frequently on blogs, home pages, and "about us" tabs.
7. The Budgetnista
To promote their newsletter, the financial educator from The Budgetnista website has set up a separate section on the home page dedicated to collecting mailing subscriptions only. It consists of the header, the author's photo, the Sign up for weekly goodies CTA button, and the categories of messages that'll be included in the mailing.
Thanks to the information contained in the section, the user can quickly decide whether they're interested in this particular newsletter. They also learn how often they'll receive messages – the CTA refers to the newsletter as Weekly Goodies, which indicates that it'll be sent on a weekly basis. The color of the call to action button makes it stand out on the black background, and by placing it in a special section, the specialist also makes sure that it'll not be overlooked.
The CTA on the Backlinko website is placed in the Hero section. Thanks to this, the user can easily find it, even if they don't decide to use it immediately after entering the web page.
The single field to enter an email address and the Try it call to action are located under the customer reference and the header explaining what the user will get if they provide an email address. Positive customer opinion motivates to take advantage of the company's offer. Using a CTA in such a manner is an easy way to quickly obtain additional addresses for the mailing database.
Examples of CTA buttons – summary
Good-looking and strategically placed calls to action are an important part of a website. They don't have to be used for sales purposes only, but they can also create a customer path within the web page, generate leads, and help promote the brand. We offer comprehensive user experience (UX) and user interface (UI) design services.