UX Content Style Guide

What is the style guide, and how should I use it?

This guide aims to provide product design teams at Dell with a single set of standards and best practices for user interface content. Reference the content writing rules in this guide as you build experiences for our customers and internal users.

This guide may not include rules that are relevant for marketers, technical writers and people working outside realm of the Dell Design System.

What we consider UX content:

  • Any instructional content or microcopy that helps people complete tasks on the website.
  • Informational text that pertains to the user’s experience on the website.
  • Labels and other verbiage associated with any of the components in our UI design system.
  • Error alerts and system-wide communications triggered by Dell.
  • Transactional notifications, emails and other types of communication triggered by users.

UX content style rules and tips for product teams

Plain language and active voice

Use plain language: When you design with plain language, you allow the broadest range of users to understand and use our products easily.

Plain language writing tips

  • Use conversational language. Avoid overly technical jargon. If you are unsure if a term is okay to use, visit the IDD Styleguide, page 60, for our approved glossary of terms.
  • Write words for on-screen experiences in similar ways to how you would say words during an in-person conversation.
  • Use concise phrases that can be understood by someone reading at a 7th-grade reading level, when possible:
    • Do: "next to"
    • Don’t: "adjacent to"
    • Do: "Do you need help?"
    • Don't: "Do you require assistance?"
  • Use correct grammar, spelling, and syntax. Include the necessary articles, modifiers and prepositions. When you have limited space, consider using the contraction form of two words rather than eliminating any words:
    • Do: "Select your address from the list."
    • Don’t: "Select address from list."
    • Do: "We’re having trouble processing your order."
    • Don't: "We are having trouble processing order."
  • Avoid unnecessary modifiers, such as actually, really and very.
  • Use consistent phrases across pages and experiences.
  • Make sure the user has all the information they need. Avoid vagueness:
    • Do: "A Dell representative will contact you in 1-2 business days."
    • Don’t: "This service is the best thing since sliced bread."
    • Do: "This product is very popular with business shoppers."
    • Don't: "Every business buys this product."

Active voice and passive voice

Passive voice can confuse readers at all reading and neurological levels. Use active voice whenever possible, and use passive voice sparingly.

What is active voice: When you write content in the active voice, a subject (who or what) performs the action of the verb.

What is passive voice: When you write content in the passive voice, you are stating that an object receives the action, but the subject is never explicitly stated.

Tip: Ask yourself who or what is receiving the action. Begin the sentence with that subject:

    • Active / Do: "You successfully submitted the quote."
    • Passive / Don't: "The quote was submitted."
    • Active / Do: "We received your request."
    • Passive / Don't: "Your request was received."
    • Active /Do: "We had a problem submitting your order. Please try again later."
    • Passive / Don’t: "There was a problem submitting your order. Please try again later."

When to use passive voice: You can use passive voice when you don’t know the performer of the action, you don’t want to reveal the performer of the action, or you want to emphasize the receiver of the action. You should also use passive voice as necessary to avoid unsupported product claims.

Call-to-action labels & link text

Calls-to-action: Call-to-action (CTA) labels provide clear, logical paths to actions that people visiting our website intend to take. A CTA can navigate the user somewhere else or complete a task for them

General rules:

  • All CTA labels must begin with a verb.
  • Use [Verb] + [Noun] as a formula, when possible. In some cases, the action verb alone can be used without the noun.
  • The CTA should be specific to the action or path. Avoid generic labels, such as "click here" or "learn more", when possible.

Button and text link CTA labels

  • For UI component information, visit the button component page.
  • Use title case. Capitalize the first letter of each word except for articles and short prepositions:
    • Do: "Contact Sales"
    • Don’t: "contact sales"
    • Don’t: "CONTACT SALES"
    • Do: "Add to Cart"
    • Don’t: "Add To Cart"
  • Do not include punctuation.
  • Use no more than three words, when possible. In specific cases, you can use more than three words if there isn’t a shorter alternative that accurately describes the task.
  • Avoid combining two action verbs in a single CTA label (exception: “Customize & Buy”).
  • All of the text of a link CTA should be hyperlinked, including the verb.
  • For improved SEO, use specific nouns when possible, and given word and character limitations:
    • Do: "Shop Latitude"

Inline text links

Inline text links are hyperlinked text within another sentence or following a sentence of paragraph copy. Only use inline text links to provide navigation pathways for users.

  • Use inline text links sparingly.
  • Use sentence case for inline text links, unless the link includes a brand name or proper noun.
  • Hyperlink all of the text describing the destination. You can exclude articles, such as "the."
  • Include a verb as you would with a regular CTA, but do not hyperlink the verb.
  • Include punctuation.
