For a simple landing page<\/a>, you do not need fancy tools or developer skills to enhance your CTA design and get more people to convert. <\/p>\n\n\n\n On a high traffic website, CTA design is usually overseen by a team of specialists including copywriters, UX designers<\/a>, data analysts, graphic designers, web developers, and marketers with experience in conversion rate optimization (CRO). <\/p>\n\n\n\n There may be one person who owns it, but CTA design draws on all of these disciplines.<\/p>\n\n\n\n We know a CTA is well designed when it encourages a higher percentage of website visitors to take action.<\/p>\n\n\n\n On websites, key actions are tracked as conversions. If a new CTA design improves the conversion rate<\/a>, that\u2019s good news 99% of the time. <\/p>\n\n\n\n Done well, CTA design reinforces all of the positive feelings a website user already has about a brand: What they saw in ads, what they read on the site, what they found out in reviews. <\/p>\n\n\n\n It gives users confidence in their decision to move forward, making the next steps easy and obvious.<\/p>\n\n\n\n Here are some examples of wonderful calls to action<\/a> I found in the wild.<\/p>\n\n\n\n We know a CTA is poorly-designed when people overlook it, aren\u2019t interested, and don\u2019t convert into new signups, purchases, inquiries, etc.<\/p>\n\n\n\n You might not know the root cause, but you will start to see that conversion rates drop. Maybe average order value decreases or the revenue per session ticks down. <\/p>\n\n\n\n Whatever the warning sign is, you will have to dig into the problem by running a CRO audit<\/a>, which will let you know if it’s a quick fix or a larger issue.<\/p>\n\n\n\n No, of course not. There are lots of reasons that customers fail to sign up, many of which have zero to do with your CTA design.<\/p>\n\n\n\n That said, your CTA design is what every potential customer is looking at during the moments they actually have to act. It has to get people past the final hesitation before they pull out their credit card and feel comfortable making a purchase.<\/p>\n\n\n\n And when poor CTA design really is the problem, it\u2019s tragic.<\/p>\n\n\n\n All the hard work the brand has done thus far to raise awareness, build interest, sharpen desire, and get potential customers through your website funnel<\/a>, only to fail in the final mile.<\/p>\n\n\n\n At the very least, a decent CTA design gets out of the way and allows as many users to convert as possible. Truly great CTAs can actually encourage more people to sign up, subscribe, or buy.<\/p>\n\n\n\n This is a well-studied world. Unlike other corners of the marketing universe, there are few mysteries left about what makes a call to action effective. Here is my take on the key rules for CTA design:<\/p>\n\n\n\n The very best designers and CROs know when to break these rules, which can be an incredible way to stand out from the competition. <\/p>\n\n\n\n But if you are simply trying to create a new offer or upgrade an existing one, there is probably a lot of headway you can make simply by adhering to the well-known best practices.<\/p>\n\n\n\n Whatever action you want people to take should be impossible to miss. It ought to be visible as soon as they arrive on your site, and it should really stand out from everything else on the page. This is a classic conversion rate optimization checklist<\/a> item because it ensures that anyone who visits your site will see your offer.<\/p>\n\n\n\n This offer from the screen recording software company, Loom, is exemplary. It is a simple headline and subhead that sells the value of Loom, followed by a button that offers Loom for free.<\/p>\n\n\n\n Using CTA\u2019s like this is not a pushy tactic, it\u2019s just common sense. Many visitors will not scroll, so if your CTA is buried, they are not going to see your offer.<\/p>\n\n\n\n Plus, some visitors come ready to act, and you want to give them that option as soon as they arrive. They could have researched your product category heavily and are now actively looking for deals. Make it as easy as possible for people to take action with a clear and obvious CTA.<\/p>\n\n\n\n Tips:<\/strong><\/p>\n\n\n\n If you have multiple CTAs, and users can\u2019t tell which one is important, it splits their attention. This usually makes people confused, hesitant, and less likely to commit to anything.<\/p>\n\n\n\n You can (and in most cases should) have secondary offers on your page. Invitations to sign up for a newsletter or links to related resources are two examples of secondary offers that virtually every business uses on their site. <\/p>\n\n\n\n In the example from Loom, you can see how the secondary offer \u201cInstall Chrome Extension\u201d is less prominent.<\/p>\n\n\n\n The button color is less heavy and there is no shadow. Even though the secondary offer button is wider than the primary offer, those design choices ensure the secondary offer does not rival the primary for attention.<\/p>\n\n\n\n Tips:<\/strong><\/p>\n\n\n\n On your socials, you may be stuck using \u201clink in bio\u201d to get people to click through. But on your website, use buttons for direct action CTAs.<\/p>\n\n\n\n People expect buttons to do things. They expect links to take them places. <\/p>\n\n\n\n So if you want someone to do something, you can align with their expectations by making that action a button. <\/p>\n\n\n\n Tips:<\/strong><\/p>\n\n\n\n At the point where someone is going to take action, they want certainty. They want to know exactly what happens when they sign up. They want to know what they are signing up for.<\/p>\n\n\n\n Almost nobody likes vague, general language. They never have. And when they are at the moment of pulling out their credit card or surrendering their email, they really hate it.<\/p>\n\n\n\n Here\u2019s an opt-in popup<\/a> from the brand Quince, an online retailer that does over $100M in sales.<\/p>\n\n\n\n Nothing flashy there, by any means, but it\u2019s easy to complete, easy to click out of, and unlikely to bother anyone who just wants to shop.<\/p>\n\n\n\n The rule of thumb is to use as little writing as possible to communicate only the most important ideas. People can argue over the best copywriting tips<\/a>, but everyone agrees shorter is better.<\/p>\n\n\n\n With AI-slop content filling up websites and newsfeeds, it means you have a powerful opportunity to write something short, direct, and concrete that will resonate instantly with human users who are fed up with regurgitated content.<\/p>\n\n\n\n Tips:<\/strong><\/p>\n\n\n\n If users arrive on a page that’s crowded with tons of content, it can be overwhelming. You don\u2019t want to make people work to find your CTA.<\/p>\n\n\n\n White space (that is the parts of your page with no content) is not wasted space. Good UX designers<\/a> know how to use white space to guide users toward what matters. <\/p>\n\n\n\n Tips:<\/strong><\/p>\n\n\n\n It\u2019s okay to take more than one shot with your primary CTA. You almost certainly want to have a CTA visible when users first arrive on your site, but that doesn\u2019t have to be the only one.<\/p>\n\n\n\n Most brands will include multiple CTA buttons for their primary call to action because they know that users explore the site in unique ways. Some may scroll right past your first offer to dig into the details, whereas others will give no more than a quick scan to the full page, looking for a specific bit of information.<\/p>\n\n\n\n You can\u2019t predict what everyone will do, but you can take steps to make sure that a larger percentage of your website users have a greater chance of seeing your offer.<\/p>\n\n\n\n Tips:<\/strong><\/p>\n\n\n\n One of the best ways to boost the confidence of potential customers is by giving them objective reasons to believe your brand and showing that other people have happily bought from you before.<\/p>\n\n\n\n Some examples of trust signals<\/a> used near CTA\u2019s include things like a G2 star rating or Better Business Bureau badge. These third-party endorsements show that your brand has been vetted by credible organizations. This gives potential buyers confidence in your brand, even if they have never heard of you before. <\/p>\n\n\n\n Some examples of social proof<\/a> used near CTAs include customer reviews and testimonials. These reassure potential buyers by showing people like them who are happy customers already. <\/p>\n\n\n\n Tips:<\/strong><\/p>\n\n\n\n You want to learn from the best, which is subjective, but only to a point. <\/p>\n\n\n\n There are designs that convert better, and help brands grow. There are also designs that fail to convert, and drag brands down.<\/p>\n\n\n\n I picked 9-figure brands to use as examples because, at least for now, they are all clear winners.<\/p>\n\n\n\n No one says the first $10M is easy, but the path to $100M and beyond is a new kind of journey. Brands have to be doing a lot of things right, over a long period of time<\/em>, in order to hit 9-figures. <\/p>\n\n\n\n They have to be making good choices about how to adapt their design and messaging as the market evolves. They are not doing what they were doing 2 years ago. They are constantly testing to see what actually works.<\/p>\n\n\n\n These brands have the resources to run in-person usability testing<\/a>, conduct eye tracking<\/a> studies, and significantly improve the UX on their website and\/or mobile app.<\/p>\n\n\n\n They have tons of traffic, which means they can relentlessly A\/B test<\/a> and MVT test<\/a> any page or user flow.<\/p>\n\n\n\n And the examples I picked? There is nothing high-tech going on here. It\u2019s good writing, smart design, and thoughtfully chosen images.<\/p>\n\n\n\n Most of these tactics are well within striking distance for someone working on a basic website builder.<\/p>\n\n\n\n In less than three years, Glean hit $100 ARR by helping companies connect and access their data. It\u2019s one of many players in the AI enterprise search category, but one of the few that successfully provided its customers with noticeable productivity gains. <\/p>\n\n\n\n Employees use Glean, more and more, to find answers, create content, and automate workflows. They built a tool people enjoy using, and I think the same could be said of their site, which had several compelling CTAs.<\/p>\n\n\n\n The above-the-fold offer on their homepage when you arrive directly tackles the most pressing question for most people new to the brand: What does Glean do? <\/p>\n\n\n\n The headline reads: \u201cWork AI for all<\/strong>,\u201d and it\u2019s followed by the subhead \u201cGive every employee an AI Assistant<\/strong> and Agents <\/strong>that put your company\u2019s knowledge to work.\u201d<\/p>\n\n\n\n If I put myself in the shoes of a potential good fit buyer, I find this offer pretty interesting. It\u2019s aimed at every employee, not just managers or developers. This is something that could help my frontline workers, field techs, and customer service reps. <\/p>\n\n\n\n I might click the primary CTA, which reads \u201cGet a demo,\u201d and sits in a blue button surrounded by plenty of white space. Or I might be interested enough to click the secondary offer, \u201cWatch video,\u201d which sits as plain text on the white background, drawing very little attention away from the demo offer.<\/p>\n\n\n\n Notice that that primary offer sits beneath two small but significant trust signals. One is from Gartner, the other from G2, and these are both very trusted names in the world of enterprise B2B software. A few hundred honest reviews from real folks at big name companies will go a long way towards assuring me that this brand is, at the very least, safe to start thinking about.<\/p>\n\n\n\n Now it\u2019s possible that you would have missed the primary CTA on the page, but there is zero chance you will miss the CTA in the navigation bar, which is encircled by a flashing neon border that sort of dances around it.<\/p>\n\n\n\n This is bold, especially because the navigation bar is sticky, so the animation follows you as you read the rest of the page. It\u2019s not something that will work for everyone, but it does illustrate what high-growth brands are willing to do in order to stand out from the competition.<\/p>\n\n\n\n Throughout the rest of the page, Glean really leans into the idea that potential buyers need to hear from existing Glean customers in order to feel good about moving forward. <\/p>\n\n\n\n Consider this informational CTA about \u2153 of the way down the page:<\/p>\n\n\n\n The call to action here is to read more about Booking[dot]com, featuring a headshot\/quote from a senior engineering manager. The quote builds on the idea that Glean helps you get more done and that people like using it, cutting into the objection that these tools are too complex or obscure for people to really benefit from.<\/p>\n\n\n\n Notice the button color here is a neon we haven\u2019t seen yet. It\u2019s very noticeable during the first scroll. This type of social proof<\/a> is crucial to show B2B buyers, and Glean makes sure it\u2019s not overlooked. <\/p>\n\n\n\n Quince is a direct-to-consumer brand that offers high-end fashion and home goods at a fraction of retail prices. Launched in 2018, Quince hit the $100M mark in 2021 and continued to grow.<\/p>\n\n\n\n In addition to the attractive price point, their wide appeal is attributed to a generous 365-day return policy, which makes people feel a lot more confident when it comes to big ticket items. Their focus on sustainability has also propelled their growth, especially on social media. <\/p>\n\n\n\n Still, the Quince website itself is doing a lot of work to ultimately get people to say yes to a purchase and spend more than they otherwise might.<\/p>\n\n\n\n Exploring the home page on mobile (as most online retail shoppers do) I encountered a fairly minimalist CTA paired with an image headline combination that strikes at the core of the brand’s message.<\/p>\n\n\n\n I can\u2019t speak to the fashion choices (nor would any one want me to), but \u201cPeak power dressing at entry-level prices\u201d is text that evokes plenty of strong emotions. <\/p>\n\n\n\n The phrase \u201centry-level\u201d evokes the idea of job and status. But it\u2019s within the context of pricing, so it could convey \u201caffordable for me\u201d to an entry-level worker, or \u201cokay for an impulse buy\u201d to someone further up the chain of command.<\/p>\n\n\n\n The \u201cShop now\u201d button is nothing special, but I guarantee they have tested many different versions. Sometimes the simplest way is the best way.<\/p>\n\n\n\n I found some really great CTA design work in the product detail pages (PDPs) on Quince site. Optimizing PDPs for conversion is where many ecommerce brands live and die. Quince is doing a lot of things right.<\/p>\n\n\n\n Here is the bedding set they promoted heavily from the homepage when I visited.<\/p>\n\n\n\n Let\u2019s look at the key elements here:<\/p>\n\n\n\n This PDP hits all the standard elements well and does a good job building momentum from the home page. There\u2019s a constant focus on the savings and the value of this offer. It\u2019s perfectly aligned with what we saw already. <\/p>\n\n\n\n For those at home doing the math, first time shoppers would be able to access that $50 and bring the sticker pricing of this bedding down to $99.99. That\u2019s 60% off the traditional retail price, and the buyer would be getting $250 sheets for under a hundred bucks.<\/p>\n\n\n\n Scrolling just a little down and closing the $50-off, we see similar framing used around the button. More reasons to trust the brand, more reasons to feel safe about making a purchase with this company.<\/p>\n\n\n\n Note the buy button is huge, taking up almost the full width of the mobile display.<\/p>\n\n\n\n I don\u2019t know who needs to hear this, but big buttons are easy to tap. Online retail shoppers might be holding a coffee in their other hand, standing on the train, or at the beach with terrible glare.<\/p>\n\n\n\n Surrounding the button are more reasons to feel good about making a purchase. Above the button is green text that reads \u201cIn-stock and ready to ship,\u201d and below are three icons denoting free shipping, easy returns, and secure payment.<\/p>\n\n\n\n All of this conveys no waiting, no surprises, no risk, <\/em>and makes people feel confident.<\/p>\n\n\n\n Now you might look at this and say, these are all fairly common tactics that people use to boost the conversion rate in ecommerce<\/a>. They are building urgency and showing value the same way lots of other sites do.<\/p>\n\n\n\n Of course. These tactics are hardly revolutionary, but there is an important thing to keep in mind. <\/p>\n\n\n\nHow do you know a CTA design is good?<\/h3>\n\n\n\n
How do you know a CTA design is bad?<\/h3>\n\n\n\n
But CTA design isn\u2019t always to blame, right?<\/h3>\n\n\n\n
7 Rules for CTA Design<\/h2>\n\n\n\n
\n
1. Place the primary CTA prominently and differentiate it<\/h3>\n\n\n\n
![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25170005\/ce-cta-design-loom.png\")
<\/figure>\n\n\n\n\n
2. Secondary offers shouldn\u2019t compete with the primary offer<\/h3>\n\n\n\n
![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25170414\/ce-cta-design-loom-buttons.png\")
<\/figure>\n\n\n\n\n
3. Use buttons for action, links for navigation<\/h3>\n\n\n\n
\n
4. Use a small amount of specific language<\/h3>\n\n\n\n
![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25184418\/ce-cta-design-quince-popup.png\")
<\/figure>\n\n\n\n\n
5. White space should draw attention to the the CTA <\/h3>\n\n\n\n
\n
6. Place primary CTA in multiple sections<\/h3>\n\n\n\n
\n
7. Place trust signals and social proof near the CTA<\/h3>\n\n\n\n
\n
Why Use Example CTA Designs from $100M+ Brands? <\/h2>\n\n\n\n
CTA Design in B2B | Glean<\/h2>\n\n\n\n
![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25170438\/ce-cta-design-glean-homepage.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25170505\/ce-cta-design-glean-demo.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25184554\/ce-cta-design-glean-case-study.png\")
<\/figure>\n\n\n\nCTA Design in B2C | Quince <\/h2>\n\n\n\n
![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25184614\/ce-cta-design-quince-homepage-508x1024.png\")
<\/figure>\n\n\n\n![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25170530\/ce-cta-design-quince-pdp3-520x1024.png\")
<\/figure>\n\n\n\n\n
![\"\"](\"https:\/\/ceblog.s3.amazonaws.com\/wp-content\/uploads\/2025\/08\/25170537\/ce-cta-design-quince-pdp5.png\")
<\/figure>\n\n\n\n