CTAs

Overview

1. General notes

• Our source language is EN-US (US English)
• Remember to hand off designs to the Localization team
  • Confluence Localization Operations Team / Slack #prj-translations

2. Content design only: Use Writer plug-in to flag and replace CTA-related terms to avoid and/or add propose additional terms to avoid via governance process

Definition

A call to action (CTA) is a prompt that asks users to perform a specific action, like uploading a logo, saving changes or buying a product.

CTAs can appear as a button or as hyperlinked text.

Best practices

Use action-oriented language

Format

[verb] [noun]

or

[verb]

• Aim to use [verb][noun] format on buttons
  • For example: Save template
• Exceptions: If the context makes it clear what the action accomplishes, a verb alone might suffice. This may be the case with some common actions like Save and Edit
  • For example, if a user is in a clearly-labelled address section and they want to edit the address, the CTA can just be "Edit", as long as it's placed close the the address field
• Use strong, clear verbs that drive immediate action
• Keep it short (4-5 maximum)

Use descriptive link text

WCAG guidelines recommend that the purpose of each link should be determined from the link text alone. Use object-oriented language so that it's clear what we are linking to.

Mandatory (A and AA) WCAG 2.2 standards to adhere to

• Describe the purpose of a link in the text of the link (AA)
  • For example, Compare shipping prices
    
• Use labels/ text alternatives consistently for CTAs with same functionality (AA)
  • For example, a page has a generic search field at the top of the page and another generic search field at the bottom of the page, both should be labeled the same "Search"

Demonstrate value proposition

• Communicate clear benefits of the CTA to the user
• Focus on what the customer gets /what happens when they select the CTA

Create honest urgency

• Create time-sensitive motivation when appropriate
• Use urgent language thoughtfully and honestly
• But avoid false urgency that could damage trust (otherwise known as a "deceptive pattern")
• Don't make promises the CTA doesn't fulfill

Be clear

• Be explicit about what happens next
• Avoid vague or generic language
• Avoid jargon or overly technical language

Avoid these terms in all CTAs

These are terms that are not best practice for CTAs. Some aren't accessible nor inclusive (for example if a user can't type or is blind, etc.), or they aren't action-oriented

• Click
• See
• Type
• View
• Watch
• Never mind

Use active language and avoid passive language

Passive versus active language

Active language:

• Starts with strong verbs
• Speaks directly to the user
• Is shorter and clearer
• Creates a sense of immediacy
• Makes the action and benefit immediately clear
  • For example:
    • Browse templates
    • Go to past orders

Passive language typically:

• Uses helping verbs like "can be," "will be," "should be"
• Takes longer to convey the same message
• Feels less personal and direct
• Often includes unnecessary conditional language
  • For example:
    • Templates available to browse
    • Go to orders made in the past