{"id":2027,"date":"2024-04-21T19:56:10","date_gmt":"2024-04-21T17:56:10","guid":{"rendered":"https:\/\/trackboxx.com\/?p=2027"},"modified":"2025-03-17T16:30:36","modified_gmt":"2025-03-17T15:30:36","slug":"gdpr-compliant-design-of-consent-banners","status":"publish","type":"post","link":"https:\/\/trackboxx.com\/en\/dsgvo-konforme-gestaltung-von-consent-bannern\/","title":{"rendered":"Designing GDPR-compliant consent banners"},"content":{"rendered":"<p class=\"wp-block-paragraph\">Cookie banners follow us around like a swarm of irritating flies. Some are unnecessary, others only give the impression of GDPR compliance, and most fail to meet the rules. Here are the key points to consider.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">1. The GDPR is not to blame for everything!<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">The requirement to obtain visitors\u2019 prior consent for certain website services comes not from the GDPR itself, but from Article 5(3) of the ePrivacy Directive:<\/p>\n\n\n\n<p class=\"has-white-color has-vivid-cyan-blue-to-vivid-purple-gradient-background has-text-color has-background has-link-color has-medium-font-size wp-elements-1 wp-block-paragraph\">Member States shall ensure that the storing of information or the gaining of access to information already stored in the terminal equipment of a subscriber or user is only allowed if the subscriber or user concerned has given their consent, having been provided with clear and comprehensive information, among other things, about the purposes of the processing. ...<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">Because the ePrivacy Directive takes precedence over the GDPR, these services cannot rely on \u201clegitimate interests\u201d under Article 6(1)(f) GDPR. Instead, consent under Article 6(1)(a) applies.<br>The GDPR, in turn, sets out how that consent must be obtained.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">2. When do you need consent?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>a. Consent is not required, for example, for:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Device information, such as IP addresses, screen resolution and operating system, used to display or secure a website or app<\/li>\n\n\n\n<li>Strictly necessary cookies for language and font settings, login authentication, user preferences, shopping baskets or online forms (session cookies)<\/li>\n\n\n\n<li>Services that improve display, reduce loading times or optimise the website, such as content delivery networks (CDNs) and web fonts<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">As a general rule,&nbsp;<strong>no consent is required<\/strong>&nbsp;for cookies or services needed to run the website or provide a service the user has explicitly requested. If these are the only features you use, you do not need a cookie or consent banner; you simply need to update your privacy policy accordingly.<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">Those familiar <em><strong>\u201cWe use cookies, blah blah blah\u2026 OK\u201d<\/strong><\/em> banners are unnecessary. They confuse visitors and make them less likely to pay attention.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Tools used purely for statistical web analysis, for example to improve a website, usually do not require consent either. Matomo falls into this category, particularly as it can be hosted on your own servers. These services can rely on legitimate interests under Article 6(1)(f) GDPR. In some cases, it makes sense to carry out and document a balancing-of-interests assessment. That is a data protection issue, however, rather than a question of banner design.<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\"><strong>Google Analytics<\/strong> is an exception: supervisory authorities regard it as a tracking tool, even if the website owner only wants visitor statistics. <strong>Google Analytics<\/strong> therefore <strong>requires consent.<\/strong><\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>b. Consent is required for:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Statistical analysis and audience measurement<\/li>\n\n\n\n<li>Behavioural or location-based advertising<\/li>\n\n\n\n<li>Social media plugins<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">One alternative to social media plugins is Heise\u2019s two-click solution (the Shariff button). You can also use images or icons that simply link to the relevant platform. In that case, consent is not required; your privacy policy just needs to include the relevant information. You could add a notice that appears on hover, such as <em><strong>\u201cYou will be taken to Facebook\u201d<\/strong><\/em>. That gives visitors an extra layer of clarity.<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">For any feature that requires consent, the key rule is to obtain it <strong>BEFORE<\/strong> collecting or transmitting data.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">3. Maps, video and streaming services<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">At the time discussed here, there was still no consensus. Some data protection experts expected the planned ePrivacy Regulation, originally intended to take effect alongside the GDPR, to require prior consent for these services too. They also saw the Court of Justice of the EU\u2019s autumn 2019 rulings and the German Federal Court of Justice\u2019s May 2020 ruling as pointing in that direction.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">The Bavarian State Office for Data Protection Supervision (BayLDA) stated on its website that videos could be embedded without prior consent if playback began only after an active click and no data was transferred beforehand, using a two-click solution or Embetty. It also advised embedding YouTube videos in privacy-enhanced mode (no-cookie).<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">BayLDA took a similar view of Google Maps: map content should only load when the visitor actively requests it, for example with an extra click in a two-click solution.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">I asked BayLDA about this. At the time of my enquiry, the authority confirmed the interpretation described above, but said it still needed to examine the courts\u2019 reasoning in detail. That review could lead to a change in its position.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">If you want to plan ahead, consider obtaining consent for these services too. There is always room to take additional data protection precautions.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">4. What valid consent requires<\/h2>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">Consent must be obtained <strong>IN ADVANCE<\/strong>, be <strong>INFORMED<\/strong> and be <strong>FREELY GIVEN<\/strong>. In practice:<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\"><strong>a. IN ADVANCE:<\/strong><br>When someone first opens the website, scripts that could collect user data and pass it to third parties must remain disabled.<br><strong>b. INFORMED:<\/strong><br>Explain the services briefly, using clear, simple language and an easy-to-follow layout. The aim is to inform visitors, not overwhelm them.<br><strong>c. FREELY GIVEN:<\/strong><br>Do not pre-tick consent boxes. Visitors must actively agree, rather than have to opt out.<\/p>\n\n\n\n<p class=\"has-white-color has-vivid-cyan-blue-to-vivid-purple-gradient-background has-text-color has-background has-link-color wp-elements-2 wp-block-paragraph\"><strong>Note:<\/strong><br>Broad statements such as \u201cThis site uses cookies for analytics and advertising\u201d or \u201c\u2026to improve your browsing experience\u201d are not enough on their own. They do not explain clearly what happens to the data.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">A genuine choice also means visitors can use the website even if they refuse optional services.<\/p>\n\n\n\n<div class=\"wp-block-stackable-call-to-action stk-block-call-to-action stk-block stk-e215782 is-style-default\" data-v=\"2\" data-block-id=\"e215782\"><div class=\"stk-block-call-to-action__content stk-content-align stk-e215782-column stk-container stk-e215782-container stk-hover-parent\"><div class=\"has-text-align-center stk-block-content stk-inner-blocks stk-e215782-inner-blocks\">\n<div class=\"wp-block-stackable-heading stk-block-heading stk-block-heading--v2 stk-block stk-55888e5\" id=\"jetzt-trackboxx-30-tage-kostenlos-testen\" data-block-id=\"55888e5\"><h3 class=\"stk-block-heading__text\">Try Trackboxx free for 30 days now<\/h3><\/div>\n\n\n\n<div class=\"wp-block-stackable-text stk-block-text stk-block stk-ea0d235\" data-block-id=\"ea0d235\"><p class=\"stk-block-text__text translation-block\">No payment information required! No automatic renewal!\nYour Trackboxx ready to go in 1 minute.<\/p><\/div>\n\n\n\n<div class=\"wp-block-stackable-button-group stk-block-button-group stk-block stk-0c93f40\" data-block-id=\"0c93f40\"><div class=\"stk-row stk-inner-blocks stk-block-content stk-button-group\">\n<div class=\"wp-block-stackable-button stk-block-button stk-block stk-b564d26\" data-block-id=\"b564d26\"><style>.stk-b564d26 .stk-button{padding-right:40px !important;padding-left:40px !important;background:linear-gradient(135deg,rgb(226,1,119) 0%,rgb(0,92,174) 99%) !important;border-top-left-radius:40px !important;border-top-right-radius:40px !important;border-bottom-right-radius:40px !important;border-bottom-left-radius:40px !important}<\/style><a class=\"stk-link stk-button stk--hover-effect-darken\" href=\"\/en\/helpcenter\/30-day-free-trial\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span class=\"stk-button__inner-text\">Start for free now<\/span><\/a><\/div>\n<\/div><\/div>\n<\/div><\/div><\/div>\n\n\n\n<h2 class=\"wp-block-heading\">5. Recording and proving consent<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">You must document consent and be able to demonstrate it. Many data protection experts consider technical records sufficient: for example, the dated consent text, the banner\u2019s code and version, timestamps and the user\u2019s cookie ID. Collecting additional personal data just to prove consent is unnecessary and conflicts with data minimisation.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">6. Withdrawing consent: the opt-out option<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Users can withdraw consent at any time. Every service you use must therefore offer a working opt-out option that visitors can easily access whenever they need it.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">7. What should a consent banner look like?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>The following content must be included in the banner:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>The data controller, if this is not already clear on the website<\/li>\n\n\n\n<li>Name of the tool<\/li>\n\n\n\n<li>Purpose of processing<\/li>\n\n\n\n<li>Recipients of the data<\/li>\n\n\n\n<li>A statement that consent is optional and can be withdrawn, with an opt-out option<\/li>\n\n\n\n<li>Link to the privacy policy<\/li>\n\n\n\n<li>Position the banner carefully: it must not block access to your legal notice or privacy policy.<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\">The required information is specified, but you can choose the design. Use submenus to keep the banner from becoming cluttered. Here is one way to design the first layer while covering the minimum requirements:<\/p>\n\n\n\n<figure class=\"wp-block-image size-large\"><img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"559\" src=\"https:\/\/trackboxx.com\/wp-content\/uploads\/2024\/04\/contsnt-banner-richtig-1024x559.webp\" alt=\"\" class=\"wp-image-2028\" title=\"\" srcset=\"https:\/\/trackboxx.com\/wp-content\/uploads\/2024\/04\/contsnt-banner-richtig-1024x559.webp 1024w, https:\/\/trackboxx.com\/wp-content\/uploads\/2024\/04\/contsnt-banner-richtig-300x164.webp 300w, https:\/\/trackboxx.com\/wp-content\/uploads\/2024\/04\/contsnt-banner-richtig-768x420.webp 768w, https:\/\/trackboxx.com\/wp-content\/uploads\/2024\/04\/contsnt-banner-richtig-1536x839.webp 1536w, https:\/\/trackboxx.com\/wp-content\/uploads\/2024\/04\/contsnt-banner-richtig-18x10.webp 18w, https:\/\/trackboxx.com\/wp-content\/uploads\/2024\/04\/contsnt-banner-richtig.webp 1878w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<p class=\"wp-block-paragraph\">This is just one possible design for the first information layer, not a template you have to follow.<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">There are many consent management platform (CMP) tools. You can compare their features online. Well-known examples include <em><strong>Cookiebot<\/strong><\/em>, <em><strong>Borlabs Cookie<\/strong><\/em>, <strong><em>Usercentrics<\/em><\/strong> and <strong><em>Consentmanager<\/em><\/strong>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\"><strong>A consent tool should meet these basic requirements:<\/strong><\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Show the banner as soon as someone visits the website or app<\/li>\n\n\n\n<li>Keep legally required information accessible, including the legal notice, terms and conditions, and privacy policy<\/li>\n\n\n\n<li>Set cookies or process mobile advertising IDs only after the user actively agrees. Browsing the site, dismissing the banner or letting it close automatically after a set time does not count as consent.<\/li>\n\n\n\n<li>Allow people to use the website or app even if they reject cookies or advertising IDs<\/li>\n\n\n\n<li>Opt-out function<\/li>\n\n\n\n<li>Provide logs and reports to help demonstrate consent<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">Further guidance is available in the German Data Protection Conference\u2019s <a href=\"https:\/\/www.datenschutzkonferenz-online.de\/media\/oh\/20190405_oh_tmg.pdf\" target=\"_blank\" rel=\"noreferrer noopener\">guidance for telemedia providers<\/a> and the Baden-W\u00fcrttemberg data protection authority\u2019s <a href=\"https:\/\/www.baden-wuerttemberg.datenschutz.de\/faq-zu-cookies-und-tracking-2\/\" target=\"_blank\" rel=\"noreferrer noopener\">FAQ on cookies and tracking<\/a>.<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">You need to choose the right solution for your website, with advice from your web agency if helpful. If you do not want to build your own, compare the relevant providers and their features.<br>From a data protection perspective, check whether the provider can substantiate its GDPR compliance claims and where its servers are located.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">8. And what about marketing?<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Many visitors do not want to be tracked and will click \u201cReject all\u201d. That may be frustrating for marketing and analytics, but they are exercising their legal right to control the use of their information.<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">At an information event I attended, an employee of the Swedish <strong>Consentmanager<\/strong> provider <strong>Jaohawi AB<\/strong> shared some interesting figures:<\/p>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">Their analysis found that, on average, <strong>40\u201350%<\/strong> of visitors chose \u201cAccept all services\u201d. That means <strong>50\u201360%<\/strong> declined consent.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">According to the speaker, improving the banner could raise the acceptance rate to around 65%, or about 70% among loyal returning customers.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">He estimated that introducing a consent banner leaves roughly half of the marketing data missing from reports. He suggested accounting for these gaps statistically when preparing forecasts.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">You can respect privacy while improving your banner\u2019s positioning, colours and wording to encourage more visitors to agree to optional services.<\/p>\n\n\n\n<div class=\"wp-block-group is-layout-constrained wp-block-group-is-layout-constrained\">\n<blockquote class=\"wp-block-quote is-layout-flow wp-block-quote-is-layout-flow\">\n<p class=\"wp-block-paragraph translation-block\"><strong>But do not take it too far.<\/strong><br>Oversized \u201cAccept\u201d buttons, almost invisible \u201cReject\u201d buttons and manipulative design do not meet the legal requirements.<\/p>\n<\/blockquote>\n\n\n\n<p class=\"wp-block-paragraph translation-block\"><strong>Consent obtained unlawfully is not valid consent, and the breach can lead to a fine.<\/strong><br>Consumer protection organisations, as well as data protection authorities, are increasingly monitoring this area.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">9. Conclusion<\/h2>\n\n\n\n<p class=\"wp-block-paragraph\">Be fair and use common sense. Decide which consent-based features your customers actually need. Follow the consent and documentation requirements, use a balanced design and make it easy to opt out.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">10. Further reading and resources<\/h2>\n\n\n\n<p class=\"wp-block-paragraph translation-block\">You can find more guidance in the <a href=\"https:\/\/www.datenschutzkonferenz-online.de\/\" target=\"_blank\" rel=\"noreferrer noopener\">DSK\u2019s information resources<\/a> and on the websites of the relevant <a href=\"https:\/\/www.bfdi.bund.de\/DE\/Infothek\/Anschriften_Links\/anschriften_links-node.html\" target=\"_blank\" rel=\"noreferrer noopener\">supervisory authorities<\/a>. Bavaria has separate authorities for the public and non-public sectors.<br>Practical, accessible publications are also available. If in doubt, ask a qualified data protection professional.<\/p>\n\n\n\n<div class=\"wp-block-uagb-info-box uagb-block-f6e3ca59 uagb-infobox__content-wrap  uagb-infobox-icon-left-title uagb-infobox-left uagb-infobox-image-valign-top\"><div class=\"uagb-ifb-content\"><div class=\"uagb-ifb-left-title-image\"><div class=\"uagb-ifb-icon-wrap\"><svg xmlns=\"https:\/\/www.w3.org\/2000\/svg\" viewbox=\"0 0 512 512\"><path d=\"M0 256C0 114.6 114.6 0 256 0C397.4 0 512 114.6 512 256C512 397.4 397.4 512 256 512C114.6 512 0 397.4 0 256zM371.8 211.8C382.7 200.9 382.7 183.1 371.8 172.2C360.9 161.3 343.1 161.3 332.2 172.2L224 280.4L179.8 236.2C168.9 225.3 151.1 225.3 140.2 236.2C129.3 247.1 129.3 264.9 140.2 275.8L204.2 339.8C215.1 350.7 232.9 350.7 243.8 339.8L371.8 211.8z\"><\/path><\/svg><\/div><div class=\"uagb-ifb-title-wrap\"><h3 class=\"uagb-ifb-title\">Did you know\u2026<\/h3><\/div><\/div><div class=\"uagb-ifb-separator\"><\/div><p class=\"uagb-ifb-desc\">\u2026that you can track website activity without cookies? Trackboxx generates a hash instead and does not store personal data. Under certain conditions, you can even do away with the consent banner. Sound good? Try Trackboxx for free, with no obligation.<\/p><\/div><\/div>\n<\/div>\n\n\n\n<div class=\"wp-block-stackable-call-to-action stk-block-call-to-action stk-block stk-mm2lrys is-style-default\" data-v=\"2\" data-block-id=\"mm2lrys\"><div class=\"stk-block-call-to-action__content stk-content-align stk-mm2lrys-column stk-container stk-mm2lrys-container stk-hover-parent\"><div class=\"has-text-align-center stk-block-content stk-inner-blocks stk-mm2lrys-inner-blocks\">\n<div class=\"wp-block-stackable-heading stk-block-heading stk-block-heading--v2 stk-block stk-14m7g3y\" id=\"jetzt-trackboxx-30-tage-kostenlos-testen\" data-block-id=\"14m7g3y\"><h3 class=\"stk-block-heading__text\">Try Trackboxx free for 30 days now<\/h3><\/div>\n\n\n\n<div class=\"wp-block-stackable-text stk-block-text stk-block stk-5ptd8q9\" data-block-id=\"5ptd8q9\"><p class=\"stk-block-text__text translation-block\">No payment information required! No automatic renewal!\nYour Trackboxx ready to go in 1 minute.<\/p><\/div>\n\n\n\n<div class=\"wp-block-stackable-button-group stk-block-button-group stk-block stk-qseny6a\" data-block-id=\"qseny6a\"><div class=\"stk-row stk-inner-blocks stk-block-content stk-button-group\">\n<div class=\"wp-block-stackable-button stk-block-button stk-block stk-ecvmb1u\" data-block-id=\"ecvmb1u\"><style>.stk-ecvmb1u .stk-button{padding-right:40px !important;padding-left:40px !important;background:linear-gradient(135deg,rgb(226,1,119) 0%,rgb(0,92,174) 99%) !important;border-top-left-radius:40px !important;border-top-right-radius:40px !important;border-bottom-right-radius:40px !important;border-bottom-left-radius:40px !important}<\/style><a class=\"stk-link stk-button stk--hover-effect-darken\" href=\"\/en\/helpcenter\/30-day-free-trial\/\" target=\"_blank\" rel=\"noreferrer noopener\"><span class=\"stk-button__inner-text\">Start for free now<\/span><\/a><\/div>\n<\/div><\/div>\n<\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>Cookiebanner umschwirren uns wie l\u00e4stige Fliegen. Einige sind v\u00f6llig \u00fcberfl\u00fcssig, manche gaukeln DSGVO-Konformit\u00e4t lediglich vor und die allermeisten sind nicht regelkonform. Daher versuche ich im Folgenden die wichtigsten Eckpunkte auszuleuchten. 1. Die DSGVO ist nicht an allem schuld! Der eigentliche Grund, warum f\u00fcr bestimmte Dienste auf Webseiten vorab vom Seitenbesucher eine Einwilligung eingeholt werden muss, [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":2029,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_acf_changed":false,"footnotes":""},"categories":[1,67,53],"tags":[],"class_list":["post-2027","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-blogboxx","category-datenschutz","category-web-analytics"],"acf":[],"_links":{"self":[{"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/posts\/2027","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/comments?post=2027"}],"version-history":[{"count":0,"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/posts\/2027\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/media\/2029"}],"wp:attachment":[{"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/media?parent=2027"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/categories?post=2027"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/trackboxx.com\/en\/wp-json\/wp\/v2\/tags?post=2027"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}