Contrassegno di trasparenza in sovrimpressione
Un iframe autonomo che contiene l’avviso di trasparenza. Può essere collocato nell’angolo della creatività e aprirsi al passaggio del puntatore, oppure comparire sopra di essa come fascia con l’etichetta sempre visibile.
cornice —
Caricamento di un avviso di trasparenza pubblicato.
Codice di incorporamento per l’editore
Incolla questo codice attorno alla tua creatività. Segue la posizione selezionata sopra.
<div style="position: relative">
<!-- your creative goes here -->
<iframe id="polads-badge"
src="https://polads.eu/badge/ABC12?w=300&h=250"
title="Political advertising transparency notice"
scrolling="no"
style="position: absolute; top: 8px; right: 8px;
width: 32px; height: 32px; border: 0; background: transparent;
transition: width .22s cubic-bezier(.2,.7,.25,1),
height .22s cubic-bezier(.2,.7,.25,1)"></iframe>
</div>
<script>
window.addEventListener("message", function (e) {
if (e.origin !== "https://polads.eu") return;
var f = document.getElementById("polads-badge");
if (!f || e.source !== f.contentWindow) return;
if (!e.data || e.data.polads !== "size") return;
f.style.width = e.data.w + "px";
f.style.height = e.data.h + "px";
});
</script>Note di integrazione
L’iframe si ridimensiona da solo
Un iframe è un rettangolo opaco: tutto ciò che copre smette di ricevere i clic. Se fosse dimensionato sul pannello aperto, occuperebbe gran parte di uno spazio da 300 per 250. Per questo l’iframe viene caricato con le dimensioni del contrassegno e invia alla pagina principale un messaggio con le nuove dimensioni quando si apre e quando si chiude.
Sui telefoni il passaggio del puntatore non è disponibile
Toccando il contrassegno d’angolo questo si apre, ma un tocco che mostra contenuti anziché portare a un’altra pagina è un’indicazione d’uso debole sugli schermi tattili. Quando il dispositivo segnala che il passaggio del puntatore non è supportato, la fascia con l’etichetta è la scelta migliore, perché l’avviso è visibile sullo schermo fin dall’inizio.
La fascia è leggibile anche senza script
Richiede soltanto modifiche dell’altezza ed è già leggibile all’altezza iniziale. Senza il gestore dell’evento di ridimensionamento il testo può risultare tagliato alle larghezze ridotte, ma nulla diventa irraggiungibile, a differenza del contrassegno d’angolo, che invece non può aprirsi affatto.
Verifica l’origine
Il codice di incorporamento ignora qualsiasi messaggio che non provenga dall’origine dell’avviso e proprio da quell’iframe. Una pagina può ospitare molti iframe, e un gestore del ridimensionamento che si fida di qualunque mittente consente a ognuno di essi di ridimensionare il contrassegno.
I formati bassi non si espandono
Comunica al contrassegno le dimensioni dello spazio e si adatterà. Con meno di circa 200 pixel di spazio il pannello si apre in orizzontale, e in uno spazio basso e stretto al tempo stesso si riduce al solo simbolo e rimanda direttamente all’avviso.
Nessun font web, nessuna rete
L’iframe usa i font di sistema e un unico simbolo incorporato nel codice, quindi compare insieme all’annuncio anziché un istante dopo, e non può inviare a terzi alcuna richiesta di font.