Banner de cookie honesto: recusar tem de impedir o script, não só fechar o aviso

Abra o DevTools no site da sua empresa, aba Network, marque "Disable cache" e recarregue. Antes de você tocar no banner de cookies, o navegador já pediu o script de medição, o pixel de anúncio e o widget de chat. Agora clique em "Recusar" e recarregue: tudo carrega de novo. O botão só fecha o aviso. A resposta curta: se o site só usa cookie essencial, não precisa de banner pedindo aceite, basta informar na política. Se usa medição ou marketing, nada disso pode carregar antes da escolha, e recusar tem de ser um clique do mesmo tamanho que aceitar e impedir o script de verdade.

Banner que não muda nada ensina a pessoa a clicar em qualquer botão para tirar o aviso da frente. A confiança cai, e você ainda fica com um registro de "consentimento" que não vale nada.

Essencial, medição e marketing: por que a categoria decide tudo

Cookie essencial é o que faz o serviço funcionar como a pessoa pediu: sessão de login, carrinho, proteção contra CSRF, lembrar a própria escolha sobre cookies. Sem ele, o site quebra. Esse não depende de aceite, mas precisa ser informado. A parte técnica dele, com HttpOnly, Secure e SameSite, está em cookie de sessão bem configurado.

Medição e marketing são outra coisa: o site funciona sem eles. É aí que entra a escolha. A ANPD publicou um guia orientativo sobre cookies e proteção de dados que vale ler inteiro; a ideia central é que a pessoa precisa entender o que está escolhendo e conseguir recusar sem esforço maior do que aceitar.

O ponto que quase todo mundo erra é técnico, não jurídico. O banner e o script são independentes. Colar o snippet do Google Analytics no head e depois colar um banner de plugin não liga um ao outro. O script roda no carregamento da página, o banner aparece depois, e o clique em "Recusar" não desfaz um pedido que já saiu.

Outro atalho que não se sustenta é o "ao continuar navegando, você concorda". Rolar a página não é escolha; é só ler. Se a pessoa não fez nenhum gesto claro de aceite, trate como recusa e não carregue nada opcional.

Como fazer o banner funcionar de verdade

1. Inventarie o que carrega. Abra a Network sem cache, filtre por domínios que não são o seu e liste cada um: o que é, quem pediu, se é essencial.
2. Classifique. Essencial, medição, marketing. Na dúvida, não é essencial.
3. Se nada é opcional, tire o banner. Uma linha no rodapé com link para a política resolve.
4. Tire os scripts opcionais do HTML. Eles passam a ser injetados por código, só depois do aceite.
5. Dois botões iguais. "Aceitar medição" e "Recusar" com o mesmo tamanho, cor de mesmo peso e no mesmo nível. Nada de recusa escondida em "Configurações".
6. Guarde a escolha com versão. Se a lista de ferramentas mudar, a versão muda e o banner volta.
7. Deixe voltar atrás. Um link "Preferências de cookies" no rodapé reabre o banner.

Exemplo: carregar a medição só depois do aceite

O HTML do banner, sem nenhum script de terceiro na página:

<div role="dialog" aria-label="Cookies de medição" data-banner-cookies hidden>
  <p>Usamos cookies essenciais para login e carrinho. Com a sua permissão,
     também usamos uma ferramenta de medição de audiência.
     <a href="/privacidade#cookies">Detalhes</a></p>
  <button type="button" data-aceitar>Aceitar medição</button>
  <button type="button" data-recusar>Recusar</button>
</div>
<a href="#" data-preferencias>Preferências de cookies</a>

E o JavaScript, servido do seu domínio:

const CHAVE = 'escolha-cookies';
const VERSAO = '2026-10';

function lerEscolha() {
  try {
    const salvo = JSON.parse(localStorage.getItem(CHAVE));
    return salvo && salvo.versao === VERSAO ? salvo : null;
  } catch {
    return null;
  }
}

