Marshall Art Studio design system

Content Style Guide

Writing standards for UI copy, article content, metadata, and navigation labels. Applied consistently across Marshall Art Studio projects to support clear communication, accessible language, and predictable content patterns across cross-functional teams.

Voice and tone

Marshall Art Studio content is direct, specific, and free of filler. Every sentence earns its place. Tone adjusts by context — technical documentation uses precise language; public-facing copy stays conversational without being casual. When in doubt, favor clarity over cleverness.


Grammar and mechanics

Standard American English with a preference for plain language over formal register.

  • Serial comma: Always. "Designers, developers, and stakeholders" — never omit the final comma.
  • Capitalization: Sentence case for all headings, labels, subheadings, and navigation items. Capitalize proper nouns and product names only.
  • Numbers: Spell out zero through nine. Use numerals for 10 and above, percentages, measurements, and version numbers.
  • Dates: Month DD, YYYY format. "January 15, 2026" — not "1/15/26" or "15 January 2026."
  • Ampersands: Spell out "and" in body copy. Ampersands are acceptable in tight UI labels where space is constrained.

Plain language

Favor shorter words and shorter sentences. Avoid nominalization — "use" not "utilize," "help" not "provide assistance to," "show" not "surface." Each sentence should do one job. If a sentence requires a second read to parse, rewrite it.

Active voice is the default. Passive constructions are acceptable when the subject is unknown or irrelevant.


Headings

Headings describe what follows — they don't tease or editorialize. A reader should be able to scan headings alone and understand the page structure.

  • Sentence case: All headings use sentence case without exception. Capitalize the first word and proper nouns only. Title case is not used anywhere in the design system.
  • H1: One per page. Matches the page title in the <title> tag.
  • H2: Major sections. Used for navigation anchors.
  • H3–H4: Subsections within H2 content. Never skip heading levels.
  • Length: Keep headings under 60 characters where possible. No punctuation at the end.

UI copy

Labels, buttons, tooltips, and error messages follow stricter rules than article copy.

  • Buttons and CTAs: Imperative verb phrases. "Browse components," "View style guide," "Save changes" — not "Click here" or "Submit."
  • Navigation labels: Nouns or noun phrases. "About," "Blog," "Design System" — not "Learn more" or "Check out our work."
  • Error messages: State what happened and what to do next. "Email address is required. Enter a valid email to continue." Avoid blaming the user.
  • Tooltips: One sentence maximum. No period at the end.

Link text describes the destination, not the action. "View the component library" — not "Click here" or "Read more." Avoid linking full sentences. Screen readers announce links individually; vague link text removes context for non-visual users.

External links open in a new tab and include a visible indicator. Internal links open in the same tab.

Metadata and SEO

Consistent metadata supports predictable social sharing and search indexing across all pages.

  • Title tags: [Page name] - [Site or section name]. 50–60 characters.
  • Meta descriptions: 140–160 characters. Describe what the page contains. Write for humans, not crawlers.
  • OG and Twitter tags: Match the meta description unless a shorter version improves social readability.
  • Alt text: Descriptive for informational images; empty (alt="") for decorative or redundant ones. Never use "image of" as a prefix.

Punctuation reference

Pattern Preferred Avoid
List separator Serial comma Omitting final comma
Heading end No punctuation Period or colon
Abbreviations Spell out on first use Undefined acronyms
Ellipsis Sparingly, in UI only In body copy
Em dash No spaces—like this Spaced – like this

David Marshall