search

jfeltkamp / cookiesjsr

Easily expandable cookie consent tool.
Other
22 stars 5 forks source link

Remove deceptive "Accept all" button colors/contrast #8

Closed geek-andi closed 1 year ago

geek-andi commented 3 years ago

Problem

By law, users must be given a clear yes/no option. Max Schrems claims that deceptive colors/contrast does not comply to GDPR, I think he's right :) (even if courts end up judging differently, we should not "nudge" users to the one or the other option). Source: https://noyb.eu/en/noyb-aims-end-cookie-banner-terror-and-issues-more-500-gdpr-complaints

Currently, cookiesjsr does exactly this.

image

image

Proposed solution

Remove highlighting the "Accept all" buttons in the default styling. (To make the banner visually easier to get, the cookie setting button could be smaller.)

(Of course users can override the css, but I think the default settings should be sensible)

jfeltkamp commented 3 years ago

I'm absolute okay with your interest, but the buttons have the same contrast, in so far as white/blue has the same contrast-value as blue/white. The buttons have the same size and font-size. "Deceptive" means that buttons appear as "disabled", "disadvantageous" or "dangerous" or something like this. You can't even say that either of these buttons is clearly highlighted. Which of the two would that be? The one with the border, or the monochrome one.

But I will leave this issue open to catch other comments and meanings on it.

geek-andi commented 3 years ago

@jfeltkamp Thanks for your answer! Yes, there is some room for discussion here.

For me, two things are quite obvious:

  1. In the first screenshot bigger font size and capital letters are used the "Accept all cookies" button. "Only accept Video cookies" is not even a button
  2. In the second screenshot the "Accept all" Button has a color fill which makes it more visible to me. Since there are two buttons that have a white fill color, the one button which is different will always stand out

Indeed, I'm not sure if deceptive is the correct word for it. At least I would say both designs nudge users to click on the button which is less privacy friendly. In my opinion that should not be the case. Because when you think about the dozens of banners average users "click away" each days it affects the choice users make.

JPustkuchen commented 2 years ago

Please see https://www.drupal.org/project/cookies/issues/3250618 for similar issue on drupal.org and suggestions for a flexible solution by @thomas.frobieter

JPustkuchen commented 2 years ago

@jfeltkamp could we please at least add semantic classes to the buttons, so we can safely style them? This should be no breaking change.

Current situation is the following: Bar: grafik Modal layer: grafik

So I'd suggest to simply add

In a later cleanup (future task), the BEM style should be reviewed & revised and I'd vote to remove the "important" class.

jfeltkamp commented 2 years ago

Ok, I improved that in the master of jfeltkamp/cookiesjsr. Please check, if it works for you. Then I will tag it and deploy on CDN.

To test with Drupal: Go to libraries and checkout cookiesjsr as master. (correct version, when you see 1.0.13 in the pacckage.json) Un-check "Load by CDN" in COOKiES settings.

In the banner: Allow and Deny get both "important" class and an additional individual class. Responsive behavior doesen't display-none the deny button anymore and alternativly swap to mobil mode earlier, if there is not enough place for all buttons in a row.

In the layer: The "Save" action got the important class. Allow and Deny don't have "important" class anymore, and will also be handled equal in responsive.

JPustkuchen commented 2 years ago

Thank you @jfeltkamp! Green lights from our side :)

geek-andi commented 1 year ago

Nice, this seems to be fixed. Thanks @jfeltkamp !

See https://www.drupal.org/project/cookies/issues/3250618

grafik