Web designing is much more than making a website or app look good. Every element used in the design process should be extremely carefully thought for and calculated. Fonts, colors and the way every element is placed on the page can influence users tremendously.
Having some knowledge about consumer psychology and what influences people to purchase a product or stay on a website longer will help you design better and engage visitors. To start with, there are three elements that you should take into consideration: color choices, typography and the physical arrangement of the page.
How color choice affects viewers
There is no need to say that colors play a big role in altering the mood of a person. Psychologists have studied this for years, naming it
color psychology. Colors are believed to be capable of influencing one’s perception, making an object become more or less appealing to others. Colors are even thoughtfully chosen for placebo pills, as it is believed they play a big role in how the pills affect patients. Pills in colors such as red, orange or yellow are believed to work better as stimulants, while those that are blue, green or a generally cool color work better as depressants.
When it comes to web designing, you are typically faced with two situations: either the client gives you the freedom to work with the color scheme of your choice, or you need to respect the colors of the brand. The first scenario is the most fortunate one, as you have the liberty to decide how you want to send the message to the viewers. In this case, you need to have some knowledge of color psychology and understand how it affects people:
* Red is considered a bright and vibrant color, it represents warmth, energy, love, but also strength and boldness.
* Orange is also perceived as a vibrant color, but it is often seen as a more optimistic, energetic and playful color, which gives the idea of casualness, youthfulness and creativity.
* Yellow represents happiness, warmth, friendliness, but can also be used to signal warning.
* Green is the color of life, health and naturalness and, if used in more darker shades, can also show wealth and prosperity, as well as sustainability.
* Blue communicates peacefulness, clarity and calm, but can also represent professionalism and trustworthiness.
* Purple is the color of luxury and royalty, but can also be perceived as mystical and feminine.
* Black usually represents exclusivity, especially when mixed with metallic colors, but can also represent formality and modernism.
* White is minimalistic, it can represent innocence, purity and simplicity and van be used to emphasize the modern and clean feeling of a product.
Calligraphy means more than you think
Choosing the right colors is extremely important, but so is choosing the right font. Think of it as if you were speaking to someone. Even if you use all the right words, if the way you are communicating those words is unpleasant the whole message will be heard wrong. If you tell someone they are doing a great job, but you are using the wrong tone, you may come out as sarcastic or uninterested.
The font pool is huge, so it might be easy to get lost when trying to decide on one, but if this happens, you need to take a step back and decide if the font used reflects the message you are trying to send.
All fonts typically fall into one of the six main categories:
- Serif: traditional fonts, often perceived as professional and newsy
- Sans Serif: simpler, yet truthful and genuine
- Script: fancy fonts, used to send more personal and close messages
- Display: unconventional and eccentric, often unusual and playful
- Modern: just as the name calls them, hip, trendy and progressive
- Decorative: fun and playful, one-of-a-kind fonts
Apart from font choice, you need to keep in mind the other three important aspects when it comes to texts: font size, spacing and contrast. All of these elements play an important role in the overall message sent to customers.
If, for example,
the spacing between design elements and text blocks is not big enough, everything will come out looking too crowded and the visitor will get lost trying to find the information needed. When deciding on the size of the text, always make sure that it is easily readable by visitors, but not extremely large, as it can become annoying. If you want to highlight a certain message, make that line of text slightly larger or bolder, to get their attention, but make sure it fits with the overall aspect of the page.
To make it easier for you, try to organize the text hierarchically. Use larger size for titles or headings, medium size for subheadings or information that is slightly less important and a much smaller size for the rest of the page, where the body of the text should be.
The layout brings everything together
Colors and fonts are separate elements of the design process and they both need to be thought of carefully, but so is the way you manage to bring those elements together. This process is called layouting. Layouting is the art of cohesively bringing together every element on a page. From color to font, to the log, the search bar, and even
the social media buttons, everything matters in the great scheme.
Again, you should keep in mind the visual hierarchy of the elements. To make it easier, focus on 5 important aspects: size, color, position, format and relation to other elements. Elements that you want the visitor to focus on should be larger, closer to the top of the page, in contrast with the other elements and, if possible, surrounded by more whitespace. Elements with a lower visual prominence can be smaller, positioned near the bottom of the page and can even be more crowded.
If you are wondering where on the page you should place certain elements, keep in mind that people usually scan pages
in the form of the letter Z. They typically start reading from the top left, where their primary optical area is, and end with the bottom right. This is how you will make sure no important detail is left out of the visitor’s sight.
When it comes to web design, every little detail matters. You need to engage the visitor both through the message that you send, but also through the way you send it. Color choice helps set the visitor into a certain mood, while the fonts you use is a tool to deliver the message. At the same time, the way you lay everything out on the page helps to guide them towards their journey.
