STUDIO JOURNAL

Let the content set the grid

A useful grid makes a collection legible when titles grow, images change or a screen becomes narrow.

Illustrative still life for Let the content set the grid

Find the smallest useful card

Collect representative titles and summaries, including the longest ones. Identify where headings, metadata and actions start to lose their relationship.

Try the in-between widths

Choose columns from available space. Rehearse a reading task between device presets and with text enlarged. Preserve the source order as cards reflow.

Share the rule

Record the minimum card width, gap and reading order. Fieldnote makes those decisions visible through three preview widths.

MDN responsive design guide ↗

Try the related case study