Decoding Website Visuals

Decoding Website Visuals

 

Colours

Picking the right visuals for your website is an important task. This is what sets your brand apart from the rest. Your visuals are your identity to the world and you only get one chance to do it. Re-branding is always a possibility if you mess up the first time, but it is definitely not a very good idea as it might end up having adverse effects on the brand image. Although the recent re-branding of the Pepsi logo worked out well for PepsiCo, it is always not the same case with other brands as well. Batteries made by an American company, Eveready Batteries were known by their tag line “Give me Red!”. In rural India, they were identified by their bright red colour which stood out and was usually referred to as red batteries. When the company tried to introduce a different colour of batteries, their sales dropped drastically in these areas as the ‘red batteries’ which were trusted by the people were not there anymore. Even though it was the same company, people refused to purchase a different coloured battery. This affected the sales so hard that they had to change it back to red and they have not changed the colour for their Indian products since. Therefore, it is a wise idea to choose your visual carefully.

Colour Scheme

It is an established fact that the primary point of brand recognition is directly linked to its colour. Picking the right colour scheme is crucial as this is what sets your brand image hence you have to be extremely careful. The right colour scheme can make your website work or art! You cannot use too less or too much of colours on your website. If you use very less colours, your website will be drab and not a visual treat to the people who visit. On the other hand, if you use way too many colours, your website might end up looking like a clown at a children’s party! Moreover, the colour scheme also has to be harmonious with the image of your business or organisation. Hence, this is a critical task.

Here are a number of things you should keep in mind before choosing a colour scheme:

What your website represents

The nature of your organisation should be kept in mind first before you choose the colours. For example, if your business deals with baby products, keeping it bright and colourful is what you should opt for. But if it is to raise awareness of social issues, you should always go for sombre colour.

Target visitors

You also need to keep your target visitors in mind, their age, gender and nature should help you determine the colour scheme better. For example, an educational website for children should be bright and attractive. The younger the target group is the importance of making it more colourful and fun increases.

Complementary or contrast

Both complementary and contrast colour schemes can work wonders for your website, depending on how well you choose them. If you choose the wrong set of colours for your website when going for a complementary look, you might end up making it look drab or the different shades might look all the same. On the other hand, if you go wrong with a contrast scheme, your entire website might look like a terrible mess of colours randomly thrown in. Picking the right complementary theme will ensure that your website announces the web presence of your brand in an extremely classy and beautiful way. The right contrast scheme can give an unprecedentedly cheerful and stunning image.

Company logo and established brand image

When it comes to making a website for an existing company, one does not get a blank canvas to design. It is important to keep in mind the company logo. You cannot use colours that are incongruous with the logo. For example, if the logo is bright fuchsia, it is better to avoid a striking shade of green which does not go well with the fuchsia. You also have to keep the company’s established brand image in mind. Hence, if fuchsia and green are what the company’s colours are, you have to incorporate those colours and work out the other colours you can use, in such a manner that the website looks stunning instead of looking like a disaster.
There are usually three colours that make up your website- the primary colour, the secondary colour or the accents and the background colour. You have to put adequate thought into choosing the right colours for your website.

Primary colour

This is the dominant colour of the brand. This is what the visitors will identify your website by. Hence it is important to pick the most perfect primary colour for your brand. Here is a list of some of the popular colours and what they stand for:

Red

Red represents boldness, passion, urgency, vibrancy, danger, love and lust. It is known to incite strong emotions and has often been used in the food industry to stimulate appetite. It is perfect for websites related to fashion, power, food, love, sex etc.

Blue

It is a symbol of stability and calmness. Blue is a soothing colour which incites a feeling of trust or security and hence it is often used in brands related to finance, health, technology, baby products etc.

Green

This colour represents health, wealth, tranquillity and nature. It is a soothing colour which gives off an aura of purity and assurance. It is perfect for brands related to organics, eco-friendliness, nature, food, baby products etc. It is also the colour of camouflage and hence, is a popular choice of the army and army-related industries, academies etc.

Yellow

