The website grid is a method of arranging content on a page, as well as generating alignment and order. It act as the skeleton or fundamental framework of user interface.
There are five types of layout grids: 1. Column Grid 2. Manuscript Grid 3. Modular Grid 4. Hierarchical Grid 5. Baseline Grid
These are made up of columns and are used to organize multiple components.
It is always present in a Word document or a presentation template.
It is similar to a column grid but use to organize more elements.
A freestyle grid where pieces are “spontaneously” arranged among the columns and rows.
A baseline is a line on which text is placed.
There are many benefits of using a grid layout: - Efficiency & Consistency - Clarity and Order - Quicker Process - Easy to Modify
Here are our four best practices to follow: - Select the Needed Grid - Keep Constraints in Mind - Grids for Mobile - Pay Attention to Vertical & Horizontal Spacing
When selecting a grid, choose one with the number of columns that your design requires.
Keeping constraints in mind helps you to concentrate on what is truly essential to your users.
Paying attention to horizontal and vertical rhythms makes the overall structure cleaner.
When designing for mobile adopt a tile layout grid with the same column and row heights.