Skip to main content
Studio Help · Content Guide

Best practices for content in Studio CMS

A concise and reusable guide to creating consistent, readable, and easily maintainable pages.

1

Basic principles

For any page

🧭
  • Present one idea per block. When addressing two topics, divide them into separate blocks.
  • Prioritize impact over details. Structure: short title → background text → proof (image, cards, or testimonials) → CTA.
  • Consistency is more important than aesthetics. Changes in tone, size, or spacing throughout the page compromise uniformity.
2

Titles

Hierarchy and length

✏️

Simple rules

  • The title should convey the main message. The subsequent text provides the explanation.
  • 3–8 words is ideal.
  • Avoid titles with more than two lines on mobile devices.

Patterns that work well

  • Short phrase: It shines on the screen.
  • Label + title: NEON MODE; Controlled impact
  • Two beats: PULSE. Rhythm and response
⚠️
Avoid: long titles, titles with multiple commas, or titles that resemble paragraphs.
3

Text

Paragraphs and reading

📝

Recommended length

  • It is recommended to use 2 to 4 lines per paragraph on the screen.
  • Use between 50 and 120 words per block as a reference.

Quick structure

  1. Include a catchy phrase, preferably short.
  2. Add two or three sentences of context.
  3. Use three to five bullet points to facilitate quick reading when needed.

When splitting into columns

  • Use two columns for longer texts, such as short manifestos, editorial notes, or extensive lists.
  • Always check the behavior on mobile devices , as the content is often stacked.
⚠️
Avoid: large blocks of continuous text and multiple formatting (sizes or colors) within the same block.
4

Lists

Bullets and steps

📋
  • Ideally, use 3 to 5 items per list.
  • Each bullet point should contain one line, with a maximum of two.
  • Start bullet points with verbs or consistent terms:
  • Destaca… / Organiza… / Responde…
  • Contraste… / Ritmo… / Clareza…
5

Images

Quality, proportion and consistency

🖼️

Minimum quality

  • For featured images, use a width of approximately 1920px or greater.
  • For grids or mosaics, use a width of approximately 1200px or greater.

Recommended proportions

Hero 16:9
Editorial 4:3 / 3:2
Grid / Tiles 1:1 / 4:5

Readability rules

  • Avoid images with small embedded text, as they may become illegible on mobile devices.
  • Ensure a safe area: the main element should not be near the edges to avoid cuts.
  • If you use an image as a background, always check the text contrast.
6

CTAs and links

Clear action

🎯
  • Include a main CTA per section, whenever possible.
  • The button text should contain a verb followed by the objective .
  • Explorar coleção Ver exemplos Pedir demo
  • Avoid repeating generic CTAs, such as "Learn more," in every section.
⚠️
Golden rule: if the user doesn't know what will happen when they click, the CTA has failed.
7

Spacing and rhythm

What fails the most?

📐
  • Use consistent spacing between sections. Avoid different margins or padding in each block.
  • Sections with color or background should have sufficient padding to ensure good readability.
  • If the page looks "cramped," increase the padding before increasing the font size.
💡
Practical tip: always test the page on mobile before publishing — that's where pacing issues first appear.
8

Final checklist

Before publishing

The titles are short and do not exceed two lines on mobile devices.
There are no large blocks of text; it uses short paragraphs and lists when appropriate.
The images are of good quality and have consistent proportions.
There is sufficient contrast between the text and the background.
The page order is logical: introduction → proof → action.
The CTAs are clear and not repetitive.