Grid System in Graphic Designing
Posted April 11, 2011on:
In graphic design work, grid system is used to adjust contents in web page. Combination of margins, guides, rows and columns is used for this purpose. One grid or collection of grids is used for consistent look of web page. In finished web design work, grids don’t show on web page but it helps successfully creating web page layout and printing. It is commonly seen in newspaper and magazines that text is displayed in form of columns and images. Main purpose of using grids is to make better use of space you have on web page not to fill the space extravagantly.
Common types of grid system include two of equally sized, three and four column grids with header on the top and full page grid of squares. Using these types of grids will help creating unique layout of webpage of building clocks, variations in column widths, borders, page size and other layout related features of web page. When graphic or web design work is started, grids must be used to position different elements of web page layout.
It is up to designer when and how to break out the grids when they are established on web page. Breaking out of grids helps creating more interesting layout of a web page. Grids can be used to cross over different elements like column to column, extending the end of page or extend to adjacent page.
Here are some tips for you to create different design elements on web page using grids:
- Simpler grid of 1-3 units can be used for lots of text with few graphics on web page.
- Smaller units of grids are required for designing of brochures, magazines and newsletter. Newsletters and brochures require more text thus 1, 2 and 3 column grids are considered best for such type of designing and layout. Each of them can accommodate long text articles.
- 4 column grids offer more flexibility in creating layout of web page with long text, graphics and other elements of short and long articles.
- Use open grid units to leave white space on your web page because leaving white space is essential for an effective and readable web interface.