The A/B Advantage

8 Important Things To Consider Before Choosing The Right Color For Your Website

In today’s world, it’s very important to have a unique brand identity and for it to be visually recognizable. Not only will it help you build trust with your customers, but it will also help you spread brand awareness more easily. And there’s no better way to make yourself stand out from the crowd then through a smart choice of colors for your website.

Colors are extremely important when it comes to making your website likable for your customers and the choice of your color scheme should always be near the top of your priorities when it comes to web design. Here’s our list of eight things you need to know about when choosing the color scheme for your website.

Colors Affect Emotions

When users enter your website, they start judging it based on their subconscious and how the environment affects it. This basically means that upon entering the website, your users will be judging it mostly based on the color scheme you’re using. This is why it’s important to get familiar with the psychological effects different colors have. A good place to start is to get to know the right colors for your CTA buttons and how they affect the conversion rates.

Pick a Dominant Color

The color you pick as your dominant color is also your brand’s color and it should always be embedded into the website. A dominant color doesn’t mean it’s the color that’s represented the most, but the one that will hold its hue regardless of its surroundings. Coca Cola’s dominant color is red, but McDonald’s is actually yellow. This is the color you’ll be using on all your promotional material and how your target audience will remember you when they think about your brand. Picking a dominant color is a strategical choice and the one you’ll have to make with a lot of consideration.

Gender Differences

For this step, you’ll need to figure out whether your business is targeting women or men, or maybe even both. This is because different colors appeal to men and women, with some of the colors being in common.

Women like: Blue, Green, Purple

Women dislike: Orange, Gray, Brown

Men like: Blue, Black, Green

Men dislike: Orange, Purple, Brown

You can see that both genders are likely to be positively affected by blue and green color, while they both dislike orange and brown. This means that you’ll have a better chance hitting and affecting your targeted audience if you avoid orange and brown, while using green or blue. If you are favoring one gender over another as your target audience than it’s even easier to set up the color scheme according to this.

Accent Colors

Now that you have your dominant color picked out, it’s time to pick accent colors. These are used mostly to attract attention to certain parts of the website, while also giving the website more freshness compared to it being in single color. However, matching and mixing colors might prove a difficult task for most people, which is why almost any freelance web designer will get the hang of it through trial and error. With dominant and accent colors now on board, you are already half-way towards positively affecting your website visitors.

Choosing a Background Color

A background color is what creates the atmosphere on your website. It’s always chosen carefully based on the industry you’re in. An e-store will almost always use a neutral color so that they can draw attention to what really matters to them – products. On the other hand, design or fashion websites will usually be more graphic intensive because their agenda is to promote their creativity. Choose a background color that matches your industry and niche and make sure that it goes well with your dominant and accent colors.

Different Age Groups Prefer Different Colors

You probably didn’t know, but people change their color preferences over time and with age. Take a look at Joe Hallock’s Colour Assignment Study from 2003 which explains in detail how different age groups look on different colors. What you need to do is take it into consideration after you’ve figured out the age range of your target audience. Leave nothing to chance when it comes to picking colors for your website and you’ll be well on your way towards success.

Number of Colors Used

Most websites use three colors for maximum effect, but you can go for more than that if you feel the need. To break it down, it usually looks like this:

Dominant (or primary) color – around 60%

Secondary color – around 30%

Accent color – around 10%

Whatever your primary and secondary colors are, you’ll want your accent colors to be in contrast so they can do their job and highlight what’s important on the website.

Online Tools to Help You With Your Color Choice

If you’re still unsure about how to approach the issue (and even if you’re not), you can use a number of online tools to help you choose the best colors for your website. Adobe Color is a great tool which can help you choose your whole color scheme based on the dominant color that you picked. It takes a little time to get the hang of how the tool works, but once you do it will become absolutely invaluable. If you don’t like it, you can go with a tool like Colorspire instead.

Final Words

