Home > Web Designer Wall > How to use rule of third in web design: Know your layout sweet spots

How to use rule of third in web design: Know your layout sweet spots

Now that we’ve started covering the topic of proportion in design (beginning with the Golden Ratioarticle), let’s look at another vital subject. Getting a firm grasp of the Rule of Thirds will empower you to fine-tune your eye to bring out the best of the elements in your design by placing them where they belong best.

What Is the Rule of Thirds?

The Rule of Thirds is another way to look at the layout of a design (be it a web page, a painting or a photograph). The idea is straightforward; you place a simple grid overlay (divided equally into thirds, both horizontally and vertically) on the space to be used for the design. This makes a grid of nine equal-shaped boxes. To do this, we make two sets of parallel lines at even places over a background. So, going from the top left, measure the width of your background. If you’ve got a width of 36 cm, mark out points at 12 cm and 24 cm. Then, look at the height. So, again going from the top left, measuring down, we get a reading of 24 cm. Therefore, mark out points at 8-cm intervals (8 cm and 16 cm down). Now that we have our grid points set, we can make the grid!

If you’re near a piece of paper or want to switch to a drawing application, try this experiment. Using your ruler, measure the width and height (or length and width, if you have paper, turning it so it’s in landscape aspect), and then mark out the points to get the intervals for your grid lines. If you’re doing this on paper, be sure to measure and mark both top and bottom points, as well as the left and right ones to ensure that the lines will be parallel. Once you’ve got the points marked, draw the lines to make your grid. Notice how those two sets of lines make nine equal-sized boxes. Notice, too, how the lines meet at four points towards the center.

For aesthetic appeal, breaking the design up (horizontally and vertically) so that each third has a similar theme is a valuable way to make a design more interesting. The engraver, John Thomas Smith coined the term “Rule of Thirds” in 1797 in his work “Remarks on Rural Scenery”, wherein he acknowledged the power of dividing paintings up using this grid technique to maximize the effect on the beholder’s eye.

Read Full Article

admin
The WebRecital is a dedicated User Interface/User Experience professionals who come together to provide design and research workshops, portfolio reviews, and educational outreach to the greater Seattle area.
http://webrecital.com/

Leave a Reply

Your email address will not be published. Required fields are marked *