A modular grid layout organizes content into repeated modules using fixed row and column dimensions. It gives a page a consistent visual structure while allowing different sections to use distinct arrangements. section 6.3.2
Use a modular grid to make practical layout decisions:
- Choose the page’s overall layout as part of its skeleton structure, considering how users read through the content. section 6.3.2
- Vary column arrangements between sections when useful, but keep related content choices consistent—especially through the main body of text. section 6.3.2
- Keep shared elements such as the header and footer consistent across pages, even when their body layouts differ. section 6.3.2
A modular homepage
A homepage might use four columns for one row, an asymmetrical two-column row for the next, and three columns below. Unlike a masonry layout, each module follows fixed row and height dimensions. section 6.3.2
