Composition and layout

Member lesson

Column grids, modular grids, baseline grids

Lesson 9 of 27 in Composition and layout.

Grid Systems in Graphic Design (Ep. 3) | Foundations of Graphic Design | Adobe Creative Cloud · Adobe Creative Cloud
Lesson

Three grids, in rising order of strictness. A column grid governs width. A modular grid governs width and height together. A baseline grid governs the vertical position of every single line of text, using the baseline en.wikipedia.org, the line letters sit on, and the leading en.wikipedia.org, the distance from one baseline to the next.

12 columns · 8px gutterspans 5spans 6
A twelve-column grid with gutters, and a block spanning five columns.
Le Corbusier's Palace of Assembly at Chandigarh photographed across its reflecting pool in low sun: a deep concrete portico under an upturned curved roof, a grid of shaded window bays running down the long side, and the whole building doubled in still water beneath a clear blue sky.
Le Corbusier's Palace of Assembly in Chandigarh, doubled in its pool. The facade is built on a grid, the same idea a layout grid uses on a page.Palace of Assembly, Chandigarh. Photograph by UnpetitproleX, 2021. Building by Le Corbusier, 1962.Wikimedia Commons/CC BY-SA 4.0
Member

The rest of this is for members.

You have read the opening of this lesson. The rest of it comes with a membership.

One membership covers all four courses and Brands.

  • All lessons in the four Learn courses
  • All brand breakdowns in the Brands section
  • All quizzes, flashcards and crosswords
  • An AI teacher on every lesson, for up to 60 questions a day
  • All course material published during the membership

Price

Membership is from $12 a month on the Yearly plan, which is charged at $144 once a year. Lifetime access is $59, paid once.Membership is from ₹200 a month on the Yearly plan, which is charged at ₹2,400 + GST once a year. Lifetime access is ₹3,999 + GST, paid once.

Check what stuck

Members only

You can't take this check yet.

Members answer these 3 questions and keep the ticket for this lesson. Every lesson has one.

  1. Question 1, locked

    What does a baseline grid align?

    • The bottoms of the lines of type, across columns
    • The outer margins of the page
    • The tops of the images
  2. Question 2, locked

    What does a modular grid give you that a column grid does not?

    • Horizontal divisions as well as vertical, so blocks can be placed in both directions
    • Wider margins
    • Automatic hierarchy
  3. Question 3, locked

    Which of these words means this? “The page cut into vertical columns with a gap between them. Content is allowed to span whole columns and nothing in between.”

    • Column grid
    • Visual weight
    • Pacing
    • Dynamic symmetry

Elsewhere in the library

Hear about new courses.

Leave an email and we will tell you when something new lands. We do not write often.