Grid Design and Reusability
In the world of website design, many modern websites are constructed using something called Cascading Style Sheets or (CSS). CSS is a complex topic, but the essence is that you can apply formatting and layout to a webpage without actually ever seeing the webpage. You do this by defining attributes of items in CSS and then using those attributes in the actual website. For example, it's like using BOLD in a word processor. Bold has been defined before type a single word. When you use bold, it does the same thing no matter where it is in your document. With CSS, the same thing can be done with the layout. For example, a header can be defined as 1 inch tall and 8 inches wide. Taken to its logical end, you get a grid type design where everything is defined as 1 column wide, 2 columns wide, etc. Sound familiar?
We are going to borrow the grid concept in a very basic form. By dividing our newsletter template in 3 columns horizontally and vertically, we can create numerous easily changeable newsletters from a single template by using the same concepts as the CSS grids. We can have 3 columns each 3 rows high, or we can have 3 columns each 2 rows high, or we can have 3 columns each 1 row high, and so on. In order to keep our template with maximum reusabitlity, all we have to do is use the same for all 3. Want rows that go all the way across the screen? Great, 3 rows all 1/3 of the page high.
If you are thinking about 2 columns each 3 rows high and 1 column that is 2 rows high and another 1 row high underneath, then you've gone off the maximum reusability reservation. For our purposes, you want three of the same. That is what makes them so easy to move around.
There is no need to re-invent the wheel here, so we'll start with the same basic layout as our Microsoft Publisher template example using our new rules. There are 3 columns each with one row 2 high and one row 1 high.
It looks slightly different because we are working with thirds instead of fourths, but the basic concept is the same. So far, so good.