Mechanics

Capitalization

Use sentence case.

• Sentence case applies everywhere. This includes buttons, menus, headings, subheadings and titles.
• Capitalize proper nouns (opens in a new tab)
• Capitalize the first word of every sentence
• Lowercase everything else
• When referring to items within the UI, capitalize exactly as the item appears in the UI. For example: "Click 'My profile' to change your password."

Punctuation and formatting

Abbreviations and acronyms

For uncommon abbreviations/acronyms, write out the full phrase, followed by the abbreviation/acronym in parentheses in corresponding help text or a tooltip.

There’s no need to spell out commonly understood abbreviations and acronyms.

Ampersands (&)

The ampersand (&) isn’t used in all languages and doesn’t localize well. Try and avoid using them unless it’s part of a company or brand name (for example, M&M's) or you’re trying to save on character count within the UI.

Commas

Don’t use the serial comma, aka the Oxford comma, aka the comma before “and” in a list of 3 or more items.

It’s okay to use a serial comma if leaving the comma out causes ambiguity in the sentence’s meaning.

Use a comma before “but” if the “but” connects two independent clauses. In the example below, you can see each part of the sentence is an independent clause because each clause could stand on its own as two separate sentences.

Generally, you should not use a comma before “because” if it's a subordinating conjunction. Its job is to join subordinate clauses to independent clauses.

Currencies

When referring to currencies, always use the 3-letter ISO 4217 currency abbreviation (opens in a new tab). Don’t write out the full currency name. In many cases, the full name is less recognizable than the abbreviation.

When the currency abbreviation follows a monetary amount, put the abbreviation in parentheses.

Date, time and phone numbers

American English is the default language of UX writing at BigCommerce. As such, follow the American style of date, time and phone number notation.

Date Use the 3-letter month abbreviations: Jan, Feb, Mar, Apr, May, Jun, Jul, Aug, Sep, Oct and Nov. Do not use a period after the month name when abbreviating.

Use day-of-the-week abbreviations: Mon, Tue, Wed, Thu, Fri, Sat and Sun. Do not use a period after the day when abbreviating.

Time

Don’t use periods in “AM” and “PM”

Be sure to check the region’s time zone and if it’s daylight savings time or not. For example, CDT is Central Daylight Time and CST is Central Standard Time.

Phone numbers

Use hyphens to break up phone numbers. Don’t use parentheses or periods.

Exclamation point

Save the exclamation point for something that’s actually exciting. Settings saved! Product added! Not too exciting. Doesn’t need an exclamation point.

File extensions

There’s no need to write out file extensions in full. Always use the abbreviation, lowercase, no period.

Hyphens and dashes

This is a hyphen (-)

Hyphens are used to join compound words. Hyphens never have spaces around them.

This is an en dash (–)

En dashes are used to indicate a range between two numbers. Don’t put spaces around an en dash, unless you’re talking about dates featuring words. For example, May 3 – May 5.

If the number range is preceded by the words “from,” or “between,” then use the word “to” instead of an en dash.

This is an em dash (—)

Em dashes are used to indicate an abrupt pause or change in the middle of a sentence. Em dashes can also be used to call out or add emphasis to an important part of a sentence. Em dashes should always have a space before and after.

Percentages

Use the “%” symbol instead of writing out the word.

Periods

Do not use periods, or any ending punctuation of any kind, on titles, labels, headings, subheadings, numbered/bulleted lists or anything that a user can interact with (anything clickable). The latter category includes CTAs, buttons, menus and links outside of sentences.

Let’s look at an example:

In the card above, the text above the divider qualifies as a header — it’s giving a name to the tile that it appears on — and doesn’t need a period.

The line of text below the divider needs a period because it’s just body text. It’s not giving a name to anything, it’s visually separated from the header and just too long to be a subheading.

As for the button, interactive items should never have ending punctuation of any kind.

Quotation marks

Use quotation marks when referring, in the UI, to another item within the UI. This could be a page or area within a page. It could also be an item the user can interact with, for example, buttons, menus and links (anything clickable). This typically happens when writing help text or tooltips.

• The quoted item should be written exactly as it appears in the UI
• Ending punctuation always goes inside of the quotes
• Don’t use bolding

Let’s look at an example:

Slashes

You can use forward slashes “/” to indicate the word “or” between two words. When doing so, don’t use spaces before or after the slash. Don’t use backlashes “\”.

On the other hand, when using a forward slash to signify “or” between two multi-word phrases, use spaces before and after the slash — it helps with readability.

Units of measurement

Add a space between numbers and units of measurement. Use all lowercase and always abbreviate.

Don’t add a period. Don’t pluralize measurements (“lbs” is in common use and okay to use).

When abbreviating units of data, always capitalize MB (megabyte) and GB (gigabyte). Don’t use Mb and Gb as these represent different units of measurement typically used when measuring Internet speeds.