Sprung zum Inhalt

Webdesign nach Maß von webdesign weisshart

Mein Blog

RSS Feed AbonnementRSS 2.0 Feed

zum Archiv und den Kategorien

EU Cookie Richtlinie

Donnerstag, 22. Oktober 2015

Der Hinweis auf den Einsatz von Cookies — kürzlich von mir noch als Cookie Warnung Irrsinn bezeichnet — wird anscheinend über kurz oder lang zwingend.
Siehe diesen Artikel im I LAW iT-Blog
Weil ich keine Lust habe, mich mit einer Abmahnung herumzuärgern, hab' ich in den sauren Apfel gebissen, und meine Website mit so einem Monstrum "verziert".

Screenshot vom iPhone
Die mobile Startseite von webdesign.weisshart.de mit dem Cookie-Hinweis am Seitenfuß

Folgende Bedingungen stellte ich mir selbst:

  • Kein Opt-in, sondern ein Hinweis auf die Datenschutzerklärung, wo die Opt-out-Möglichkeiten beschrieben werden.
  • Seitenaufbau darf nicht verlangsamt werden.
  • Keine fremde Ressource, d. h. kein zusätzlicher HTTP-Request.
  • Möglichst wenig Belästigung für den Besucher.

Die Lösung:

Ein einziger Codeschnipsel, den ich nach der Seitenüberschrift eingefügt habe:

<?php
if (!isset($_COOKIE['eu-cookie-irrsinn'])) {
$ablauf = (time() + (365 * 24 * 60 * 60)) * 1000;
echo '
<div id="eu-cookie-irrsinn" style="hier CSS für das div">
<p style="hier CSS für den Text">
Hier der angezeigte Text <a href="datenschutz.php">Weitere Infos</a>
</p>
<button style="hier CSS für den OK-Button"
onclick="document.cookie=\'eu-cookie-irrsinn=accepted; expires=\'+(new Date('.$ablauf.')).toGMTString();this.parentNode.parentNode.removeChild(this.parentNode);">
OK<dfn> &mdash; hier klicken um diese Anzeige dauerhaft zu verbergen.</dfn></button>
</div>
';
}
?>

Meine CSS-Angaben für das div:

style="background-color:#f1f1f1; opacity: .9; font-size: .9em; width:100%; position:fixed; bottom:0; left:0; z-index:100; border-top: 1px solid #aaa"

Damit wird der Hinweis am Seitenende fixiert. Wichtig insbesondere für die mobile Ansicht, um wenigstens den Seitenkopf nicht zu verstecken.
Warum Inline-CSS? Um sicherzustellen, dass der Hinweis nicht aufgrund einer race condition ungestylt angezeigt wird.

PageSpeed Insights zeigt, dass ich die Vorgabe "Seite darf nicht langsamer werden" einhalten konnte.

Nachtrag 24.01.2016

Wer sich, wie ich, nicht über diesen Irrsinn ärgern will: Es gibt ein Browser-Addon dagegen: I don't care about cookies — und Ruhe ist.



3 Kommentare

  1. Das ist eine Super Lösung, wird der Code in den Webdesign Tools freigegeben? Ich würde den Code mit dem Hinweis auf den Urheber webdesign.weisshart.de auch gerne auf meine Website mit einbauen.

    Kommentar von Thomas — Sonntag, 1. November 2015 - 9:15 Uhr

  2. @Thomas,

    der Code IST freigegeben. Wie alles hier im Blog unter der Lizenz
    CC BY-NC-SA 3.0 DE (siehe Seitenende). Das heißt vor allem: keine kommerzielle Nutzung, und Namensnennung.
    Einfach den Code aus dem Artikel kopieren, und ggf. anpassen.

    Kommentar von Fritz — Sonntag, 1. November 2015 - 12:46 Uhr

  3. I don’t care about cookies - sowas für iOS fehlt!

    Kommentar von Der Keksgeschädigte — Mittwoch, 30. März 2016 - 18:44 Uhr

Einen Kommentar abgeben

Damit Code-Beispiele richtig angezeigt werden, müssen Sonderzeichen maskiert werden (z.B. < zu &lt;).


(notwendig)

(notwendig)

Spamschutz:
Je nach Inhalt wird Ihr Kommentar eventuell nicht sofort angezeigt, sondern muss manuell freigeschaltet werden.

Archiv:

Kategorien:

Creative Commons Lizenzvertrag
Alle Texte (nicht Bilder!) Creative Commons CC BY-NC-SA 3.0 DE