Call-to-action buttons drive specific actions for visitors. They should be used sparingly: If they become too ubiquitous on the site, they no longer stand out to visitors and lose effectiveness.

Tips for call-to-action buttons:

  • They should not be used for navigation. This confuses the user, who likely thinks the navigation and CTA drive to different pages.
  • Prioritize one CTA above all else. If necessary, include a secondary CTA as a text link.
  • Position where they make the most sense. CTAs don’t need to appear at the bottom of the copy. Position them at natural points in the content.
  • Keep users on the page. Remember that contextual links drive users away from a page and can create momentary confusion about what a user should do. Put clear and prominent CTAs in the body when users will naturally be looking for what to do next. 
  • Only use full-width CTA within a div. If a full-width div spans across the whole page, the button becomes overwhelmingly distracting for the user and in some cases the user will not understand that it is a button.

How to add CTA Buttons

CTA Examples

CTA

CTA Small

CTA TINY