Five Simple Steps

A Practical Guide to Designing Grid Systems for the Web

By Mark Boulton

Grid Systems have been used in print design, architecture and interior design for generations. Now, with the advent of the World Wide Web, the same rules of grid system composition and usage no longer apply. Content is viewed in many ways; from RSS feeds, to email. Content is viewed on many devices; from mobile phones to laptops. Users can manipulate the browser, they can remove content, resize the canvas, resize the typefaces. A designer is no longer in control of this presentation.

Designing Grid Systems for the Web

Designing Grid Systems for the Web is a practical guide to designing visual information structures for the web.

Table of Contents

Part #1 : Why Grids?

  • Chapter 1: Structuring Information
  • Chapter 2: Standardisation and Connectedness
  • Chapter 3: Introduction to grid systems
  • Chapter 4: Historical and cultural context – media/print/architecture/built environment
  • Chapter 5: The Typographic Grid

Part #2 : Designing Grids

  • Chapter 6: Constraints & Approach
  • Chapter 7: Types of Grid System (The building blocks of grids)
  • Chapter 8: Macro & Micro
  • Chapter 9: Ratios
  • Chapter 10: Breaking the Grid

Part #3: Grids in the Browser

  • Chapter 11: Considerations for the Web
  • Chapter 12: Fixed Grids
  • Chapter 13: Fluid Grids
  • Chapter 14: Baseline Grids
  • Chapter 15: Cascading Grids

Part #4 : Frameworks

  • Chapter 16: YUI
  • Chapter 17: Blueprint
  • Chapter 18: 960.gs
  • Chapter 19: YAML
  • Chapter 20: Baseline

Part #5 : Let’s build a Grid System!

  • Chapter 21: A site in need of a grid system
  • Chapter 22: Defining constraints
  • Chapter 23: Designing the grid
  • Chapter 24: Broaden the grid
  • Chapter 25: Grids and Styleguides

MARK BOULTON

Mark Boulton is a web designer and author. He is the head of his own studio, Mark Boulton Design, where they try to make useful beautiful things for clients around the world. Sometimes outspoken, always passionate, Mark started out designing web sites when he was the 'young guy' in the studio back in 1997. He's been banging on about applying the fundamentals of good graphic design on the web ever since, much to the dismay of his family, friends and colleagues.

Mark lives in South Wales with his wife and daughter, a small collection of neglected bonsai and a guitar he wish he owned when he was 18.