Cookie Consent Banners Best Practice

What formats to choose and where to position your cookie consent notification

Our clients

Banner

The secret of a good cookie consent banner design is to make it stand out so it attracts the user's attention, while still being aligned with the design of your brand and fit into the webpage. It should be easily noticeable but not intrusive. What seems to be pretty obvious, but still often enough missed, is that it should not be covered by any other element of the page, i.e. the live chat. In fact, from a legal aspect, this is an issue.

Copyright: Cheetah Conversions, All Rights Reserved. | Privacy Policy 

Copyright: Cheetah Conversions, 
All Rights Reserved. | Privacy Policy 

How to design the cookie consent banner

After deciding on the banner format and position, it’s time to decide how you best design the notification.

Top 3 tips on how to design the cookie consent banner

 
Design cookie notifications as a friendly note and not a warning.

 Avoid using warning colours such as RED or Yellow.

 Choose a colour and size that gives the banner enough presence to be noticed. 

Buttons

“We have been working with Ketly & Cheetah Conversions since 2019. Back then, we started testing different channels and services including SEO, SEA and Paid Social. Constant and clever A/B-testing of our ads assured, that we are using our budget the best way possible, only on ads that are the most successful. They managed to keep our CPL constantly low, and at the same time pulling in high-quality leads.”

Request Case Study

Patricia Olear
Marketing Manager

“We have been working with Ketly & Cheetah Conversions since 2019. Back then, we started testing different channels and services including SEO, SEA and Paid Social. Constant and clever A/B-testing of our ads assured, that we are using our budget the best way possible, only on ads that are the most successful. They managed to keep our CPL constantly low, and at the same time pulling in high-quality leads.”

"The marketing campaign Cheetah Conversions set-up and managed for UX Academy's Product Design Webinar Summer campaign was off the charts. Within 24 hours, just under 2,000 individuals had either discovered the replay or attended the webinar live, greatly increasing our prospects for converting webinar leads into paying students"

Request Case Study

Adrian Daniels
Head of Sales & Partnerships

"The marketing campaign Cheetah Conversions set-up and managed for UX Academy's Product Design Webinar Summer campaign was off the charts. Within 24 hours, just under 2,000 individuals had either discovered the replay or attended the webinar live, greatly increasing our prospects for converting webinar leads into paying students"

"Cheetah's cross-channel testing process really challenged the assumptions we have developed over time and showed us a successful way of running our multi-language campaigns across different channels. 
It allowed for tweaks and adjustments that drove lead generation significantly more than expected. Thanks to Cheetah we found the right approach for our target audience.
We cannot recommend them enough!"

"Cheetah's cross-channel testing process really challenged the assumptions we have developed over time and showed us a successful way of running our multi-language campaigns across different channels. 
It allowed for tweaks and adjustments that drove lead generation significantly more than expected. Thanks to Cheetah we found the right approach for our target audience.
We cannot recommend them enough!"

Request Case Study

Charlotte Linde
Growth Hacker

Top 3 tips on how to get content most likely to get users to accept the cookies:

Do the keywords you chose to build your page content around reflect what people are searching for?

Will the people who find your site using these keywords get the answers to their questions they were searching for?


Will the audience driven by these keywords help your company to reach goals, monetary, email sign ups or other?

Header

A cookie notification in the footer is as visible as one in the header. Both footer and header banners are usually locked on the screen, so they stay in sight no matter whether the user scrolls up or down the page. This is probably the most common position we see; however, we do not really recommend showing the cookie consent banner here. Users are more likely to ignore a notification if they are used to it. They know it's just something they can ignore and tend to blend it out of their view.

Footer

On the side of the screen

Unlike the header and footer position, which sometimes cover parts of the navigation bar or the page footer content, this format generally appears as a stand-alone notification box and does not prevent the viewer from seeing an important part of the website. It is therefore even easier to ignore it. If you want to encourage your page visitors to allow cookies, we do not recommend this position.

Modal

The format we favour the most is the pop-ups, either positioned in the middle or at the top of the screen. This notification stays there until the user responds to it. The benefit here is that the banner will definitely be noticed and actioned by your visitors. Of course, modal banners are more intrusive than the rest of the types mentioned above, but we do believe it is worth it and should seriously be considered. We recommend testing this and closely monitor the bounce rate.  

