How to design ‘cookie consent’ fairly?

or ‘Accept all’ till the new ePrivacy Regulation?

István Sebestyén
UX Collective

--

Three macarons as a column with different colours and three call to action buttons nearby with the same colours: accept all, reject all, settings.
How we should display options fairly? (Source: author, snapwire on pexels.com)

How did I get to this cookie topic? I am accomplishing a love project in the automotive industry which consists of reviewing 18 brands¹ from the league of sports or luxury sports cars. Before I started I had a top-down concept: it won’t be a big deal, these brands want to sell cars, I expected more or less the same thing with small UI differences on their websites. Partly because, as in all industries, they are constantly monitoring their competitors, identifying and implementing the best practices, etc. Although I am in love with some specific models from various brands, I’m not a fan, I basically don’t check out these websites more often than any other, thus I have a ‘virgin eye’.

I was just starting to look at the landing pages, but there were a number of surprises I originally didn’t plan to deal with and write about at all.

Accessibility was the most unexpected topic I wrote about here, very briefly. It was a shockingly positive experience for me. I never thought I would come across this level of accessibility solution at a sports car manufacturer.

At the same time, which I would not have thought of too, it was absolutely surprising how different the solutions for accepting cookies were.² That’s why I’m now talking about it briefly from a design standpoint.

Landing experience became ‘noisy’ cookie consent is the first barrier

If you visit any website or the website you have previously visited has gone through a restructuring, etc. the first thing you come across is the information about cookies and the CTAs that manage your consent.

Neither as a user nor a designer do we typically deal with this, it gets little attention. This is because it is not the core user journey for which we go to a website as a user and this is not the thing for that the designer is working on a specific website. However, it is compulsory by regulation and relevant action should be accomplished as easily and quickly as possible because otherwise, you can not start your journey on the website. It is a show stopper.

Therefore, in most cases, designers responsible for seamless user flow apply this:

Accept all call to action button
Companies’ and designers’ favourite

What has made the situation worse in the last couple of years is the much more ‘noise’ that is interfering with smooth landing for the user. Cookies are only the first in the row. I think the following (and likely even more) ‘noises’ are familiar to you too on landing pages.

  1. Cookies, cookie policy
  2. Privacy/data policy
  3. Highlights of the Covid19 virus situation at the company, measures (safety, modified sales model etc.)
  4. Sector-specific regulation (in automotive: compliance with harmonised emission methodology due to ‘diesel’ scandals)
  5. Pop-up chatbot
  6. ‘Sign up for the newsletter’
  7. ‘Download our new mobile app’
  8. Call for customer experience evaluation, rating
  9. Versions update, system downtime, maintenance (IT operation type news)
  10. Season’s play, action, etc.

The reaction required from the user to the above slow down the landing and finding what the user was looking for originally. These also suggest that cookie acceptance should be solved as easy and quickly as possible.

Then what can cause tension here in terms of design and usability? Let’s have a look at how car brands handle this on their first page (click here for the full-sized image):

Centre positioned cookie consent popups of car brands
Centre positioned popups of car brands

The majority used centred popups, but full-length bottom popup also comes to play (here Mercedes Benz is different with its bottom-right position). Normally centred popup covers the page. It can be one reason why Aston Marton put it top right, and Pagani on fully the top. Centred, it is visibly dominant and pushes users to act quickly.

Bottom positioned popups of car brands
Bottom positioned popups of car brands

The bottom solution(click here for the full-sized image): leaves more experience about the main topic, being ‘less pushy’. In all cases, however, a transparent dark layer covers the site, for instance, HEX 666666, 85%.

The (detailed) cookie and privacy policies themselves can be found we can say uniformly in the footer area of the last section of the landing page usually among other corporate information. The differences are due to the overall design of the websites and their content structure. What is surprising though is that some of these are hardly visible (click here for the full-sized image):

Cookie and Privacy policies in the footer area at the end of the landing pages
Cookie and Privacy policies in the footer area at the end of the landing pages

Let's get back to the cookie popups. In all cases, the user gets basic textual information about the cookies. There are differences in the depths and details, and how brands refer to Cookie and/or Privacy policy in the popups. However, my current focus is on the CTAs (click here for the full-sized image):

Call to action buttons of car brands
Call to action buttons of car brands

The picture is mixed in terms of how brands orient users visually. Let us examine it more clearly.

Which CTA is highlighted (the same way)?
Which CTA is highlighted (the same way)?

Why might the practices differ even in this narrow sample?
I think the main reason is how car manufacturers interpret and deal with the overall tendency of strengthening the regulatory framework on cookies and privacy.

An increasingly extensive, rigorous and complex regulatory environment

The description of the regulatory environment, which has undergone a dynamic evolution in the last twenty years due to consumer protection considerations, developing technologies and concentrating market segments among others, is well beyond the scope of this article.

It is a quite complex issue, there is country group level regulation, such as the probably strictest EU’s GDPR; national ones (Canada, Italy, Ireland, UK, France, Thailand, South Africa, Turkey, etc.); or the ones that exist on the federal state level (e.g., in USA: California, Virginia, Nevada). If we just take the example of Italy, the following regulation is applied at least: ‘Cookie’ Directive 2002/58/EC; updated by Directive 2009/136/EC; Provision of the Italian Data Protection Authority on cookies (08.05.2014.); General Data Protection Regulation (EU 2016/679).