There’s no denying the fact that good usage of colors has helped build a number of brands throughout the decades and it can do the same for you. The choice of colors comes through careful consideration and strategy, and not by accident. By reading this guide you now have a good head start, but the most important thing is to experiment yourself and to do a lot of testing as well. Only that way you will come up with a uniquely colored website that is going to attract people’s attentions.

10 CTA design mistakes you’ve been making & their solutions

CTA designing is one of the trickiest part of web design and yet, in every way important. More than of 90% online visitors who read your headline also read your CTA copy.

Over the years, CTAs have evolved and today they come in all forms and patterns. It could easily be a subscription to your blog or newsletter, it could be an offer you give out on your products or services, and it could even be an offer for a free trial and so on.

CTAs are one of the many factors that affect conversions. And these are the commonest of the mistakes that are made while designing a CTA. Read on to find out what they are and how you can correct them.

C:\Users\Pooja Menon\Webby Monks\Blog Images\CTA design mistakes and solutions\CTA-design-mistakes-and-solutions-ned-stark.jpg

Irrelevant CTA

How many of you have come across a CTA that falls short of a head and a tail? Relevancy matters because of the following reasons:

Let’s say you own a website that sells email marketing services and web development services. When users visit the service pages of web development services, it’s because they want to know more about the kind of web development services you provide. Now if you put up a CTA related to email marketing on the service page of web development services, you aren’t making the most out of a CTA.

Users won’t be able to find a connection between the CTA and the rest of the page, and that, is the biggest mistake in the rulebook of web design.

Wrongly Timed CTA

A wrongly timed CTA usually happens with the following kinds of CTAs:

  1. Inline CTA
  2. Slide In CTA
  3. Scroll Intent CTA
  4. Time Intent CTA
  5. Exit Intent CTA

An Inline CTA will be considered as a wrongly placed CTA when it is not placed in a way that the content written right above the CTA connects with it. Long story short, anything and everything about the offer in the CTA must be explained or talked about in the content written above the CTA.

The Slide In CTA must be placed in a way that it slides into the page after relevant information about the CTA has been given.

The Scroll Intent CTA shows up only after the user has done a specific amount of scrolling. In this case, again, information related to the offer in the CTA must be talked about within the amount of scrolling the user does before the scrolling point where the CTA is shown to him.

The Time Intent CTA, just like the name suggests, comes up only after a certain amount of time has spent by the user on the website. The time intent CTA must be timed in a way that the content relevant to the CTA has been disclosed prior the placement of the CTA.

The Exit Intent CTA, the easiest and yet somehow, the edgiest one. This CTA holds no scope for follies. The exit intent CTA must offer unconventional offers that provide the users with an incentive to stay. Read on to find how you should incentives to stay.

Long CTA

As businessmen, we are all greedy – greedy for customer data. And when it comes to customer data, we all want to know a customer inside out by asking for all the information in the world for creating personalized CTAs and personalized emails.

Do you know what the users feel when they are asked for their contact number (unnecessary information) just to download a guide on better CTA design? They feel that you are being creepy, that there is something fishy about your business, that they shouldn’t be making the mistake of trusting you and everything.

Asking for more information is not wrong. But like everything, there is a time and place for that as well. If you are giving out a free trial of a product/service, you have the right to ask for more information like the customer’s contact number, the name of the company they work with etc.

Poorly Written CTA

We have all been a victim to reading those long CTA copies that strained our eyes merely by thinking about reading those five long sentences that described the download free buyer persona templates.

Keep the main heading of the CTA short, crisp and to the point. You wouldn’t need more than 7 – 10 words to describe the content of the eBook in one line.

Too much content on a CTA is a turn off for people because they wouldn’t want to waste too much time behind swimming in a sea of words.

Unsubscribe CTA

We all want our users to stay subscribed and we try almost every possible way to make that happen. We don’t want our subscribers to get reduced and hence, we don’t even provide the unsubscribe button sometimes. But here’s the thing – the first thought that they go through before hitting a subscribe button is the fear of email bombardment.

This fear makes users not want to choose subscribing to your newsletters. So here’s what you can and should do to decrease the unsubscribe rate. If you are creating a CTA that is a subscription form, you must add a line like this ‘You can unsubscribe any time you want’.