Capitalization

Types of capitalization: There are three primary forms of capitalization: Sentence case, title case, and all caps.

Sentence case

Usage: Use sentence case for most content, including all headlines (except for h1), component labels, banner content and paragraph copy, except when that copy includes a proper noun or brand name.

What is sentence case?

  • Sentence case refers to the practice of capitalizing only the first word and any proper nouns or brand names in a group of words.
  • Colons in sentence case: Capitalize the first word after a colon (akin to the first word of a subtitle).
  • Hyphenated compound words in sentence case: Only capitalize words in a compound if any of the words are a proper noun or brand name. For example:
    • "Do you need help?"
    • "Dell Technologies is the leader in digital transformation"
    • "Explore our best-in-class XPS laptops"
    • "G Series laptops: High-performance gaming"

Title case

Usage: Only use title case for page titles (h1), call-to-action (CTA) labels, navigation labels, brand names and proper nouns.

What is title case?

  • Title case refers to the practice of capitalizing the first, last and principal words in a group of words.
  • Principal words are any nouns, verbs, adverbs or adjectives—regardless of length—as well as prepositions and conjunctions of four or more letters.
  • Minor words should be lowercase. Minor words are any coordinating conjunctions (and, but and or), prepositions of fewer than four letters (of, on and in), articles (a, an and the), and infinitive markers (the to before a verb).
  • Colons in title case: If there is a colon in title-case text, what follows should be treated as a subtitle. Capitalize the first word after the colon even if it is a minor word.
  • Hyphenated compound words in title case: Always capitalize the first word in the compound. Capitalize the following word in the compound if it is a principal word. However, if the first word of the compound is a prefix, make the second word lowercase unless it is a proper noun or proper adjective. Capitalize the prefix itself.
  • Title case examples:
    • "The XPS Laptop"
    • "Our Best-Selling Laptops"
    • "Read the Paper: Intro to Cloud Computing"
    • "Shop for Best-Selling Laptop"
    • "Select a Pre-built System"

All caps

What is all caps? All caps refers to the practice of capitalizing every letter of a word in a single word or group of words.

Usage: Do not use all caps, except when using acronyms and initialisms, both of which should be used rarely.

  • All caps examples:
    • Don't: "THE XPS LAPTOPS"
    • Don't: "CONTACT US"
Notifications, errors and alert messages

For UI styling, see the notifications component page.

There are four overarching rules for writing an error alert message:

  • Write in the active voice as often as possible.
  • Write in sentence case.
  • Be specific and concise. 
  • Provide logical next steps, when applicable.

Error and alert titles

Usage: Titles are optional for error and alert messages that use our yellow alert UI component. In some cases, a title may help draw attention to the message. In cases of very short errors and alerts, a title may be redundant. Don't use titles for field validation errors.

Style:

  • Titles don't have to be complete sentences, but they do need to be meaningful phrases that our users will immediately understand. Don't punctuate the title unless it is a complete sentence.
  • Avoid including the error code number or other technical terms in error titles. If you must include a code, include it in the error message’s body copy.
    • Do (Titles): "We're experiencing server downtime"
    • Don't (Titles): "Error 500"
  • Write in sentence case.
    • Do (Titles): "We’re verifying your order"
    • Don't (Titles): "Error 500"

Error and alert body copy

Usage: All notifications, alerts, and errors should contain body copy.

Style:

  • Use full sentences, as much as possible.
    • Do: "You successfully added 56 standard configurations to your account."
    • Don't: "56 standard configurations added to account"
  • Avoid writing lengthy passages of text. try to limit the body copy to 1-3 sentences.
  • Describe specifically what happened or what will happen.
    • Do: "We’re experiencing server downtime."
    • Don't: "Something went wrong."
  • Include specific information that is relevant to the message, such as time or a specific error code, when applicable.
    • Do: "Our site will undergo planned maintenance on November 12, 2019 from 6:00pm CST until November 13, 2019 at 12:00pm CST."
    • Do: "Your eQuote #12345 expired on January 12, 2020."
    • Do: "Please contact your account representative and refer to the error code #2048693."
  • Provide specific, actionable next steps and solutions, when applicable:
    • Do: "Try reloading the page. If you’re still experiencing issues, call 1-800-663-4059 or chat with an agent."

Other types of content:

  • Marketing and thought leadership articles, press releases, case studies, etc.
  • Advertising banners and other types of ad placements.
  • Technical documentation.
  • Marketing communications sent to customers.
  • Non-digital forms of marketing communications.

Can’t find what you’re looking for?