You’ve most likely stumbled upon a website asking you to accept their cookies or get out. Without considering the implications, you click “Accept” because you’re too eager to view the website’s content. Some companies use this technique, sneaky as it may be, to coerce users into accepting cookies.
Although most website cookie banners have the same harmless intent — to get a user’s consent to track their browsing behavior — how they are implemented can affect a user’s experience, and in some cases, even endanger users.
In this article, we’ll discuss some bad cookie consent practices and how they can harm users. But most importantly, we’ll show you how to create a perfect, nonobtrusive cookie banner. So, if you’re ready to learn about cookies, let’s get started.
First, let’s explain what cookies are.
A cookie is a small piece of data a website stores on a user’s device to keep track of their browsing activity. They enable the web servers to serve a more personalized user experience.
A website cookie banner allows users to accept or decline the use of these cookies on a website:
If you’ve ever wondered why you can visit a new website and get shopping recommendations based on what you’ve previously viewed on another website, it’s all thanks to cookies. Now, let’s explore some ways websites use cookies.
Cookies are, however, for more than targeted ads. They’re helpful for half a dozen reasons.
For website owners, cookies can help estimate website traffic and gather data on how users interact with a website. Because each cookie is designed to have its unique ID, website owners can determine how many unique users view their website and what they do on the website. This information is valuable for website optimization.
Cookies store authentication tokens and session IDs so users can stay logged in across pages or during subsequent visits without re-entering login credentials.
Cookies can make a website more secure by helping to identify fraudulent activities such as unauthorized access or suspicious login attempts.
Because cookies store information about user preferences, they allow websites to tailor content and recommendations based on a user’s behavior.
Cookies can track users’ activity across multiple websites, building a profile of their interests and online behaviors. Websites can use this information to target them with personalized ads.
Be aware, however, that this may soon be a thing of the past. Google has joined Safari and Firefox in doing away with third-party cookies. Instead, Google is working on privacy-preserving APIs to serve website owners — we’ll see what the future holds.
Websites that use affiliate marketing can use cookies to track users who click on affiliate links, and if those users make a purchase, the website earns a commission.
As you can see, websites rely heavily on cookies. So, it’s no surprise that some websites limit or block access if a user declines cookies.
However, looking at things from the users’ perspective, the optimal experience would not require cookie consent. Ideally, no user would want to go through the hassle of accepting and rejecting cookies whenever they visit a new website. Instead, they prefer a more seamless process that automatically declines all unnecessary cookies.
Given this conflict between the business goals and what users want, some websites may employ techniques to “nudge” users into consenting to cookies. These often deceptive techniques trick users into doing things they didn’t mean to and are referred to as dark patterns.
Let’s look at some common dark patterns used in cookie banners and how they prevent users from giving valid consent.
Dark patterns, also known as deceptive patterns, use design elements to influence users’ decisions or actions. Unlike good UX practices, dark patterns are usually in the interest of the business rather than the users.
Dark patterns in cookie banners are mainly used for one purpose: to make it difficult for users to reject consent to cookies. The problem with this approach is that when users give consent this way, it may not meet the requirements for a valid General Data Protection Regulation (GDPR) consent:
Consent should be given by a clear affirmative act establishing a freely given, specific, informed, and unambiguous indication of the data subject’s agreement to the processing of personal data relating to him or her, such as by a written statement, including by electronic means, or an oral statement.
Here are some common dark patterns in cookie banners and how they prevent a user from giving valid GDPR consent.
Some cookie banners offer users only one option: Accept. When this happens, the user must either consent to cookies or leave the website. Such consent does not constitute valid GDPR consent because the user has to accept cookies — whether they want to or not.:
For consent to be valid, a user must be offered a clear, equal, and actual choice.
Another dark pattern websites use is placing the “Accept” button in a prominent position and making the “Reject” or “Manage cookies” option less visible or difficult to reach:
This design choice exploits users’ tendency to quickly click through prompts without thoroughly reviewing them. Thus, consent given in this manner cannot be considered valid because it violates the principles of transparency and informed consent.
“Improved user experience,” says little about how user’s information will be used. Additionally, vague button labels such as “OK” and “No” do not provide enough clarity for the user to make an informed choice:
Some websites use unclear language in cookie banners to trick users into accepting cookies without fully understanding the implications. These tactics include using ambiguous language, technical jargon, or double negatives. The goal is to exploit users’ behaviors and push them toward a specific choice.
For consent to be valid, requests must be “clearly distinguishable from the other matters” and presented in “clear and plain language.”
Some websites use a “Settings” button to add an extra layer to the cookie decline process. When a cookie banner offers only two options — accept cookies or go to settings — they are more likely to accept cookies because people tend to choose the path with the least resistance. Consent given this way does not constitute valid GDPR consent:
For consent to be valid, it must be as easy to revoke as it is to give.
Users should know which specific cookies they are consenting to. Therefore, cookie banners should include checkboxes that let users choose the specific cookies they are consenting to.
However, you must present these checkboxes must with a neutral starting point where no option is preselected. This ensures a fair and transparent decision-making process regarding cookie consent:
For consent to be valid, it must be voluntary, specific, and informed, and you need to provide clear information about which cookies you’ll use and what they are used for.
By employing these dark patterns, websites can get as many users as possible to consent to cookies. However, when collecting as many cookie consents as possible is the ultimate goal, empathy for the user often takes a backseat. But at what cost?
What risks do these seemingly harmless practices pose to website users? Let’s explore some of them, shall we?
It is essential that websites explicitly inform users of the type of cookies they are consenting to. Websites that use dark patterns fail to fulfill this information disclosure.
This is a problem because when a user grants consent to cookies, they’re essentially granting permission for that platform to monitor their online activities. Although this might seem innocuous, it has broader implications.
Websites aren’t always the sole retainers of the information they collect. Instead, the info can be shared with third-party entities, especially advertising firms. These third parties mainly use them for targeted advertising. (Though, as we mentioned earlier, these third-party cookies are being ditched for more secure API tracking, which should happen this year.)
The downside to this process is the extensive amount of information that tracking cookies can accumulate over time. These advertising firms can even go on to create detailed profiles of these users, including their preferences, browsing habits, and personal interests. Data collection at this level can be perceived as invasive as it goes beyond the immediate context of the website the user originally interacted with.
The lack of transparency involved in dark patterns can leave users feeling like they are not in total control. A clear example of this is confirm-shaming, a method some websites use to guilt users into providing consent. By using imagery or opt-out buttons labeled in a derogatory way, users are made to feel shame for opting out.
The main concern surrounding cookies often revolves around what the collected/stored data is used for and who it benefits more. Although first-party cookies serve the user’s convenience by minimizing the need to enter passwords or configure site preferences repeatedly, third-party cookies raise significant concerns.
When websites use dark patterns, there’s usually a lack of transparency regarding the use of data stored by third-party cookies. This can create trust issues between users and businesses as users need clear communication about the handling of their information, especially when it involves third-party entities with potential access to their data.
Given the negative impact of deceptive cookie consent practices, there needs to be a way to ensure that the users’ interests are protected. This is where cookie policies come in.
Now, let’s dive into what a cookie policy is.
A cookie policy lets users know which cookies are used on a website, what data they track, why they track it, and where the cookies send data. In addition, it explains how to opt out of these cookies and how to adjust the settings.
Many global data privacy laws, including the European Union and California laws, require websites to have a cookie policy if they use cookies to collect user data. Regulations may require websites to display a cookie banner that links to a cookie policy when visitors first land on a platform or when updated consent is necessary.
To meet the California and EU law requirements, your cookie policy should state:
Having a thorough cookie policy on your website is essential for building user trust, boosting a website’s credibility, and ensuring legal compliance. Your cookie policy can be a separate document or a part of your privacy policy, but it should be easily accessible through a link in your cookie banner.
So, now that we’ve established the need for a link to your cookie policy, what else is required to make an ideal cookie banner? Let’s cover that, shall we?
For your cookie banner to be effective, user-friendly, and meet data privacy law requirements, it should:
Users need to understand what they are consenting to. Therefore, your cookie banner should briefly describe why the website uses cookies, what purposes they serve, and who can access the data. Also, the button copy should explicitly state what actions they perform:
The above example clearly explains why they use cookies, the type of data they collect, and who has access to it. It even lets the user know how to manage their choices and what happens when they make changes. Everything is as clear as day.
Additionally, the buttons are prominent, of equal visual weights, and have clear copies to help the users make a well-informed choice.
Your cookie banner should be prominently displayed and easy to spot. However, it shouldn’t obstruct the website’s content unless necessary. One of the most common placements of cookie banners is the header and footer areas. Such placements work well because they’re immediately visible to the user without being obtrusive:
But they can sometimes pop up in one corner of the window. Ideally, the user should notice the cookie banner but still be able to view the website’s content.
Also worth keeping in mind is your banner’s responsiveness. Ensure the banner occupies as little space as possible, even on smaller screens.
An ideal cookie banner would include an accessible way for users to adjust their preferences. Additionally, it should provide a straightforward option for users to withdraw their consent if desired:
In the above example, users can adjust their preferences by clicking the “Adjust my preferences” button. They can also reject all unnecessary cookies by clicking the “Accept only necessary” button.
This practice aligns with privacy regulations regarding giving users control over their data and ensuring their choices are respected.
Not only should an ideal cookie banner be readily visible and accessible when users visit a website, but it should also be current and reflective of the website’s practices. If there are any changes to the website’s cookie policy or data handling practices, you should promptly inform users via the cookie banner:
The example above informs the user of the website’s updated privacy policy, terms of service, and cookie policy and provides links to them. This approach promotes transparency and helps users make informed decisions about privacy preferences.
Although cookies can enhance user experience, dodgy cookie consent practices pose risks to users. To ensure that your cookie consent banners benefit your users while meeting your business goals, they need to be designed ethically.
By adopting practices such as prioritizing clarity, proper banner display, ensuring accessibility, and having a comprehensive privacy policy, you can create cookie notices that do the job without getting in the users’ way.
LogRocket lets you replay users' product experiences to visualize struggle, see issues affecting adoption, and combine qualitative and quantitative data so you can create amazing digital experiences.
See how design choices, interactions, and issues affect your users — get a demo of LogRocket today.
Adobe XD is Adobe’s version of Figma – but does it match up? This blog is an attempt at decoding the good and bad of both, and figuring out which one is best used for which use case.
Subscription pages are meant for users and businesses, and they should work well for both parties. This blog is a thorough discussion of what’s best and what’s not when it comes to designing subscription pages.
Call it what it is. Product designers and UX designers have unique roles, even if their titles often get swapped. In this blog, know the difference and own your expertise.
Search bars are more than icons and inputs — they can be a retention magnet or a churn trigger. Sharing my tried-and-tested search bar design principles in this blog!
Learn more →