The regulation refers to the ‘content issue’ of data use and that it should be done accordingly and be published transparently on the website, not to what specific (visual) solutions you can apply. Obviously, as a designer you likely need a legal third party in a design process to get updated in privacy and need to be aware of the site/activity is subject to which regulation not forgetting that regulation likely has a cross-border scope and validity.

A thriving ready-made solutions market

As a response to this legal environment, several companies provide a ready-made solution for the design or content-wise counsel for cookie and privacy policies for companies who have no dedicated internal resources or do not want to deal with this issue themselves. In other words, the whole corporate world with the exception of the largest ones that have internal legal staff or cooperation with law offices. A lot of companies offers cookie consent templates, or provide cookie consent generator etc. Some offer free Cookie policy audits or checkboxes to assess the cookie compliance of specific websites by just typing the URL.

To give you examples (not ranked): Osano, Quantcast, OneTrust, Cookiebot (by Usercentrics), Iubenda, Termify, Consentmanager, Termly, TermsFeed, PrivacyPolicies, WebsitePolicies, Cookieyes, FreePrivacyPolicy, Cookie Script etc.

To my surprise, even with these companies, cookie policy presentation and consent design are not uniform at all. (click here for the full-sized image):

Cookie consent popups of ready-made service providers in privacy
Cookie consent popups of ready-made service providers in privacy

From a user perspective, the problem is at least twofold: a) nothing and no one can guarantee that all cookies are harmless in all circumstances, the texts shyly suggest:’essentially’ or ‘largely harmless’; b) the user must be given the option to enable/disable anything other than cookies that are absolutely necessary for operation. Ensuring trust here is contradictory to the interest of the business models which would require accepting all cookies by the user to support analytics or marketing.

ePrivacy will change it all

The handling of cookies will be completely affected in the near future by the new ePrivacy Regulation by the EU which may come into force in 2022. There are at least three major elements: 1) stricter regulation for data including now metadata 2) extension to services and entities not yet covered by the law, like WhatsApp, Facebook Messenger, and Skype 3) simpler rules on cookies.

Easier handling of cookies means that websites do not need to get consent for ‘non-privacy intrusive cookies’ like those eg. which allow ‘shopping carts’ to remember what a user has bought. It also makes it possible for users to manage cookies settings on the browser level. It will be compulsory for organizations to make it possible for the end-user to withdraw the previously-granted consent at least annually. Which predicts that the multitude of current popups will disappear, and it is beneficial for the business. It is yet a question if local regulators could be more strict than that.

Conclusion

Till the ePrivacy Regulation come into force which may take a while, and with all of the above in mind, I think the fair UI solution for cookie popups is to include the full explanatory text (not to leave the section) with clearly displayed active link to policies. CTAs should balance between fairness and business considerations, which may suggest that all CTA-s should be the same, like the following two examples.

Call to action solutions of Mercedes, Lexus Europe, Pagani as the fairest.
Fair CTA solutions (Volvo too in May 2022)

These solutions are probably the fairest for the users. They are tricky also because they make customization ‘not the simplest’ in terms of language and placement while putting Accept all, which represent business interests, in the finger-friendly and ‘known pattern’ bottom right. Pagani pre-ticked the checkbox suggesting you have control over marketing causing a positive feeling of trust in you as a user, as a consequence you smoothly click on OK accepting the other three important for the company. Why? If you can afford and want to have a Pagani, you do not care about marketing too much, I assume.

I also highlight one example of being correct but with ‘finesse’. In early 2022 Volvo still had the solution on the left side. The two CTAs are of the same size, same colour. The balancing act is that they prioritised Accept ahead of Settings. At the same time, however, Cookie Settings received a noticeably thicker stroke. Since then, Volvo took exactly the Lexus path on the right side.

Evolution of cookie consent popup of Volvo in 2022
Evolution of cookie consent popup of Volvo in 2022

So you can be fairer by displaying all options equally, then play with CTA text, and placement to correspond to business needs. The advantage of this is that an active web user who is already familiar with cookies will find the accept all CTA in any case. While others more sensitive to privacy will not be deterred from completing the journey by a clear explanation and the feeling that they are manipulated.

It is a tiny issue in design that I’ve discussed herein, and it will change significantly with ePrivacy Regulation. I wonder if till then, there would be others like Volvo to implement a solution bringing user control to the forefront.

It is just an opinion to think about it. Thank you for reading this article. It is my pleasure to recommend my writings on Medium and you can reach me here or here.

Note:

¹Car brands (their global ‘com’ sites) reviewed are Alfa Romeo, Aston Martin, Audi, BMW, Bugatti, Ferrari, Jaguar, Lamborghini, Lexus, Lotus Cars, Koenigsegg, Maserati, McLaren, Mercedes-Benz, Pagani, Porsche, Tesla, Volvo.

²I started this project in February but it was put on hold several times. Even during this short period up to early May, I realized that Koenigsegg and Volvo from the point of view of this article adjusted their websites remarkably. Since I made my landing page reviews in February but wrote the article just now, I would not exclude facelifts at other brands, though I do not expect it happened.

--

--

UX | Digital Product & Service Design | Economist | Banking | Strategy | Advisory | Corporate Finance