alert-circle An exclamation point inside of a circle. alert-triangle An exclamation point inside of a triangle shape. arrow-down-left An arrow pointing down and to the left. arrow-down-right An arrow pointing down and to the right. arrow-down An arrow pointing down. arrow-left An arrow pointing left. arrow-right-thick A thick arrow pointing right arrow-right An arrow pointing right. arrow-up-left An arrow pointing up and to the left. arrow-up-right-thick A thick arrow pointing up and to the right arrow-up-right An arrow pointing up and to the right. arrow-up-thick A thick arrow pointing up arrow-up An arrow pointing up. award A award bell A bell. calendar A calendar icon. camera-off A camera that is deactivated. camera A camera. check-circle A checkmark in a circle. checkmark A checkmark. chevron-down A chevron arrow pointing down. chevron-up A chevron arrow pointing up. chevron A chevron arrow pointing down. chevron A chevron arrow pointing down. chrome Chrome browser logo. close-circle An x in a circle. close A x shape. door A car door. edge Edge browser logo. ellipses An ellipses shape. engine A car engine. envelope A closed envelope. explorer Internet explorer logo. eye-off An eye that is deactivated. eye An eye. facebook Facebook logo. file-text A piece of paper with lines on it. file A blank piece of paper. firefox Firefox browser logo icon-flame A flame. fwd A car drivetrain. gear A gear with multiple teeth. grid A 2x2 grid. heart An empty heart. height-width Arrows indicating height and width measurement. home A home icon. info THe letter i in a circle. instagram Instagram logo. link A chain link. linkedin Linkedin logo. map-marker A map marker pin. maximize Four corners containing a plus sign. menu Three lines signifying a menu. message-circle A speech bubble. minus A minus dash. mpg A car dashboard gauge. opera Opera browser logo. pause A pause symbol. pencil A pencil. phone A phone handset. pinteest-disc Pinterest logo in a disc. pinterest Pinterest logo. play A play button. plus A plus symbol. safari Safari browser logo. search A magnifying glass. seat A car seat. shield A shield sliders A group of control sliders. square A square with rounded corners star A star. tag A shopping tag. thumbs-down A hand with the thumb pointing down. thumbs-up A hand with the thumb pointing up. trash A trash can. trophy A trophy. truck A truck icon. twitter Twitter logo. user-circle An outline of a person in a circle. user An outline of a person. video A video camera. youtube Youtube logo. zoom-in A magnifying glass with a plus in the center alert-circle An exclamation point inside of a circle. alert-triangle An exclamation point inside of a triangle shape. arrow-down-left An arrow pointing down and to the left. arrow-down-right An arrow pointing down and to the right. arrow-down An arrow pointing down. arrow-left An arrow pointing left. arrow-right-thick A thick arrow pointing right arrow-right An arrow pointing right. arrow-up-left An arrow pointing up and to the left. arrow-up-right-thick A thick arrow pointing up and to the right arrow-up-right An arrow pointing up and to the right. arrow-up-thick A thick arrow pointing up arrow-up An arrow pointing up. award A award bell A bell. calendar A calendar icon. camera-off A camera that is deactivated. camera A camera. check-circle A checkmark in a circle. checkmark A checkmark. chevron-down A chevron arrow pointing down. chevron-up A chevron arrow pointing up. chevron A chevron arrow pointing down. chevron A chevron arrow pointing down. chrome Chrome browser logo. close-circle An x in a circle. close A x shape. door A car door. edge Edge browser logo. ellipses An ellipses shape. engine A car engine. envelope A closed envelope. explorer Internet explorer logo. eye-off An eye that is deactivated. eye An eye. facebook Facebook logo. file-text A piece of paper with lines on it. file A blank piece of paper. firefox Firefox browser logo icon-flame A flame. fwd A car drivetrain. gear A gear with multiple teeth. grid A 2x2 grid. heart An empty heart. height-width Arrows indicating height and width measurement. home A home icon. info THe letter i in a circle. instagram Instagram logo. link A chain link. linkedin Linkedin logo. map-marker A map marker pin. maximize Four corners containing a plus sign. menu Three lines signifying a menu. message-circle A speech bubble. minus A minus dash. mpg A car dashboard gauge. opera Opera browser logo. pause A pause symbol. pencil A pencil. phone A phone handset. pinteest-disc Pinterest logo in a disc. pinterest Pinterest logo. play A play button. plus A plus symbol. safari Safari browser logo. search A magnifying glass. seat A car seat. shield A shield sliders A group of control sliders. square A square with rounded corners star A star. tag A shopping tag. thumbs-down A hand with the thumb pointing down. thumbs-up A hand with the thumb pointing up. trash A trash can. trophy A trophy. truck A truck icon. twitter Twitter logo. user-circle An outline of a person in a circle. user An outline of a person. video A video camera. youtube Youtube logo. zoom-in A magnifying glass with a plus in the center facebook Facebook logo. instagram Instagram logo. linkedin Linkedin logo. pinteest-disc Pinterest logo in a disc. pinterest Pinterest logo. twitter Twitter logo. youtube Youtube logo.
Spark logo Spark Design System
CONTENT-STRATEGY

