by anthony on 09/29/10 at 7:54 pm
If your website sells products, it’s important that your product images appeal to users. Beauty of an image doesn’t just come from typography and color. It also comes from the way you arrange elements in space.
It’s much like decorating your house, where you don’t just think about what objects you need to make your house look beautiful, but you also think about how to arrange and where to place those objects.
The rule of thirds is an old technique that was first used on paintings during the Renaissance times. But you can apply it to product images on your website. A typical product image has the following elements:
- Product picture
- Product name
- Tagline or headline
- Call-to-action button
- Background graphic
The Wrong Way
A bad product image would not align with the rule of thirds. It would make users work to look at each element, and force them to move their eyes around the page. In HP’s product image, the only element that touches a grid intersection is the picture of the product. All the other elements are scattered to the edges, making the image less cohesive and appealing.
The Right Way
Applying the rule of thirds to your product images would arrange these elements in a way that gives users the best view of your product. Notice that Blackberry’s product image has a spatial balance between the elements.
No element gets ignored or overlooked because the elements all touch the intersecting lines of the grid. The elements are all arranged in a way that makes it easy to capture the beauty of the product in a single focal view.
Applying the Rule of Thirds
To apply the rule of thirds, divide your composition into thirds horizontally and vertically. This will create 9 rectangles and 4 intersections. Place 4 dots where the lines intersect.
Then place your most important elements on the grid intersections or where the dots are. If you have remaining elements, place them on one of the lines near an intersection. The closer to the dots the better.
The rule of thirds is an effective technique that can make your images more aesthetically pleasing. Not only that, but it makes users move their eyes less when they view your image. An image that uses the rule of thirds isn’t only compelling, but it can also help you sell more products.