Quattro design originali di banner cookie da modificare e copiare, un controllo delle scelte rischiose secondo l'ICO e il codice Google Consent Mode v2.
Un buon banner cookie offre Accetta tutti e Rifiuta tutti affiancati, con un modo per scegliere per categoria, e lascia disattivato ogni interruttore non essenziale finché il visitatore non agisce. Qui sotto trovi quattro design originali di banner da modificare e copiare, un controllo che segnala le scelte rischiose e il codice di Google Consent Mode da abbinare.
Le scelte del banner in sintesi (in base alle linee guida dell'ICO britannico, a ottobre 2026)
La maggior parte delle raccolte di banner mostra screenshot dei banner di altre aziende senza dire se rispettano le regole. Gli esempi qui sono design nostri, funzionanti e modificabili, e ognuno è abbinato a ciò che dicono davvero le linee guida dell'autorità britannica su rifiuto, impostazioni predefinite e silenzio. Questa pagina spiega pattern di design; non è una consulenza legale.
La pagina dell'ICO britannico sulla gestione del consenso descrive come buona pratica un meccanismo che renda rifiutare il consenso facile quanto accettarlo, e il suo esempio di cattiva pratica è un banner con Accetta tutti ma senza Rifiuta tutti. Altrove le regole sono stabilite dall'autorità di ogni paese, quindi controlla le linee guida dei paesi in cui operi.
L'ICO afferma che silenzio o inattività non valgono come consenso, e classifica un pop-up che tratta l'uso continuato come consenso come un'attivazione anticipata dei cookie senza consenso. Se un visitatore ignora il banner, lascia disattivati i cookie non essenziali.
I cookie strettamente necessari per qualcosa che il visitatore ha chiesto, come un carrello o un login, rientrano in un'esenzione. L'ICO precisa che i cookie utili o comodi ma non essenziali richiedono comunque il consenso.
È un modo per dire ai tag Google se il visitatore ha accettato. Imposti un valore predefinito con gtag('consent', 'default', ...) prima che i tag si carichino, poi chiami gtag('consent', 'update', ...) quando sceglie. La versione 2 ha aggiunto i parametri ad_user_data e ad_personalization accanto a ad_storage e analytics_storage.
Possono funzionare entrambi. Una barra in basso lascia leggibile la pagina, mentre un riquadro centrato ottiene una decisione più rapida ma copre i contenuti. Conta di più che entrambe le scelte siano ugualmente facili e che nulla di non essenziale parta prima.
Ogni anteprima gira in una sandbox con gli script disattivati, quindi qui i pulsanti non fanno nulla. Copia il markup e collega i pulsanti al tuo codice di consenso.
Il layout più comune. Accetta e Rifiuta condividono lo stesso stile; Scegli apre il tuo pannello delle impostazioni.
Occupa meno spazio sugli schermi grandi. Su un telefono, lascialo estendere a tutta la larghezza.
I cookie necessari sono mostrati come sempre attivi; ogni altra casella parte deselezionata.
Un piccolo link nel footer di ogni pagina permette ai visitatori di cambiare idea in qualsiasi momento.
Se il tuo sito usa i tag Google, imposta il valore predefinito prima che i tag si carichino e aggiornalo quando il visitatore sceglie. I nomi dei parametri qui sotto sono quelli della documentazione di Google sul consent mode.
Parametri di Consent Mode
La chiamata default va prima dello snippet del tuo tag Google. wait_for_update dà al banner 500 millisecondi per inviare un aggiornamento prima che i tag partano.
Layout
Barra in basso
Riquadro nell'angolo
Riquadro centrato
Cosa fa il tuo banner
Rifiuta tutti è nella prima schermata
Accetta e Rifiuta hanno lo stesso aspetto
L'interruttore degli analytics parte attivato
Il testo dice che continuare a navigare significa consenso
Un link Impostazioni cookie permette di cambiare idea
Anteprima
Usiamo i cookie per far funzionare questo sito e, se sei d'accordo, per misurare le visite.
Continuando a navigare, accetti il nostro uso dei cookie.
Accetta tutti
Rifiuta tutti
Scegli
Analytics
Note
Nessuna scelta rischiosa trovata tra quelle selezionate.
Manca Rifiuta tutti nella prima schermata. L'ICO descrive come buona pratica rendere rifiutare il consenso facile quanto accettarlo.
Rifiuta sembra più debole di Accetta. Secondo noi questo rende il rifiuto più difficile dell'accettazione; una coppia alla pari è il design più sicuro.
Un interruttore non essenziale parte attivato. Negli esempi di buona pratica dell'ICO gli interruttori per le tecnologie non esenti sono disattivati di default.
Continuare a navigare viene trattato come consenso. L'ICO afferma che silenzio o inattività non valgono.
Nessun modo di cambiare la scelta in seguito. L'ICO afferma che gli utenti devono poter attivare o disattivare facilmente i cookie non essenziali.
Un aiuto per il design basato sulle linee guida pubblicate dall'ICO, non una consulenza legale.
Inizia gratis · Nessuna carta di credito richiesta