{ "@context": "https://schema.org", "@type": "FAQPage", "mainEntity": [ { "@type": "Question", "name": "What is a gutter in a grid system?", "acceptedAnswer": { "@type": "Answer", "text": "The space between columns that provides breathing room between content sections." } }, { "@type": "Question", "name": "What grid should websites use?", "acceptedAnswer": { "@type": "Answer", "text": "12-column grids are the most flexible standard for web design." } }, { "@type": "Question", "name": "What is CSS Grid vs Bootstrap grid?", "acceptedAnswer": { "@type": "Answer", "text": "CSS Grid is native to the browser; Bootstrap's grid uses predefined classes built on flexbox." } } ] }
Definition

What Is a Grid System in Web Design?

A layout framework of columns and gutters used to organise content consistently across a webpage or design. Ensures alignment and visual order.

Related Terms

Responsive Design

Visual Hierarchy

Whitespace

Above the Fold

Accessibility (A11y)

Example

A 12-column CSS grid allows a designer to place two 6-column content blocks side by side on desktop, stacking them on mobile.

Synonyms:

Column grid, Layout grid

Acronyms:

-