Looking to engage customers with beautiful visuals? Read on to learn about the golden ratio and how it can up the ante on your images. Then head over to Shutterstock Editor and use the grid and crop tools to achieve gorgeous designs that live up to this powerful design principle.
The word “golden” denotes value, perfection, and success. We’ve seen it applied to everything from a rare and precious egg, to an age of iconic cinema, to a winning lottery ticket. For marketers, though, there’s one such reference that matters…
The Golden Ratio.
The concept of the Golden Ratio is thousands of years old. It forms the foundation for many classic works of art and architecture, from the Great Pyramid of Giza in Egypt to artist Georges Seurat’s Parade de cirque, and you’ll often find it cited in encyclopedias and academic papers. Its historic significance doesn’t mean it’s dated, though; in fact, the Golden Ratio can be incredibly valuable to businesses. Capitalizing on it when designing marketing materials, logos, and your website can result in more engaging visual assets for your brand.
You just have to know how to use it.
Defining The Golden Ratio
To understand the Golden Ratio, you should know how — and where — it began. That search takes us to ancient Greece. Also referred to as the Greek letter phi, the Golden Ratio relates to the number 1.61803398875.
In mathematical terms it’s known as an irrational number, meaning it has an endless series of digits that don’t repeat and can’t be expressed as a simple fraction (much like the famous pi). According to Encyclopedia Brittanica, the mathematical concept of the Golden Ratio originated around 500 B.C. Some credit Greek scholars Euclid and Pythagoras with honing it.
To really grasp the concept, though, you have to look at the Golden Ratio like this:
(A+B)/A = A/B.
Divide a line in two parts. The longer part (A) divided by the shorter part (B) is equal to the whole length of the line divided by the longer part. To create the Golden Ratio, the subdivisions of your original line must equal 1.618.
We know – it’s hard to put into words, so here’s a handy visualization to help you out.
When the idea of the Golden Ratio first emerged, the Greeks realized it could be used to create a very visually attractive rectangle, which we now call the Golden Rectangle. They began to consider this shape and its proportions in the context of design. As it turns out, when you apply a ratio of 1 to 1.61 to an image, layout, or composition it will look both natural and balanced.
No wonder humans have been using the Golden Ratio ever since. It is the bedrock of many of the ancient structures and paintings we consider to be beautiful. Some say the Golden Ratio is represented in artist Salvador Dali’s The Sacrament of the Last Supper, Michelangelo’s The Creation of Adam, and even Stonehenge. Today, you’ll find it on web pages, in photographs, and in the logos of some of the world’s most popular brands.
The Golden Ratio in Nature
How is this relevant to you and your business? To answer that question, we have to explore the Golden Ratio in another form.
The Golden Spiral is closely related to the Golden Ratio. It’s created by drawing a continuous arc that moves through each part of the Golden Rectangle, creating a fluid spiral. The Greeks may have come up with the mathematical explanation for why the Golden Spiral exists, but it was around long before they were. You’ll find evidence of it all over nature, in the shape of seashells, flower petals, pine cones, seed heads, and spiral galaxies. Some animals’ bodies display it as well, including dolphins, starfish, and honeybees.
The Golden Spiral is also related to the Fibonacci Sequence, which will ring a bell for fans of Dan Brown’s The Da Vinci Code. In that mathematical concept, each number in a sequence is created by adding the two preceding numbers together (for example, 1, 1, 2, 3, 5, 8).
As it happens, Italian mathematician Fibonacci’s theory also appears in nature. When you turn that sequence into a pattern, you get a curving spiral. Count those spirals, and you’ll usually end up with a Fibonacci number. As explained by Live Science, “A Fibonacci spiral is a series of connected quarter-circles drawn inside an array of squares with Fibonacci numbers for dimensions. The squares fit perfectly together because of the nature of the sequence, where the next number is equal to the sum of the two before it.”
Which brings us back to the Golden Spiral. Live Science goes on to say that “Any two successive Fibonacci numbers have a ratio very close to the Golden Ratio, which is roughly 1.618034. The larger the pair of Fibonacci numbers, the closer the approximation.” No more wondering what it is about an object or shape that makes it so striking. Odds are it has math to thank for its enduring beauty.
Where Math and Beauty Meet
Given the link between math and nature, it should come as no surprise that the human body has evidence of the Golden Ratio, too. From the proportions of your arm (finger length in relation to the forearm and the upper arm) to the shape of the Mona Lisa’s face, they’re all true to what Luca Pacioli called the Divine Proportion in 1509, and what Leonardo da Vinci referred to as the Golden Section. Da Vinci used the Golden Ratio in his Vitruvian Man. Artists like Rembrandt have used it as well.
Many a scholar and statistician have taken pains to gauge the extent to which the Golden Ratio is responsible for how we perceive facial beauty. According to these theories, if you calculate the width and length of a human face and divide the length by the width, and you get a number that’s close to the Golden Ratio, that face is therefore beautiful. The positioning of the eyes, nose, and mouth, and the distance between them, also factor into our attraction.
When you’re able to visualize how all of these formulas come together to create distinct shapes and patterns, it becomes much easier to see their value in everyday life. Just as the Golden Ratio can be used to create visually enticing works of architecture and art, it’s vital to contemporary design.
The Golden Ratio in Design
Web pages, ads, magazine covers, and illustrations all benefit from a layout that borrows from this ancient mathematical principle. The Golden Ratio can be used to guide the placement of objects, the shape of a logo, and more.
Layout and Content, on the Web and Beyond
Let’s start by looking at the role it plays in layout and content. In web design, the Golden Ratio can be applied to where and how columns of text are placed. A page that features a wide block of content on the left with a narrower column on the right, for instance, attracts the viewer’s eye and highlights what’s most important. If you’re dealing with a pixel width of 960 on your site, your left-hand column should be 593 pixels while the right-hand column is 367 pixels wide. Together, they create the desired proportion.
Depending on your layout, the size of your columns may not add up as perfectly as you’d like them to (although using a Golden Ratio calculator can help). That’s perfectly okay. Getting as close to that 1:1.61 ratio, in which the main content block is 1.6 times larger than the sidebar, should be your ultimate goal.
There’s an added benefit to this user interface (UI) strategy: It assists the reader in navigating video, photographic, and textual content. You’ll find examples of this type of layout all over the web, for the simple reason that it’s effective. Take a glance at the home page of a site like Fast Company or BuzzFeed and you’ll spot that telltale two-column layout.
The same can be said of Salon.com. By placing compelling photographs and trending videos within two columns that comprise the Golden Ratio, Salon strikes a visual balance that pulls the site visitor from one current piece of content to the next. The layout is at once aesthetically pleasing and functional, helping the visitor determine how best to navigate the page while also promoting Salon’s most interesting content.
How the Golden Ratio — and its Circles — Influence Spacing and Form
The Golden Ratio can also help you make decisions about spacing: where to place a design element in relation to another, the optimal amount of white space, and so on.
Go back to that Golden Rectangle and consider how it can help you decide where to place a smaller, less critical content block on your site page, or even how to incorporate negative space into your new logo. You’re likely to find it gives your work focus and reduces the time it takes to come up with an image that both you and your customers will love.
If, however, you’re still struggling to see how math can improve your branded visual assets, it might be useful to adopt a slightly different perspective. Take that Golden Rectangle, and draw a perfect circle inside each of its individual parts. In terms of size and proportion, these forms — called Golden Circles — are in keeping with the Golden Ratio, and can now be repositioned as you see fit.
Whether they intersect or overlap, Golden Circles can be applied to designs of all kinds, whether you’re polishing an existing logo or starting from scratch. Overlapping them on your work in progress allows you to make adjustments that ensure your end result is consistent with that coveted Golden Ratio.
If the rumors are true, the Golden Ratio and its related Golden Circles were involved in the design of Twitter’s logo. When you see those circles applied to the iconic blue bird, it makes sense. The logo does appear to adhere very closely to the Golden Ratio formula, which might explain why the outcome is so memorable.
Twitter’s bird is far from the only logo that employs Golden Circles. It’s been said that Pepsi’s logo, along with Google’s, stick to the Golden Ratio as well. It isn’t uncommon for graphic designers to lean on this technique to craft perfectly proportioned shapes and patterns that appear sharp and clean to the viewer.
Sometimes, the simple act of rearranging your Golden Circles until they resemble an object that’s more familiar can inspire your next logo design. As with everything, practice makes perfect, and experimenting with what Golden Circles can do is key to coming up with a viable design.
With that in mind, creative professional Kazi Mohammed Erfan challenged himself to create 25 logos that all adhere to the Golden Ratio last year. By converting each portion of the formula into a collection of Golden Circles and using those shapes as his guide, he was able to design a dynamic group of logos that embrace negative space, demonstrate balance, and most importantly embody the essence of the businesses they represent.
The Golden Ratio in Photography
Web and logo design aside, the Golden Ratio also has a place in photography. When you’re tasked with creating or selecting an interesting image, proportions and scale are incredibly important and among the main building blocks of strong photographic composition. Arranging your subject in such a way that it complies with the layout of the Golden Spiral — with the focal point of the image within the spiral’s curve — can help you create a more appealing composition that’s in keeping with the Golden Ratio’s principles.
To simplify this process, many photographers use a “phi grid.” By dividing a Golden Rectangle and its overlaying Golden Spiral into nine parts, you’re left with a grid that will assist you with composition. Look at where the lines of the grid intersect. Those are the areas that the human eye will be naturally attracted to, so that’s where you should position the various elements of your photograph in order to achieve visual harmony.
Grid Wars: Assessing the Alternative Rule of Thirds
There is another approach to photographic composition, though, and that’s the Rule of Thirds. This principle also involves a grid with nine parts. With the Rule of Thirds, though, the shapes on the grid are all of equal size.
Here, too, you’re encouraged to place your points of interest at the intersections of the lines, or along the lines themselves. The result is intended to produce a balanced photograph. Imagine placing a piece of graph paper over your viewfinder. How do the objects in your line of sight align with the rectangles squares on the page? Those intersections serve as guidelines for where you should place the primary and secondary points of interest in your photograph.
Many digital cameras offer the ability to overlay a Rule of Thirds grid pattern onto the screen expressly to make it easier for users to compose a great photo, but over time composing an image this way becomes second nature. Keep in mind, though, that there are some exceptions to the rule. With straight headshots it’s often best to forget about those grid lines and center the face on the screen.
You would think that two such similar practices — the Golden Ratio and the Rule of Thirds — would work together in harmony. When it comes to composing images, though, there’s some uncertainty about which strategy is best. Both serve as useful blueprints that can improve your ability to compose an alluring photograph or design. But they aren’t created equal.
As noted by Discovery Communications’ DNews, the phi grid is particularly effective when you’re photographing landscapes because it “produces a more balanced image” and “makes photos appear more natural and less rigid.” With the Rule of Thirds, you could feasibly end up with a photo that looks too composed, and that can come off as forced.
The next time you’re browsing through landscape photographs in search of the ideal image for your email campaign, mailer, or social media post, keep the Golden Ratio in mind. Picture the phi grid overlaid on every image, and consider how and where the focal points of the photograph fall. Once you know what to look for, you’ll see the Golden Ratio everywhere, and gain valuable perspective on why a photo has the power to strike you — and your customers — the way it does.
Getting Started With the Golden Ratio
If you already have images that you hope to use for marketing and advertising purpose but that don’t follow the Golden Ratio or the Rule of Thirds, take heart. Just by editing your images, you can shift the viewer’s focus and reap the benefits of a more masterful composition.
A tighter crop can highlight the most important part of a photograph. In Shutterstock Editor you can quickly crop a photo to any dimension, or select from preset social media dimensions for easy sharing across channels. Use the grid tool to chart the Golden Ratio’s guiding lines, and see how your image works within it.
On the surface, the Golden Rectangle, Golden Spiral, Fibonacci Sequence, phi grid, and everything that goes along with them can seem complex. The idea that a series of numbers can produce something natural and beautiful isn’t exactly intuitive.
But as evidenced by the way designers, graphic artists, and photographers are harnessing it, the Golden Ratio has evolved from an obscure mathematical theory to a dependable technique that holds a place of honor in the modern world. It’s a powerful rule to keep in your back pocket and apply to image curation, web designs, and even blog layouts. With a fundamental understanding you’re better equipped to choose images and develop designs that customers are drawn to, increasing engagement and improving the visual authority of your brand.