Yellow is a vibrant and fun colour representing optimism and youthfulness. This is used to grab attention and it brightens any colour scheme immediately. On the flip side, bright shades of yellow can put a strain on the eyes and hence has to be used carefully. It is perfect for food, shopping, the health industry, websites which are targeted towards children etc.

Orange

Orange represents friendliness, enthusiasm, creativity and fun. It incites people to move and take action. It also promotes impulse expenses and hence is often used in shopping websites, the food industry, tourism and restaurants.

Pink

This is a delicate colour which stands for feminine energy, sweetness, romance and innocence. Although initially pink was considered a strong colour and hence, was perfect for boys, over time, it has evolved to become a stronger colour exuding feminine energy. It is a very good option for brands related to fashion, candy, toys, lifestyle enhancement products, gifts etc.

Purple

Purple is the colour of royalty, wisdom, success and wealth. It is a colour, which when used in the right shade and with the right colours can both excite and soothe people. It is a versatile colour which also gives a customer the vibe of being treated as royalty. Hence, it is often used in airlines, sports teams, massage chains, luxury cruises, hotels, financial establishments etc.

Black

Black represents power, elegance, sophistication and wealth. On the other hand, it is also the colour of rebellion. It is the right colour for luxury brands be it fashion or high-range cars, expensive watches, finances etc. It evokes professionalism, precision and strength.

Grey

Grey is a neutral colour which is simple yet futuristic. It is associated with sophistication, technology and elegance. It is a good choice for brands related to technology, automobiles and even cutting-edge health products.

Every colour has a unique meaning which appeals differently to the psychology of the person and hence making use of the perfect colour is the most important part. Using the right colour, you can psychologically compel your clients or customers to enhance your business. Now that you know what different colours stand for, choose your dominant colour and its right shade wisely.

Once you have zeroed in on the colour, make sure you use it in the right places on your website. Overuse of the dominant colour can be overwhelming while using it sparingly will not be able to establish it as the dominant colour. Hence, you have to find the right balance. As a rule of thumb, it should be used in the logo, on menu tabs, call to action buttons, to highlight important information and so on.

Secondary colours or accents

You simply cannot use one single colour for your entire website. That would make it look boring and no visitor enjoys looking at a drab site. This is why you need a secondary colour for the accents. Before you choose this colour, ask yourself whether it is complementary to or contrasts the colour scheme that you are looking for. A striking contrasting theme is used to draw the attention of the visitors. It is also a very vibrant choice and hence, can be used to grab the attention of toddlers and children. One can make use of this for educational sites for children. It is, therefore, a good choice for websites related to shopping, entertainment, arts, activity centres, schools etc. A complimentary theme uses colours which complement each other, producing a soothing and classy effect. It might not grab eyeballs, but it can be used to produce an overall calming and pleasant effect. It also gives a look of stability and confidence. It is a good choice for websites related to social causes, health spas, banks and other financial organisations. Accent colours are commonly used to highlight secondary information, currently selected tabs etc. If you are unsure of what secondary colour goes best with your primary colour, you can use colour-matching tools like Adobe CC to find the right accent colour.

Background colour

Choosing a background colour is not a very complex, but extremely crucial task as you have to ensure that it goes well with the other colours. It should bring out the other colours and not grab their attention from them. A lot of websites go for plain white as it is neutral but that can make your pages look a bit dull. Using black as a background colour is a bold of a choice but not a terrible one because if your general colour scheme is more on the lighter side, they would look striking on a black background. But the chances of messing up due to poor planning are very high as the background colour goes darker. What kind of business your app represents, also can help you choose the background colour. For example, a bakery could use a peach background while a high-end furniture brand could go for beige. If you are unsure, it is always advisable to go with light backgrounds. Not only are they soothing to the eye, but the chances of messing up are also less. When choosing a font colour for your background, make sure that it stands out. As a thumb rule, choose dark fonts with light backgrounds and vice-versa. If your font is not in contrast, it puts a strain on the eyes, which is not an encouraging thing for a visitor. If you are using a secondary font colour, it is important to ensure that it is clearly visible against the background too.

Your website is your primary online identity and it should be flawless. Therefore, it is of utmost importance that you do a good deal of planning before selecting a colour scheme.

Colours

