On a business website, the call-to-action (CTA) button is where a visitor decides whether to keep browsing or take the next step: request a quote, book a call, download a guide or get in touch. A poorly written, hidden or generic CTA leaves money on the table every day.
Here is how to write, design and place CTA buttons that convert, with practical examples for service businesses, retail and B2B.
Why your CTA matters more than you think
Most websites have a «Contact» or «Learn more» button somewhere. The issue is not having one — it is that it does not communicate a concrete benefit, does not stand out visually or appears too late on the page.
A weak CTA creates three direct costs: fewer clicks to forms, fewer quote requests and more abandonment on key pages such as services or landing pages. If your homepage does not guide visitors toward a clear action in the first few seconds, you lose opportunities before they read your offer.
How to write a CTA that invites action
Verb + outcome. «Request a quote» or «Book a free call» work better than «Submit» or «Learn more» because they say what the person gets.
Specificity. «See web design pricing» beats «View services» when the visitor already knows what they need.
Reduce friction. Add a reassurance line: «No commitment», «Reply within 24 hours» or «Free estimate».
One primary action per screen. If three buttons compete with equal visual weight, users often choose none.
Visual design: make it visible and tappable
Your CTA colour should contrast with the background and the rest of the interface. On many corporate sites, an accent tone (orange, green or strong blue) on a light background works well.
Size and tap target. On mobile, aim for at least 44 px height. Buttons that are too small or crowded next to other links cause mis-taps and frustration.
Primary vs secondary hierarchy. A solid button for the main action and an outline or link for the secondary one («View case studies» vs «Get a quote»).
Avoid noise. Heavy shadows, constant animations or long text inside the button reduce clarity.
Where to place CTAs on your website
Hero (above the fold). Visitors should see your value proposition and primary CTA without scrolling. If you sell services, «Request a quote» or «Book a call» usually fits better than a generic «Contact».
After benefits or social proof. Once you have explained the outcome or shown testimonials, repeat the CTA — that is often the moment of highest trust.
Services and pricing pages. People arriving here are already comparing. Make the next step easy with a visible CTA aligned with what they just read.
Menu and footer. Contact should be one click away everywhere. If your navigation menu hides the form, a header CTA helps, but it does not replace clear structure.
Mobile CTAs: different rules, same urgency
On small screens, the primary CTA can sit in a sticky bottom bar or repeat after each important block. Avoid endless scroll before visitors find how to contact you.
Test with your thumb: if the button sits in an awkward corner or fights the hamburger menu, click rate drops. Landing pages for campaigns often work better with one CTA repeated than with multiple destinations.
Common mistakes that kill conversion
«Submit» or «Click here». They communicate no value or next step.
Too many competing CTAs. Three same-size buttons in the hero dilute attention.
CTA that does not match the page. If the button says «Download brochure» but leads to a contact form, trust breaks.
Hiding the CTA behind pop-ups or cookie banners. Check that consent UI does not cover the main button on mobile.
Not measuring. Without data you cannot tell whether the problem is copy, colour or placement.
How to measure whether your CTAs work
In Google Analytics 4, set up click events on key buttons or use UTM parameters on links to your contact page. Compare:
• Hero CTA click rate vs footer CTA.
• Conversions by landing page.
• Mobile vs desktop performance.
On heatmaps (Hotjar, Clarity), see whether users reach the CTA and ignore it — weak copy or design — or leave before that point — placement or prior message issue.
Quick checklist before publishing changes
□ One clear primary CTA above the fold.
□ Copy with verb + benefit, no internal jargon.
□ Enough contrast and comfortable size on mobile.
□ Link or form that delivers what the button promises.
□ CTA repeated after benefits or testimonials on long pages.
□ Active tracking of clicks and conversions.
Want to improve the CTAs on your website?
At aatsoft we build business websites designed to convert: clear copy, visible buttons and a coherent journey on mobile and desktop. If your site gets traffic but few enquiries, tell us about your project and we will propose concrete improvements to CTAs, structure and forms.
