Common Content
This section outlines how we style content within key elements and surfaces. For more component-level guidelines, go to the respective component page in Thumbprint.
Emails
Keep emails short, ideally less than 150 words in total. To emphasize a point, use a single-sentence paragraph. Otherwise, each paragraph should cover one topic in no more than four lines (about 50 words). Use subheaders and bulleted lists to structure complex or lengthy information.
- Subject lines (SL)
Keep subject lines under 10 words or 40 characters and don’t punctuate them. They should communicate the most important information (like a deadline or required action). - Pre-headers (PH)
This is the sentence that appears next to or near the subject line in an email inbox. It’s often clipped, so keep it under 10 words or 40 characters. Write it as a complete sentence with punctuation that reinforces the line, continues the conversation, or entices action. - Headers
Not all emails need headers, but they can be a helpful way to highlight and frontload the main message. Headers often repeat or expand upon the subject line. Ideally, headers are contained to one line. - Body
Keep the body copy concise and use formatting (like subheaders or bulleted lists) to improve readability. Paragraphs should cover one topic and not exceed three lines. - Calls to action (CTAs)
Always include at least one call to action, even if it’s just to go to the app. To test for readability, ask if the main message of the email can be understood by reading the subject line, header, and CTA alone. - Footers
Optionally, you can add a secondary CTA (like a link to the Help Center) in the footer. Always include the standard footer with our business address, a link to unsubscribe, and links to download the app.
Legal disclaimers
Work with legal to determine which content is critical to have in the user interface. Keep the tone serious and the content no more than 4 lines (on mobile). When applicable, include a link to a resource where users can learn more.
Push and SMS notifications
Push and SMS notifications are an effective way to communicate time-sensitive, actionable messages — especially to pros who are on the job. Assume you’re writing for a smaller phone screen (with a standard font display setting) and keep content under 90 characters.
To avoid inundating users with communication, waterfall the push and SMS instead of sending both. In other words, send a push notification first and only send an SMS if the user has push notifications turned off.
- Headers
Fit headers to one line and use them to communicate the main message. An emoji can be used occasionally for a celebratory text. - Body
Body copy should be no more than three lines. Make sure that it indicates where the user will navigate if they click through the notification.
Calls to action
Buttons and links should always be sentence case, unless they contain a proper noun. Buttons should be four words or less, and links should be eight words or less.
When writing copy for buttons and links, remember these 4 guidelines from Nielsen Norman Group:
- Specific
Begin with strong, actionable verbs and avoid self-evident ones (like “click”). - Sincere
Accurately describe where the user will go once the button or link is selected. - Substantial
Make the copy unique and clear so it can be understood without any surrounding context. - Succinct
Get to the point and cut unnecessary words like articles or adjectives.
Use buttons for primary actions and links for navigation. Unless you’re following a common button pattern, like “Done” or “Continue,” buttons and links should follow the [action verb] + [noun] pattern.
Errors and alerts
When writing error messages and alerts, explain what is happening and what to do next. Avoid generic language and focus on getting the user back on track.
Encountering an issue is never fun, so adjust the tone appropriately. Never use an exclamation point. Use a passive voice to avoid placing blame. Don’t make jokes to try to put the user at ease.
Headers
Keep headers to one line and no more than 10 words. Generally, headers communicate what went wrong. If a user only reads the header and CTA, they should have all the information needed to resolve the error.
Body
Use complete sentences and keep the body copy to two lines in total. This space is generally used to provide additional context on the reason for the error. Avoid technical jargon (like “Error 404”) and prioritize the information that helps the user move forward.
CTA
Keep CTAs to four words or less — and don’t punctuate them. If the user can resolve the error on their own, direct them to do so in the CTA (even if it’s just trying again or refreshing the page).
The payment failed. Double-check your information and try again.
Incorrect password
AUTH ERROR: We weren’t able to process your payment.
You entered the wrong password.