Picking the right visuals for your website is an important task. This is what sets your brand apart from the rest. Your visuals are your identity to the world and you only get one chance to do it. Re-branding is always a possibility if you mess up the first time, but it is definitely not a very good idea as it might end up having adverse effects on the brand image. Although the recent re-branding of the Pepsi logo worked out well for PepsiCo, it is always not the same case with other brands as well. Batteries made by an American company, Eveready Batteries were known by their tag line “Give me Red!”. In rural India, they were identified by their bright red colour which stood out and was usually referred to as red batteries. When the company tried to introduce a different colour of batteries, their sales dropped drastically in these areas as the ‘red batteries’ which were trusted by the people were not there anymore. Even though it was the same company, people refused to purchase a different coloured battery. This affected the sales so hard that they had to change it back to red and they have not changed the colour for their Indian products since. Therefore, it is a wise idea to choose your visual carefully.

Colour Scheme

It is an established fact that the primary point of brand recognition is directly linked to its colour. Picking the right colour scheme is crucial as this is what sets your brand image hence you have to be extremely careful. The right colour scheme can make your website work or art! You cannot use too less or too much of colours on your website. If you use very less colours, your website will be drab and not a visual treat to the people who visit. On the other hand, if you use way too many colours, your website might end up looking like a clown at a children’s party! Moreover, the colour scheme also has to be harmonious with the image of your business or organisation. Hence, this is a critical task.

Here are a number of things you should keep in mind before choosing a colour scheme:

What your website represents

The nature of your organisation should be kept in mind first before you choose the colours. For example, if your business deals with baby products, keeping it bright and colourful is what you should opt for. But if it is to raise awareness of social issues, you should always go for sombre colour.

Target visitors

You also need to keep your target visitors in mind, their age, gender and nature should help you determine the colour scheme better. For example, an educational website for children should be bright and attractive. The younger the target group is the importance of making it more colourful and fun increases.

Complementary or contrast

Both complementary and contrast colour schemes can work wonders for your website, depending on how well you choose them. If you choose the wrong set of colours for your website when going for a complementary look, you might end up making it look drab or the different shades might look all the same. On the other hand, if you go wrong with a contrast scheme, your entire website might look like a terrible mess of colours randomly thrown in. Picking the right complementary theme will ensure that your website announces the web presence of your brand in an extremely classy and beautiful way. The right contrast scheme can give an unprecedentedly cheerful and stunning image.

Company logo and established brand image

When it comes to making a website for an existing company, one does not get a blank canvas to design. It is important to keep in mind the company logo. You cannot use colours that are incongruous with the logo. For example, if the logo is bright fuchsia, it is better to avoid a striking shade of green which does not go well with the fuchsia. You also have to keep the company’s established brand image in mind. Hence, if fuchsia and green are what the company’s colours are, you have to incorporate those colours and work out the other colours you can use, in such a manner that the website looks stunning instead of looking like a disaster.
There are usually three colours that make up your website- the primary colour, the secondary colour or the accents and the background colour. You have to put adequate thought into choosing the right colours for your website.

Primary colour

This is the dominant colour of the brand. This is what the visitors will identify your website by. Hence it is important to pick the most perfect primary colour for your brand. Here is a list of some of the popular colours and what they stand for:

Red

Red represents boldness, passion, urgency, vibrancy, danger, love and lust. It is known to incite strong emotions and has often been used in the food industry to stimulate appetite. It is perfect for websites related to fashion, power, food, love, sex etc.

Blue

It is a symbol of stability and calmness. Blue is a soothing colour which incites a feeling of trust or security and hence it is often used in brands related to finance, health, technology, baby products etc.

Green

This colour represents health, wealth, tranquillity and nature. It is a soothing colour which gives off an aura of purity and assurance. It is perfect for brands related to organics, eco-friendliness, nature, food, baby products etc. It is also the colour of camouflage and hence, is a popular choice of the army and army-related industries, academies etc.

Yellow

Yellow is a vibrant and fun colour representing optimism and youthfulness. This is used to grab attention and it brightens any colour scheme immediately. On the flip side, bright shades of yellow can put a strain on the eyes and hence has to be used carefully. It is perfect for food, shopping, the health industry, websites which are targeted towards children etc.

