Grid system and its types

Grid system and its types

What is Grid system and its types?

Grid is like an architectural blueprint which helps you to arrange item on your landing page and makes it look balanced.

This procedure is known as Grid System. There are five types of grid systems:-

· Manuscript

  • Column
  • Modular

· Baseline

· Hierarchical


Manuscript Grid System:-Manuscript grid creates a rectangular inside your page. It is mostly use in E-Books, books, presentation, document, pdf etc. It creates an invisible line around the edges, header & footer of your confirmed page. which helps you not to spill text outside of that area to prevent cutting of text while printing .It is very important part in printing of magazines, newspaper, books. All the pages follow the same path as the layout design of first page.

Column Grid System:-Column grid is used in online newspaper , blogs ,

E-magazines designs. In this, the grid is represented in the shape of columns. Column grid can be of two columns also as four to five columns.

There are two sub-types of column grid system:-


  • Symmetric
  • Asymmetric

In symmetric all columns have same width and height or space. Example:- printed newspaper.

In Asymmetric all columns has different width, height and space between them. Example:-Blogs.

Baseline Grid System:-Baseline grid is basically where the text is need to be placed. A baseline can be used in any of grid system. It provides a good flow to the text. It is normally use in heading and sub-heading of content.

Modular Grid System:-Modular grid is a column grid which also contains rows in it. Modular grid used in social media, e-stories, forms & charts, schedules etc. It is normally used more in e-commerce sites, phone homepage etc.

Hierarchical Grid System:-Hierarchical grid is also known as loose organic grids. It is use in web designing .In hierarchical grid content is placed as per order of importance. It contains some hints of modular grid in itself to make a well- balance hierarchical grid.