Плашка «мы используем cookies» из 2016 года – это уже не про красоту, а про закон. В России обработку данных пользователей регулирует Федеральный закон №152-ФЗ «О персональных данных», а с 2025 года штрафы за нарушения в этой сфере заметно выросли. Cookies и идентификаторы систем аналитики (Яндекс.Метрика, счётчики) во многих случаях трактуются как персональные данные, поэтому уведомление должно не просто «висеть», а выполнять три задачи: информировать, вести на политику обработки ПДн и фиксировать согласие. Ниже – как сделать это правильно и без устаревших зависимостей.
Что требует 152-ФЗ и практика Роскомнадзора
Важно понимать разницу с европейским GDPR: российское законодательство не требует «предварительного» блокирующего согласия на все cookies так жёстко, как ЕС. Но есть обязательные вещи, которые проверяет Роскомнадзор:
- Политика обработки персональных данных – отдельный документ, опубликованный на сайте и доступный с любой страницы (обычно ссылка в футере). Это прямое требование 152-ФЗ для оператора, собирающего данные.
- Информирование пользователя о том, что сайт использует cookies и системы аналитики, и куда идут данные.
- Согласие на обработку ПДн – для форм (заявки, обратная связь) это отдельный чекбокс со ссылкой на политику; для аналитических cookies практикой стало согласие через баннер.
- Учёт трансграничной передачи – если данные уходят на зарубежные серверы, это отдельно отражают в политике и уведомляют РКН. Для сайтов на российских сервисах аналитики это обычно неактуально.
Практический вывод: баннер должен ссылаться на реальную страницу политики (не заглушку), а трекеры желательно подключать после согласия – это соответствует принципу минимизации и снижает риски.
Почему старый код с js-cookie 2.1.2 пора выбросить
В исходной версии заметки подключалась библиотека js-cookie версии 2.1.2 с публичного CDN и вручную писались функции addClass/removeClass. В 2026 это лишнее и небезопасно:
- внешний CDN – это сторонний домен, точка отказа и дополнительный запрос; современные браузеры отлично работают с
document.cookieиclassListбез библиотек; - манипуляции классами через регулярные выражения заменяются нативным
element.classList.toggle(); - ключевой момент: счётчик Метрики в старом коде грузился сразу при загрузке страницы – то есть до согласия. Правильнее инициализировать его только после нажатия кнопки.
Разметка баннера: доступная и без зависимостей
Используем семантические атрибуты доступности: role="dialog", aria-live и настоящую кнопку <button> вместо ссылки-заглушки <a href=""> (пустой href перезагружает страницу). Блок кладём в футер сайта:
<div class="cookie-notice" id="cookieNotice" role="dialog"
aria-live="polite" aria-label="Уведомление об использовании cookies" hidden>
<p>Мы используем cookies и Яндекс.Метрику, чтобы сайт работал и был удобнее.
Оставаясь на сайте, вы соглашаетесь с
<a href="/privacy/">политикой обработки персональных данных</a>.</p>
<button type="button" id="cookieAccept">Принять</button>
</div>Скрипт: согласие и отложенная загрузка Метрики
Логика простая: если согласие уже сохранено – сразу инициализируем счётчик; если нет – показываем баннер и грузим Метрику только по клику. Вместо ХХХХХХ подставьте номер своего счётчика.
<script>
(function () {
var KEY = 'cookie_agreement';
var notice = document.getElementById('cookieNotice');
var accept = document.getElementById('cookieAccept');
function hasConsent() {
return document.cookie.indexOf(KEY + '=1') !== -1;
}
function setConsent() {
// срок 180 дней, ограничиваем область и защищаем от CSRF-утечки
var d = new Date();
d.setTime(d.getTime() + 180 * 24 * 60 * 60 * 1000);
document.cookie = KEY + '=1; expires=' + d.toUTCString() +
'; path=/; SameSite=Lax';
}
function initCounter() {
(function (m, e, t, r, i, k, a) {
m[i] = m[i] || function () { (m[i].a = m[i].a || []).push(arguments); };
m[i].l = 1 * new Date();
k = e.createElement(t); a = e.getElementsByTagName(t)[0];
k.async = 1; k.src = r; a.parentNode.insertBefore(k, a);
})(window, document, 'script', 'https://mc.yandex.ru/metrika/tag.js', 'ym');
ym(XXXXXX, 'init', { clickmap: true, webvisor: false });
}
if (hasConsent()) {
initCounter();
} else {
notice.hidden = false;
accept.addEventListener('click', function () {
setConsent();
notice.hidden = true;
initCounter();
});
}
})();
</script>Обратите внимание на флаг SameSite=Lax – он ограничивает отправку cookie в межсайтовых запросах и стал стандартом безопасности. На HTTPS-сайте к нему добавляют Secure.
Типичные ошибки
- Ссылка на несуществующую политику. Баннер ведёт на
cookie.php, которого нет, – с точки зрения 152-ФЗ обязанность не выполнена. Сначала опубликуйте политику, потом ставьте баннер. - Трекер грузится до согласия. Инициализируйте Метрику после клика, а не при загрузке страницы.
- Пустой
href=""на кнопке. Это перезагружает страницу и сбрасывает состояние – используйте<button type="button">. - Баннер перекрывает контент на мобильных. Проверьте, что плашка не мешает нажать важные кнопки, и её можно закрыть.
- Забыли про формы. Согласие на обработку ПДн в формах – это отдельный обязательный чекбокс, баннер cookies его не заменяет.
Если вы хотите выводить баннер по-разному на разных страницах (например, скрывать на самой странице политики) – пригодится приём из гайда «Вывод блоков только на определённых страницах». А тем, кто дорабатывает вывод текущего года и дат в подвале с политикой, будут полезны «Вывод текущего года на PHP» и «Сменить формат даты в CMS Битрикс».