Orange

Orange represents friendliness, enthusiasm, creativity and fun. It incites people to move and take action. It also promotes impulse expenses and hence is often used in shopping websites, the food industry, tourism and restaurants.

Pink

This is a delicate colour which stands for feminine energy, sweetness, romance and innocence. Although initially pink was considered a strong colour and hence, was perfect for boys, over time, it has evolved to become a stronger colour exuding feminine energy. It is a very good option for brands related to fashion, candy, toys, lifestyle enhancement products, gifts etc.

Purple

Purple is the colour of royalty, wisdom, success and wealth. It is a colour, which when used in the right shade and with the right colours can both excite and soothe people. It is a versatile colour which also gives a customer the vibe of being treated as royalty. Hence, it is often used in airlines, sports teams, massage chains, luxury cruises, hotels, financial establishments etc.

Black

Black represents power, elegance, sophistication and wealth. On the other hand, it is also the colour of rebellion. It is the right colour for luxury brands be it fashion or high-range cars, expensive watches, finances etc. It evokes professionalism, precision and strength.

Grey

Grey is a neutral colour which is simple yet futuristic. It is associated with sophistication, technology and elegance. It is a good choice for brands related to technology, automobiles and even cutting-edge health products.

Every colour has a unique meaning which appeals differently to the psychology of the person and hence making use of the perfect colour is the most important part. Using the right colour, you can psychologically compel your clients or customers to enhance your business. Now that you know what different colours stand for, choose your dominant colour and its right shade wisely.

Once you have zeroed in on the colour, make sure you use it in the right places on your website. Overuse of the dominant colour can be overwhelming while using it sparingly will not be able to establish it as the dominant colour. Hence, you have to find the right balance. As a rule of thumb, it should be used in the logo, on menu tabs, call to action buttons, to highlight important information and so on.

Secondary colours or accents

You simply cannot use one single colour for your entire website. That would make it look boring and no visitor enjoys looking at a drab site. This is why you need a secondary colour for the accents. Before you choose this colour, ask yourself whether it is complementary to or contrasts the colour scheme that you are looking for. A striking contrasting theme is used to draw the attention of the visitors. It is also a very vibrant choice and hence, can be used to grab the attention of toddlers and children. One can make use of this for educational sites for children. It is, therefore, a good choice for websites related to shopping, entertainment, arts, activity centres, schools etc. A complimentary theme uses colours which complement each other, producing a soothing and classy effect. It might not grab eyeballs, but it can be used to produce an overall calming and pleasant effect. It also gives a look of stability and confidence. It is a good choice for websites related to social causes, health spas, banks and other financial organisations. Accent colours are commonly used to highlight secondary information, currently selected tabs etc. If you are unsure of what secondary colour goes best with your primary colour, you can use colour-matching tools like Adobe CC to find the right accent colour.

Background colour

Choosing a background colour is not a very complex, but extremely crucial task as you have to ensure that it goes well with the other colours. It should bring out the other colours and not grab their attention from them. A lot of websites go for plain white as it is neutral but that can make your pages look a bit dull. Using black as a background colour is a bold of a choice but not a terrible one because if your general colour scheme is more on the lighter side, they would look striking on a black background. But the chances of messing up due to poor planning are very high as the background colour goes darker. What kind of business your app represents, also can help you choose the background colour. For example, a bakery could use a peach background while a high-end furniture brand could go for beige. If you are unsure, it is always advisable to go with light backgrounds. Not only are they soothing to the eye, but the chances of messing up are also less. When choosing a font colour for your background, make sure that it stands out. As a thumb rule, choose dark fonts with light backgrounds and vice-versa. If your font is not in contrast, it puts a strain on the eyes, which is not an encouraging thing for a visitor. If you are using a secondary font colour, it is important to ensure that it is clearly visible against the background too.

Your website is your primary online identity and it should be flawless. Therefore, it is of utmost importance that you do a good deal of planning before selecting a colour scheme.

Next PostPrevious Post
Have a project? Call us at 8001000123 for a Free Consultation and Quotation.