Marketing 101: What are grids (design)?
Marketing has a language all its own. This is our latest in a series of posts aimed at helping new marketers learn that language. What term do you find yourself explaining most often to new hires during onboarding? Let us know.
This article was originally published in the MarketingSherpa email newsletter.
In a previous Marketing 101 post on MarketingSherpa, you might have read about the rule of thirds, “… a basic guideline for framing and image composition that results in the viewer seeing a balanced, more naturally flattering image.” (Check out the blog post here if you haven’t read it yet.)
The rule of thirds is an example of a grid, specifically a 3 x 3 grid that’s used primarily for images, photographs, paintings, and possibly other mediums, such as landing pages. While it may be the most well-known grid, there are a whole lot of other grids out there that can help structure the layout of your landing page, approved by web designers everywhere.
A grid is a framework of intersecting vertical and horizontal (or angular) lines that are used to subdivide a page into margins, columns and modules (boxes) to structure content on a layout. Basically, it’s a visible guide for placing images, text and graphic elements onto a page with purpose or rational logic.
Why should you use grids?
- It saves a lot time.
After some practice, it becomes easier and faster for you to see where text and images could perfectly align. You also don’t have to design the grid yourself (unless you want to) as there are many popular grids used in web design layouts that are one Google search away (and mentioned below.)
- It makes collaborations run smoother.
Grids can become part of a guideline that each member of a design team must follow, making it easier to collaborate on a project. It keeps the layout design consistent.
- Webpages look organized and balanced overall.
Using the same grid or similar grids for multiple pages will help unify them, making these pages predictable for visitors and easy to navigate — although be careful not to make it so predictable that the layout becomes boring.
How do you use grids?
Grids have basic elements; here’s an overview:
