Squarespace Basics: The Grid

One of the best parts of Squarespace is how incredibly customizable it is - without needing to know/use code. This makes it approachable and easy to use for both beginners and professionals alike.

Today I want to tell you about one of the most fundamental elements behind why Squarespace is so good. 

 
 

THE GRID

Thankfully Squarespace’s grid is much easier to understand than this.

Thankfully Squarespace’s grid is much easier to understand than this.

 

Websites have been built of table or grid systems since the early days of the web's existence. Squarespace also uses a grid system. The brilliant part is that their grid has 12 columns

Squarespace’s 12 beautiful columns

Squarespace’s 12 beautiful columns

 
 

Why is "12 Columns" Brilliant?

Because math! 12 is divisible by both 2 and 3. Meaning, you can divide up your website into equal halves, thirds, fourths, sixths, eighths, or twelfths. Plus, your columns don’t have to all be equal. In other words, you can have one column be 1/12 wide, one 4/12 wide, one 6/12 wide, and one 1/12 wide. As long as it adds up to 12, you can do it.

Columns divided up 1/12, 4/12, 6/12, 1/12. I probably wouldn’t recommend dividing up the section this way….

Columns divided up 1/12, 4/12, 6/12, 1/12. I probably wouldn’t recommend dividing up the section this way….

 
 

You have an incredible amount of variability and variety in 12ths which will allow you to lock in exactly the look you’re going for. 




That's all I've got for today. I hope this helps you in your journey to the perfect website. If you have any questions, contact me and I'll be glad to help out. 

Previous
Previous

Good Design: iPhone 13 Case Edition