Voice and tone

Who we are and how we show up to our users.

What is voice and tone?

Our voice represents our personality. It’s who we are, and how we show up to our users. Our tone adapts to different contexts.

Our voice

Personality traits

With every interaction we have with our users, we demonstrate that we’re:

  • Helpful, but not condescending
  • Engaging, but not desperate
  • Trustworthy, but not authoritative
  • Intelligent, but not arrogant
  • Relatable, but not unprofessional
  • Insightful, but not intrusive
  • Empathetic, but not overly emotional
  • Adaptable, but not a pushover
  • Playful, but not flighty

We position ourselves as experts when it comes to the information we provide, but we don’t lord the knowledge we have over our users. We want car shopping to be fun, and so we use language that’s engaging and playful where it makes sense.

Our tone

Our tone represents our attitude. It adapts to what we know about our user’s context, so it can change depending on what someone is doing. The best way to decide what tone to use is to ask yourself what users are likely feeling when they encounter your copy, so you can decide how to respond.

Overall, we use conversational, natural language that mirrors the way we would speak to our user if we were having a live conversation. This mindset enables us to solve for understandability and build trust through accessibility.

We use three core values to make decisions about what words to use, why, when, and for whom.

  1. Natural Language (Right message) Content reflects the words customers use, and is appropriate for what customers may be thinking and feeling in that moment.
  2. Specific Use Case (Right person) Content reflects an understanding of where the user just came from, and what they will want to do next.
  3. Relevant Context (Right time) Content makes it clear how this experience relates to the customer’s world, and how this action will impact them later.

UX writing best practices in action

Here are some actionable ways to design for clarity and bring our voice and tone to life in our interface copy.

  • Be concise. Concise doesn’t mean limited; it means efficient. Use as few words as possible without losing the meaning.

    Don't

    “You must sign in before you can save a car”

    Do

    “Sign in to save a car”

  • Begin with the objective. When a sentence describes an objective and the action needed to achieve it, start the sentence with the objective.

    Don't

    “Tap on the heart to save this car”

    Do

    “To save a car, tap on the heart”

  • Speak with certainty. Cars.com is an expert source of information, and this should be reflected in an assuredness in how we communicate.

    Don't

    “This car is probably a good match for you”

    Do

    “This car is a great match for you based on X, Y, Z”

  • Avoid combining pronoun usage. Don’t refer to the user in both the second person and the first person within the same phrase.

    Don't

    “Change your preferences in My Account”

    Do

    “Change your preferences in Your Account”

  • Write in present tense. Avoid using the future tense to describe the action.

    Don't

    “Video has been downloaded”

    Do

    “Video downloaded”

  • Write in active voice. The passive voice slows users down, and takes up unnecessary space.

    Don't

    “The Search button should be clicked when you are ready to search for an item.”

    Do

    “To search for an article, click the Search button.”

  • Embrace progressive disclosure. Too much information can quickly overwhelm users. Show more details as needed as someone moves through a flow.

    Don't position paragraphs of content mid-flow that isn’t easily scannable.

    Do organize content into sections that can be minimized unless immediately relevant. I.e., “Read full safety review” as link to full content, vs. including the full safety review in the body of the article.

  • Avoid broad, sweeping words and assertions. They can come across as judgmental in certain contexts, and also run the risk of being inaccurate when applied to unforeseen use cases, which erodes trust.

    Don't use “anything,” “everything,” “never,” “always,” etc.

    Do use softer language to make your point.

  • When communicating instructions, be helpful but not prescriptive. Avoid language that can come across as bossy; we don’t want to come across as telling our users what to do.

    Don't

    “To do X, you need to Y, Z”

    Do

    “To do X, go to…”

  • To make our content accessible, write for a 7th grade reading level. Avoid complex sentences, and use common words that are clearly and easily understandable.

    Don't

    “Enable location history”

    Do

    “Turn on location history”

  • Avoid the word “please”, except in situations in which the user is asked to do something inconvenient (such as waiting) or the software is to blame for the situation.

    Don't

    “Please enter an email address.”

    Do

    “Enter an email address.”