ever you get there, the golden ratio creates a design that feels natural, organic, and is far more pleasing to the human eye than any other proportion.
When designing, many people place the spiral on top of their original shape and use it to plan where to place the elements in the design.
The spiral essentially divides the page into rectangles that get smaller and smaller. This shows you what size element should be placed where and where to place the most important elements that you want people to see.
The ratio of 1: 1.61 comes from these rectangles. You start with a rectangular shape (your blank side) and create a square by adding a new side that rotates the longer sides to be the same length as the shorter sides.
The square should be 1.61 times the size of the remaining rectangle. You can then apply this technique to any room and create smaller and smaller blocks to help you shape your design.
Whether you use the spiral or the rectangle method, you get the same general concept. You can also see the best way to place the elements in your design.
How to use the golden ratio in your web design
While using the golden ratio in logos is a great way to create the most visually appealing and memorable brand identity, using it in your website improves the user experience dramatically.
To do this, you need to follow these four simple steps:
1. Break up the page layout
You will often see websites with a navigation bar and header image across the top that occupy a specific part of the screen. Many websites are divided into two columns, one of which is twice as wide as the other. It’s not just convenient because it helps you navigate the site. It also creates the first element of the golden ratio.
When designing your website, start by creating this overall shape from two-thirds to one-third on the page layout. This instantly creates a shape and layout that is pleasing to the eye.
2. Balance your images and fonts on the page
Next, you need to think about what to put where on the page. You need a combination of space and details, and these have to be balanced according to the golden ratio. As the spiral moves across the layout, you’ll see where to add more information and where to add less.
Remember that you can have more than one spiral in your design. Each one fits into an increasingly smaller space and gives you more guidance on where to place your design elements.
3. Pay attention to your image sections
Now that you know where to put things, it’s time to add your pictures. Back to the comment that your design has more than one spiral – each image has its own spiral.
When considering how to place the images in your overall design, think about where they fall in each of the relevant spirals. You need to consider how you will crop the picture so that the spiral only makes sense for that picture.
If you consider the golden ratio in both phases, you will get a far more interesting and engaging design for your website.
4. Use the correct font sizes
The golden ratio should influence every element in your web design. You can even apply it to the fonts and typography on your website.
When adding headings, subheadings, and body text, consider the sizes of the various elements. By keeping them in proportion to one another according to the golden ratio, you ensure that the text looks balanced and fits into your overall design.
Pick one that you like – choosing the best size for body text is usually the best place to start as it will ensure that the main text on your website is easy to read. Then use the golden ratio to determine the best sizes for the headings. You do this by multiplying the selected font by 1.1618 and then rounding up or down to the nearest appropriate font size.
The general placement of the text should fit into the spirals of your overall design. Larger blocks of text should sit in the wider sections of the spiral. Smaller sections of text or headings that you want to draw attention to can sit in the narrower parts of the spiral.
Go for gold
Once you understand the theory behind it, using the golden ratio becomes easy and straightforward. Whether you are using customizable web templates or web design software, you can use these tips to create a visually appealing design. The golden ratio is the secret to great-looking designs that have an immediate impact. If big brands like Apple and Twitter do, so can you!
What do you think of the golden ratio? Please share your thoughts on one of the social media sites listed below. You can also comment on our MeWe page by joining the MeWe social network.
Last updated on June 15, 2021.