function salvarEscolha(aceitou) {
  localStorage.setItem(CHAVE, JSON.stringify({
    aceitou: aceitou,
    versao: VERSAO,
    em: new Date().toISOString()
  }));
}

function carregarMedicao() {
  if (document.querySelector('script[data-medicao]')) return;
  const s = document.createElement('script');
  s.src = 'https://medicao.exemplo.com/script.js';
  s.async = true;
  s.dataset.medicao = 'sim';
  document.head.appendChild(s);
}

const banner = document.querySelector('[data-banner-cookies]');
const escolha = lerEscolha();

if (!escolha) {
  banner.hidden = false;
} else if (escolha.aceitou) {
  carregarMedicao();
}

banner.querySelector('[data-aceitar]').addEventListener('click', () => {
  salvarEscolha(true);
  banner.hidden = true;
  carregarMedicao();
});

banner.querySelector('[data-recusar]').addEventListener('click', () => {
  salvarEscolha(false);
  banner.hidden = true;
});

document.querySelector('[data-preferencias]').addEventListener('click', (e) => {
  e.preventDefault();
  const tinhaAceitado = (lerEscolha() || {}).aceitou;
  localStorage.removeItem(CHAVE);
  if (tinhaAceitado) {
    location.reload();
  } else {
    banner.hidden = false;
  }
});

Guardar a escolha em localStorage é essencial: serve justamente para não perguntar de novo. Quando a pessoa retira o aceite, o código recarrega a página para que o script de medição, já carregado, saia da memória. Se a ferramenta gravou cookies próprios no seu domínio, apague-os também na retirada; a documentação dela diz quais nomes usa.

Se você usa um gerenciador de tags ou uma plataforma de consentimento, a lógica é a mesma: as tags opcionais precisam disparar só com o sinal de aceite. Confira na prática, porque a configuração padrão de muitas dessas ferramentas carrega tudo e só depois pergunta.

Como provar que a recusa funciona

Abra uma janela anônima, DevTools na aba Network, "Disable cache" ligado. Carregue a página sem clicar em nada: nenhum domínio de medição ou anúncio pode aparecer. Clique em "Recusar", navegue por três páginas: continua sem aparecer. Na aba Application, em Cookies, só devem existir os essenciais. Depois repita aceitando e confirme que a medição aparece. Esse teste leva cinco minutos e vale repetir a cada ferramenta nova.

Os dois candidatos mais comuns a escapar do banner são o botão social e o SDK de rede social. Eles têm posts próprios: botão de curtir que carrega script de terceiro e SDK social no carregamento da página.

Erros comuns

• Script de medição no head e banner por cima. O pedido sai antes da escolha; a recusa é decorativa.
• "Recusar" escondido em configurações. Aceitar fica a um clique e recusar a quatro. A escolha deixa de ser livre.
• Banner em site que só tem cookie essencial. Você treina o visitante a clicar sem ler e passa a impressão de que há coleta.
• Reapresentar o banner a cada página após a recusa. A pessoa cansa e aceita para parar. Isso não é consentimento.
• Sem caminho para mudar de ideia. Quem aceitou uma vez fica preso, e retirar o consentimento tem de ser possível.
• Nunca testar no DevTools. O plugin promete bloquear e ninguém confere se bloqueia.

Checklist

• Lista escrita de cada domínio externo que a página chama, com categoria.
• Nenhum script opcional está fixo no HTML.
• Em janela anônima, sem clique, nenhum domínio de medição aparece na Network.
• Recusar e aceitar têm o mesmo tamanho e destaque.
• Após recusar, só cookies essenciais aparecem em Application.
• A escolha tem versão e o banner volta quando a lista muda.
• O rodapé tem link para rever a escolha.

Abra agora uma janela anônima no seu site, clique em "Recusar" e olhe a aba Network: algum domínio que não é seu continua sendo chamado?