shared/references/typography.md

# Typography Strategy

Typography carries hierarchy, voice, pace, and information density

Treat it as a structural component of the composition

## Classify the asset

- `A IMAGE ONLY`
- `B IMAGE WITH SMALL TEXT`
- `C TYPOGRAPHY HEAVY`
- `D POSTER OR AD LAYOUT`

## Define roles before styling

Possible roles

- headline
- support line
- proof or offer
- CTA
- legal or disclaimer
- label or metadata when genuinely needed

Use only the roles the job needs

More styles do not create more hierarchy

## Hierarchy controls

Use a deliberate combination of

- size
- weight
- width
- value
- position
- spacing
- case where language supports it
- typeface contrast where justified

Do not rely on size alone

## Typeface discipline

Prefer one family with enough range or two complementary families

More than two families is a heuristic exception that needs a clear editorial or brand reason

Avoid mixing several expressive display faces in one small asset

## Line breaks

Break lines at semantic units

Avoid leaving weak function words isolated when a better break preserves meaning

Use line count and measure to shape the visual mass intentionally

Do not force a headline into an arbitrary rectangle by shrinking until it loses authority

## Spacing

Use line spacing and paragraph spacing to show grouping

Do not use random vertical gaps between every line

For Latin display type, tracking can be adjusted deliberately to fit the face and scale

For Arabic, do not apply Latin-style character tracking to force width

## Arabic craft

Preserve contextual shaping, connected forms, ligatures, punctuation direction, and appropriate numeral behavior

Do not

- mirror Arabic
- separate connected letters
- insert fake kashida as visual filler
- stretch glyphs horizontally
- track individual Arabic characters like Latin
- reverse punctuation or Latin product names

Balance Arabic and Latin by optical mass, not by forcing identical font sizes or baselines

In bilingual work, define which language is primary and give it primary hierarchy

## Exact copy

Lock exact supplied copy

Do not rewrite it unless copywriting is requested

When a generative image model is unreliable with exact text

1. generate the visual foundation with a protected text zone
2. place or repair exact typography in a deterministic design surface or targeted edit
3. inspect every character after rendering

## Contrast and background

Do not place thin or small type over high-frequency imagery without a controlled field

For digital work where accessibility applies, verify WCAG contrast in the finishing surface

## Optical checks

Inspect

- apparent alignment, not only bounding boxes
- punctuation hanging
- round-letter overshoot
- logo and type optical weight
- rag shape
- awkward widows or isolated words
- collision with faces, products, or high-frequency texture

## Slop signals

Reject

- fake microcopy
- decorative labels with no information job
- too many type treatments
- giant display type used only to fill space
- arbitrary tiny uppercase text
- repeated pills or badges used as decoration
- malformed Arabic accepted as close enough