#Type and grid how to#

Adhering to a grid helps the designer make decisions. Simply put, grids bring a sense of order. Items, whether blocks of text, images, pull quotes, virtually any form of content, are arranged on the grid.Ī website grid with basic content blocks applied looks like this:

Maps use grids: the grid is expressed via longitude and latitude.They can even be measured in millimeters, if that’s your thing. Grids can be measured in pixels, percentages, picas or inches. Grids always have columns - sometimes they have rows (typically called the baseline grid).

#Type and grid how to#

But one must learn how to use the grid it is an art that requires practice.” So, What is a Grid? It permits a number of possible uses and each designer can look for a solution appropriate to his personal style. “The grid system is an aid, not a guarantee. “The use of the grid as an ordering system is the expression of a certain mental attitude inasmuch as it shows that the designer conceives his work in terms that are constructive and oriented to the future.”Īt the same time, he can be very practical: His statements 1 often go beyond just advocating for a systematization of design - an insistence on objectivity - stating that the designer’s calling has a higher purpose: Later, Josef Müller Brockmann (who was deeply influenced by the theories espoused at the Bauhaus) took up the charge and wrote extensively on the importance of the grid for graphic design. The Bauhaus is often credited with emphasizing the importance of both theory and practice in design and is sometimes referred to as the birthplace of graphic design. Although there is no direct correlation here to the concept of the grid, there certainly is an orderly system in place. The Bauhaus model of teaching was based on this diagram, developed by Walter Gropius in 1922. In 1919, an art school was formed in Germany called Bauhaus (“School of Building”), which set forth to create a holistic practice. How was everything kept neat and orderly? The grid.

Later, with the birth of the printing press, blocks of text were set using tiny blocks of type – letter by letter. Scribes would line their documents to provide visual guides for orderly composition. Grids have been a part of human experience since the advent of writing, if not earlier. A Very Brief History of the Grid in Graphic Design Several grid frameworks followed and today we rarely think of designing a site without basing the design on a twelve column grid. While many developers sought to build their own grid systems in code, Twitter released Bootstrap as an open source solution. The days of arbitrarily assigning proportions to sections of a page came to an abrupt end. Many developers sought a more systematic approach to layout - to ensure compatibility, but also to maintain their own sanity. While the web originated as a heavily text-oriented medium with some support for visual elements, users today expect a highly visual, rigorously designed experience.Īdditionally, with the advent of smartphones and tablets, web designers were forced to drop fixed-width designs. The concept of the grid is as old as geometry itself, and while I won’t pretend to be a mathematical scholar, I believe that the grid has had an incredible impact on design, both analog and digital. Those elements can be exciting or frustrating, depending on how well you know the city. Of course, even cities that were planned around this system can be punctuated by elements like traffic circles or divided by diagonals that add a little variety to the experience (think Washington, D.C.). If you’ve ever driven in a city that’s neatly divided into quadrants and subdivided by an orderly arrangement of streets that adhere to the four cardinal points, you’ve experienced the power of the grid. Matt DeVille, VP of Digital, meditates on the nature of grid systems in design.