Have you ever felt that the only option is to ‘Accept all cookies’ before continuing browsing?
That is the so-called Dark UI design. A method of visual manipulation, intentionally forcing visitors to click on the option we prefer.
Sometimes, because it is the obvious default, or other options are presented as ‘bad for the user’, or simply hidden.
I have been thinking about this for a long time, and I am always astonished by the creativity of UI designers who want to trick you into the “Accept all” option.
Example of Dark UI Cookie Banners
1️⃣ Call for Action
📖 Example: ‘Accept all’ is a button, bright color, and visible. Reject (or reject all) is present as a link, maybe even next to the accept button, but since it is not a button, it does not really call for an action
2️⃣ The options are visually in different places
📖 Example: The reject button is in an entirely different position than ‘accept all’
3️⃣ Make other options almost invisible – (Same as option 1, but the designer went even further)
📖 Example: When the color of the ‘reject all’ link is in dark gray on a black background, or any other combination hard to spot.
4️⃣ Hide any actions over other options – (Number 3, but even further. )
📖 Example: Mouse over the link does not change your mouse pointer, and the link does not change color. Basically, it looks like normal text.
User goes with the mouse over the link, the pointer remains the same, therefore the user is tricked that ‘Reject all’ option is just a text, not a link, or thinks it is disabled by default.
Important takeout: All these methods were invented to exhaust users’ decision-making mechanisms, so they want to ‘Accept All’ and feel relieved.
Mouse over the ‘Reject all’ option does not change the cursor
Mouse over ‘Accept all’, change the cursor, and therefore create the impression that this is the only option here
Bad practices
Accept all option is disproportionately oversized compared to the other options
Cookie Settings almost look like accidental text here
Translation: You can Accept cookies or…. Accept 🤷🏻♂️ No other option, baby 😎
Good practices
But, it doesn’t always have to be sketchy. Let’s look at some good examples
Clearly marked option for ‘Reject all’. All necessary information is inside the pop-up
Nice design, where cookies are not pre-selected by default, but only when the user clicks ‘Accept all’ [Alle zulassen]