Using the Golden Ratio in Liquid Web Page Designs
(Page 1 of 4 )
At first glance, some basic principles of graphic design like the “Golden Proportion” and the “Rule of Thirds” seem to have nothing to do with web design. But the truth is that they can be perfectly applied when creating web page layouts to make them look more pleasant and harmonious to the human eye. If you wish to learn how to implement these two fundamental principles when building your own web sites, then keep reading. In this series of articles you’ll find an approachable guide to putting these concepts into practice with both fixed and elastic web page designs.
And now that you’re aware of the topics to be covered by this group of tutorials, it’s time to summarize the contents of the previous article (the first one in this seven-part series). In that part of this series, I offered a brief introduction to the golden ratio, explaining what it is, and how it can be utilized for building truly appealing web page layouts.
Quite possibly, one of the most attractive aspects to applying the golden ratio in web design is that it only requires a basic notion of its meaning and historical origins, and practically nothing else. From that point on, even inexperienced designers can take advantage of its benefits by using a calculator or software that calculates this proportion for them. It’s that easy.
Now, returning to the topics treated in the previous tutorial, in that case I demonstrated how to apply the golden ratio to building a fixed web page layout composed of the classical header and footer sections, a side bar and finally a content area.
However, as the title of this article suggests, it’s possible to implement the golden ratio with liquid designs as well. In the next few lines I’m going to develop another practical example that will illustrate this process in a step-by-step fashion.
Does this sound good to you? Then jump forward and start learning how to use the divine proportion for creating elastic web page layouts!
Next: Review: using the golden ratio for a two-column web page layout >>
More Style Sheets Articles
More By Alejandro Gervasio