It’s not like users don’t know that they can unsubscribe, it’s more like you’re reassuring what they already know and that works like magic.

Entrapping CTA

Have you ever felt trapped in a website?

Many of us have and all of this is because a CTA doesn’t provide the option to quit the CTA and continue browsing the website. The one and only option you would be provided with is to quit the website.

Many of us here are under the misconception that not providing the alternate option might make the users choose what’s available. But that’s not how it works. You cannot merely force someone to make a choice he doesn’t want to. On the contrary, this is what you should be doing – Giving them an option to accept the offer and a dumb option.

Yes, I want the conversions to increase.

No, I don’t want to grow.

Other than this, it is very much important to provide a cross sign at the top of the CTA. It lets the users quit the CTA and continue browsing the website.

Forever CTA

The Forever CTA is the one that implies that whatever that is being offered through the CTA will last forever. But how the users see it as something they can come back to if they don’t find anything else anywhere. What amiss in such cases is the element of scarcity.

The element of scarcity is where you show the users that what you are offering is going to get over pretty soon and they won’t be able to get it if they don’t grab it then and there.

You might have come across various Amazon sales that last for about 3-4 days and that is shown in the CTA because they want the users to know that they would be missing out on everything being sold at a discounted rate if they wouldn’t take immediate action.

No Urgency CTA

Urgency plays a big role in conversions through CTA. How many webinar CTAs have you come across as “59 seats remaining” or “Webinar starts in 15 minutes”? These are two most common cases of urgency.

The human mind works that way – they won’t grab anything until and unless they are shown the quick exhaustion rate. That works the magic of a catalyst when it comes to conversions through CTA.

When you show the urgency factor through words in the CTA, you are indirectly giving the user an incentive to take up the offer then and there.

Wrong Colored CTA

We have all seen an example of a wrong colored CTA and wrong colors affect conversion in a more powerful way than you can imagine. Different colors have different psychological effects on a human mind. And before we move forward, we need to break the myth of ‘right color CTAs’. There is nothing of that sort.

What matters here is that the color you choose for your CTA must contrast with the color of the website or at least look good with it. For e.g., a red CTA won’t work on a red website. It might easily go unnoticed. However, a red CTA button will work wonders on a green website.

C:\Users\Pooja Menon\Webby Monks\Blog Images\CTA design mistakes and solutions\CTA-design-mistakes-and-solutions.jpg

(Source: Webdesigner Depot)

Invisible CTA

An invisible CTA is a CTA that is bland and mellow to the point that the users just look past it and keep wondering if you are even interested in growing your business.

The entire CTA design depends initially on visibility first and then its noticeability. There just has to be a separate outline around it to make sure it is visible. But it needs to stand out to be noticed. And to make it stand out, the design of the CTA must go one sensible level above the rest of the web design. And for that to happen, the CTA must have the following attributes:

  1. Font size one size larger than the size of the font size of the content and two sizes smaller than the subheading on the page.
  2. If you are looking for a different font format altogether, make sure that it aligns with the feel of the font format used on the rest of the page.
  3. Color that has been implemented the least on the website/page.

Conclusion

CTAs are tricky and they need to be given an extra thought while creation. It needs to catchy, subtle, short and yet should not hit the user in the eye, should be attention trapping and descriptive in a limit of maximum 10 words.

But before you finalize on one CTA, make sure you do an A/B testing and then decide on any one of the two. CTAs also must be changed every once in a while so that users frequent users don’t get bored by seeing the same CTA over and over again.

Let us know if you’ve made similar mistakes and have corrected those mistakes in different ways in the comments below.

Author Bio:

Nick Patel is Marketing Head at WebbyMonks, agencies’ most preferred Front End and WordPress Development Partner. He pens down his knowledge and experience on WordPress, Digital Marketing, and Web Design. He loves to explore cutting-edge technology in the digital world. When not writing for technology, you can find him fishing, shooting with his camera or brewing coffee. Feel free to connect with him on Twitter and LinkedIn