Końcem marca przetoczyła się przez polski internet bardzo burzliwa dyskusja. Zgodnie z wprowadzoną nowelizacją ustawy Prawo Telekomunikacyjne właściciel serwisu internetowego powinien poinformować i uzyskać zgodę internauty na przechowywanie plików cookie. Jako że ustawa dotyczy całości zagadnień telekomunikacyjnych, nie zawiera szczegółowych informacji jak powinna wyglądać taka informacja. Natomiast sposób pozyskania zgody został przedstawiony wyraźnie – „Abonent lub użytkownik końcowy może wyrazić zgodę, o której mowa w ust. 1 pkt 2, za pomocą ustawień oprogramowania zainstalowanego w wykorzystywanym przez niego telekomunikacyjnym urządzeniu końcowym lub konfiguracji usługi”.
W przypadku cookies oznacza to, iż wyrazić zgodę możemy przez odpowiednią konfigurację przeglądarki. Trzeba przyznać, że jest to jedna z najbardziej liberalnych interpretacji w całej Unii Europejskiej.
Brak wyraźnych przepisów dotyczących sposobu informowania użytkownika sprawił, że każdy serwis interpretował ustawę po swojemu i tworzył własne rozwiązania. W panice zaczęto importować i stosować wprost rozwiązania z zachodu, głównie z Wielkiej Brytanii, zupełnie nie zwracając uwagi na to, że tamtejsza wersja ustawy jest o wiele bardziej restrykcyjna. W efekcie powstały rozwiązania wręcz kuriozalne, zmuszające internautę do dodatkowych, zbędnych działań – m.in. wymuszające zaznaczenie dodatkowego checkboxa.
Skrypt cookies – zrób to sam
Nasz prosty skrypt cookies będzie działał w oparciu o jQuery, dlatego do obsługi ciastek wykorzystamy bibliotekę jQuery.cookie autorstwa Klausa Hartl.
JS
Zacznijmy od stworzenia pluginu.
|
1 2 3 4 5 6 7 8 9 |
(function($) { $.fn.cookiepolicy = function(options) { new jQuery.cookiepolicy($(this), options); return this; }; $.cookiepolicy = function(options) { }; })(jQuery); |
Zdefiniujmy podstawowe opcje, które będziemy mogli w prosty sposób zmienić przy inicjalizacji skryptu.
|
1 2 3 4 5 |
options = $.extend({ cookie: 'cookiepolicyinfo', info: 'Korzystanie z witryny oznacza zgodę na wykorzystywanie plików cookie.', close: 'Zamknij' }, options || {}); |
Następnie sprawdźmy czy istnieje już nasze ciastko. Jeśli nie, to dodamy do strony nasz komunikat.
|
1 2 3 4 5 6 7 8 9 10 |
if($.cookie(options.cookie) != 'true') { var wrapper = $('<div/>').addClass('cookiepolicy').appendTo('body'); $('<span/>').html(options.info).appendTo(wrapper); $('<a/>').addClass('button').html(options.close).appendTo(wrapper) .on('click', function(e) { e.preventDefault(); $.cookie(options.cookie, true); $(this).parents('.cookiepolicy').remove(); }); } |
CSS
Odrobiną CSS-a przypudrujmy okienko z komunikatem.
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
.cookiepolicy { background: #efefef; bottom: 0; font: 14px Arial, Helvetica, sans-serif; left: 0; padding: 15px 50px; position: fixed; right: 0; text-align: center; } .cookiepolicy .button { background: #444; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; color: #fff; cursor: pointer; margin-left: 5px; padding: 5px 10px; } |
Instalacja
Dołączmy pliki do strony.
|
1 2 3 |
<link href="css/jquery.cookiepolicy.css" rel="stylesheet" /> <script type="text/javascript" src="js/jquery.cookie.js"></script> <script type="text/javascript" src="js/jquery.cookiepolicy.js"></script> |
I uruchommy skrypt.
|
1 2 3 4 5 |
<script type="text/javascript"> $(document).ready(function () { $.cookiepolicy(); }); </script> |
Możemy też wykorzystać dodatkowe opcje i zmienić co nieco w komunikacie.
|
1 |
$.cookiepolicy({close: 'OK'}); |
Wady i zalety
Ten skrypt cookies posiada kilka znaczących zalet. Przede wszystkim dostarcza informację w sposób mało inwazyjny, nie zasłaniając dużych obszarów strony. Nie wymaga też od użytkownika żadnych zbędnych interakcji.
Główną wadą wszystkich skryptów typu popup/modal jest jednorazowe dostarczenie informacji, w stylu kliknij i zapomnij. Jeśli z tej samej przeglądarki korzysta kilka osób, to tylko pierwsza z nich ma możliwość zapoznania się z komunikatem. Dlatego warto uświadamiać internautów, że wszelkie informacje na temat bezpieczeństwa mogą zawsze znaleźć w polityce prywatności.
[button url=’/tutorial/cookiepolicy’ size=’large’ style=’blue’]Demo[/button][button url=’/tutorial/cookiepolicy/cookiepolicy.zip’ size=’large’ style=’red’]Pobierz[/button]
