Design is the visual component of a website: colors, fonts, interface, block layout, and much more. Ultimately, conversion and sales depend on how the page is designed. In this new article from our ABCs, we will discuss how to properly design an online store website and avoid common mistakes.
Colors
Bright, acid colors have long been out of fashion, as has the use of a large number of shades. When designing a website, you should use calm, warm colors, except for the design of selling elements. The number of dominant colors on the page should not exceed three.
Colors are part of the identity and corporate style: remember the cranberry shades of Wildberries, the green of Sberbank, or the black and yellow of Yandex. The corporate colors and color combinations of an online store should be determined at the stage of developing the brand’s corporate style: this will increase its recognition.
You can deviate slightly from neutral colors when designing a landing page — a sales page for collecting applications. Here, brighter, attention-grabbing solutions are welcome. And the holy of holies — the sales-boosting color red when designing CTA buttons: “Buy,” “Subscribe,” “Leave a request.”
Fonts
Simplicity and conciseness reign supreme here too. Although sometimes it makes sense to experiment. For an online store selling esoteric goods, you can use runic fonts, for an ethnic store — adaptations of ancient fonts, and so on.
The font size should be as large as possible. No one will want to strain their eyes looking at the screen, especially on the mobile version of the site.
It is best to order fonts and colors from a design agency when developing a corporate style.
Block layout
A standard online store page consists of several blocks: the header, menu, main block, footer, and so on. The blocks are arranged according to the golden ratio and the rule of thirds.
The ratio of block sizes should be within the golden ratio (a ratio of 1.62). Key elements should be located at points found using the rule of thirds.
Interface
Interface design is one area where it is not worth experimenting. The reason is simple: the interface of almost ALL online stores is now the same. This helps users instantly navigate any website, even if they are visiting it for the first time. In technical terms, this is called UX design: an intuitive interface based on user experience that requires no additional explanation.
In short: the search bar should be in the main block in the center (don’t forget the rule of thirds), the menu should be in the header, product filters should be on the left, special offers and promotional products should be in the main block below the search bar, and so on. Remove the shopping cart from the upper left corner, and you can say goodbye to conversions. This is because users are accustomed to a certain layout of elements and are more likely to leave the site than search for the desired menu button.
Background
Maximum contrast, well-lit text. The ideal is black text on a white background. If the letters blend in with the background, that’s not good.
All kinds of colorful backgrounds are a thing of the past: they’ve long been out of fashion. Conciseness and style rule.
Density
Plenty of free space, or “air,” has been one of the stable trends of the last few years. Don’t overload the page with text, numerous menu items, pop-ups, and so on.
There should be three to five elements with a clear purpose in the visitor’s field of vision: buy, view, subscribe, order. If there is more content, the visitor’s attention is scattered, which has a negative effect on conversion.