Cookie banners located at the very top of a page are difficult to overlook as users generally first see the header with the brand name and logo when viewing a website. On the other hand, once their eyes have passed this section of the page, this format does not distract users from browsing the body content and can easily be ignored. The consent is therefore less likely to be actioned. One way of making the banner more prominent and therefore more likely to be actioned, in this position, is to place it so it hides an essential part of the page, i.e. the navigation bar.

When it comes to the options you should give users, we recommend to only have an “Accept” button. In this case you have to make sure that there is also an exit option (usually displayed in the form of a cross at the top right of the notification banner). If you think an “Accept” button on its own is too aggressive, present an “Accept” and a “Decline” button. In doing so, we highly advise you to put a second thought into the design of the “Decline” option, designing it in a very subtle way, so it is hardly noticeable, and you draw the user's attention right away to the “Accept” option.

Only an accept button

Only an OK button

Accept and Decline button with the Accept button being very obvious and prominent and the Decline button easily to be overseen.

In general, we do see that short and very clear messages, nicely phrased, do work best. E.g. We are using cookies to ensure you a great experience browsing our website.

Why not just say “OK” here, instead of “Accept”? We are used to getting notifications on our devices all the time and let's be honest, most of the time we do not properly read them and just want them to go away. Now, this we can use to our advantage here!

To comply with legal regulations, we do highly recommend adding a link to your Privacy Policy to the cookie consent banner text. After all, the legal aspect is why we are adding the notification in the first place.

And last but not least, a nice thing to have and what definitely helps with performance of the banner is to add preference settings through which users can accept some actions to be tracked. This will result in more data collection in Google Analytics than not giving the option, and is well-received by users. So if you can do this, we highly recommend it.

Some other examples

How the design of the cookie banner integrates with the design of the website, that the user has the option to select what cookies he/she wants to accept.

To put it clear, the GDPR
 (General Data Protection Regulation) states:

A consent banner must be explicit, clear, and easily distinguishable among the rest of the website elements and features.

A consent notification must be written in a plain and intelligible language, causing no confusion or misunderstanding.

A consent form must include distinct options that enable users to opt-in or opt-out for consent regarding data collection and processing.

1

2

3

What content is most likely to get users to accept the cookies

Top 3 tips on how to get content most likely to get users to accept the cookies:

 
Avoid using alert words as PRIVACY.

Use direct and concise call-to-action (i.e. I agree, continue).

 The cookie notification shouldn’t be too long, usually no more than two sentences.

What we like:

What we don't like:

What we don't like:

Too much text on the notification scares users off actioning it.

What we like:

The very subtle design of the “Puroposes/Features” button

What we don't like:

The very long text

The wording “Cookie-Hinweis” is creating a sense of urgency we do not think is good.

What we don't like:

The option of deciding which cookies the user accepts condensed format already in the pop-up and the great design of the buttons.

What we like:

What we like:

Great choice of colour - the notification is standing out.

What we don't like:

The size of the banner is very small!

That there is a second step to action.

What we don't like:

The fact that asking the user to select the country, has the effect that he/she might get distracted from the Cookies topic and the great choice of colour of the button. 

What we like:

What we don't like:

We recommend placing the buttons users should click (in this case "Sounds good”) on the right. 

The design and wording of the banners.

What we like:

Top 3 tips on how to get content most likely to get users to accept the cookies:

 
Avoid using alert words as PRIVACY.

 Use direct and concise call-to-action (i.e. I agree, continue). 
The cookie notification shouldn’t be too long, usually no more than two sentences.

Keep the visibility of the behaviour of your users with the right cookie consent banner design, format and wording

With new privacy policy laws in place, the tracking and storing of user data has become more challenging than ever. That means we Marketeers are no longer able to gain insights into the behaviour of our website visitors and are also unable to retarget users that have previously shown interest in our product or service with relevant content - unless the user gives us permission to do so.

When running Performance Marketing campaigns, advertisers are now seeing what significant impact cookie notification bars have on the visibility of user on-page engagement metrics in analytic tools such as Google Analytics. If a user chooses not to accept the cookie consent, we are unable to see any behaviour of that user on the website or landing page and are also unable to drive that user further down the conversion funnel with other campaigns.

So which cookie bar designs work best and what other useful tricks are there to convince users to accept cookies? There are different ways of asking users to accept the cookies. Some designs work better than others, and sometimes small UX design tricks can make a real difference.

Learn More

Advertise where it really counts.

Learn MoreGet a Free Proposal

Position

Design

Banner

Buttons

To put it clear, the GDPR (General Data Protection Regulation) states: