Swapping Columns Using the Divine Ratio for Web Page Layout
(Page 1 of 4 )
If you’re a web designer who wants to learn how to create appealing and harmonious web page layouts by applying fundamental graphic design concepts like the “Golden Proportion” and “The Rule of Thirds,” keep reading. This is the third part in a series of articles that provides you with the right pointers to start implementing these principles for building aesthetically pleasant web sites.
And now that I mentioned the Golden Proportion, you may recall that that in the last article of this series I demonstrated how to use this ratio to build a liquid web page layout. It was comprised of the typical header and footer sections, as well as two primary columns.
Despite the simplicity of this particular example, the most important thing to notice here was the approach used for calculating the widths for each of the web page columns. These values were obtained by using the Golden Ratio. This proves that it is perfectly possible to apply this proportion when creating fixed designs or when working with liquid ones, even though this last case might be a bit trickier to implement in real world conditions.
In addition, it's fair to stress that the layout developed in the previous article included a side bar positioned to the left of the web page and a content area, naturally located to the right side of the page. However, it's quite easy to swap the positions of the columns via CSS, while maintaining the same dimensions. Therefore, in this third installment of the series I'm going to explain how to do this very simply, which will hopefully give you a clearer idea of how to play a bit with your own web page designs based on the Divine Proportion.
Now, it's time to get rid of the preliminaries and see how to build yet another appealing web page layout using the already familiar Golden Ratio. Let's get going!
Next: Review: a liquid web page layout using the Golden Proportion >>
More Style Sheets Articles
More By Alejandro Gervasio