⚠️ Le linee guida AgID sull’accessibilità dei servizi sono operative
AgID ha definito i criteri per valutare l’applicazione dei requisiti di accessibilità da parte dei fornitori di servizi digitali in Italia, e la piattaforma per i reclami è già attiva: gli utenti possono segnalare un sito non accessibile nei casi previsti dalla normativa. Le sanzioni possono arrivare fino a 40.000 euro per violazione, a seconda del settore e dell’autorità competente. Se gestisci un e-commerce o un servizio online rivolto ai consumatori, devi adeguarti.
Scopri cosa cambia e come tutelarti →
La Direttiva Europea sull’accessibilità (EAA) è entrata pienamente in vigore il 28 giugno 2025, introducendo nuovi requisiti per l’accessibilità dei siti web. Per le aziende che operano all’interno dell’UE o che si rivolgono a clienti dell’UE, è fondamentale migliorare l’accessibilità e allinearsi a questi nuovi standard. Con l’Accessibility Widget di iubenda, rendere il tuo sito web più accessibile diventa facilissimo.
Il nuovo Accessibility Widget di iubenda utilizza adattamenti basati sull’intelligenza artificiale per rendere automaticamente il tuo sito web più accessibile agli utenti che presentano diverse disabilità. La soluzione supporta una serie di funzionalità che facilitano la navigazione e l’interazione degli utenti con il tuo sito.
Che cos’è l’Accessibility Widget di iubenda?
L’Accessibility Widget di iubenda è un widget completamente automatizzato progettato per migliorare l’accessibilità del tuo sito web. Adatta il tuo sito web in tempo reale per soddisfare le esigenze degli utenti con disabilità, includendo profili di accessibilità, ridimensionamento del testo, modalità ad alto contrasto, font leggibili e altro ancora. Le funzionalità principali includono:
- 🎧 Testo alternativo IA e struttura della pagina: Aggiunge il testo alternativo alle immagini e rileva intestazioni e landmark mentre i visitatori navigano. Così aiuta chi usa uno screen reader.
- 🔳 Contrasto e ridimensionamento del testo: Permette agli utenti di regolare il contrasto e la dimensione dei caratteri in base alle proprie esigenze.
- ⌨️ Scorciatoie da tastiera: I visitatori premono Alt+0 per aprire o chiudere il pannello e Alt+9 per sospendere o ripristinare le regolazioni.
- 🌀 Controllo sui contenuti dinamici: Permette agli utenti con epilessia o altri disturbi di fermare le animazioni o i contenuti dinamici che potrebbero essere dannosi.
Grazie a una semplice installazione, puoi iniziare subito a lavorare senza dover cambiare il codice del tuo sito web.
1: Attiva l’Accessibility Widget
- Vai alla dashboard di iubenda: Nella dashboard di iubenda, trova il riquadro Accessibility Widget tra i prodotti disponibili.
- Attiva il Widget: Clicca sul pulsante Attiva per iniziare a usare l’Accessibility Widget.
2: Personalizza l’Accessibility Widget
Una volta attivato l’Accessibility Widget, puoi adattarlo all’aspetto del tuo sito con il configuratore dell’Accessibility Widget. Lo strumento è disponibile sia con i nuovi piani sia con i piani precedenti.
- Vai alla dashboard di iubenda.
- Trova il riquadro Accessibility Widget.
- Clicca sul pulsante Impostazioni per aprire il configuratore.
Il configuratore si presenta così:
Nel configuratore trovi diverse opzioni per personalizzare il widget:
- Posizione del pulsante di attivazione: Scegli dove far apparire il pulsante del widget sullo schermo: in alto a sinistra, in basso a sinistra, in basso a destra, in alto a destra
👉 Il pannello principale del widget si apre sempre dalla parte inferiore dello schermo.
- Colori del pannello: Scegli un colore primario per il pannello, in linea con il design del tuo sito. Con il piano Standard puoi scegliere anche un colore secondario per gli elementi selezionati. Se non lo imposti, il widget usa il colore primario. Se il contrasto è troppo basso, vedrai un avviso, ma potrai comunque salvare.
- Aspetto del pulsante di attivazione: Regola il colore dell’icona e il colore di sfondo del pulsante di attivazione.
- Lingua predefinita: Il widget mostra il pannello nella lingua di ogni pagina. Se la lingua della pagina manca o non è disponibile, usa la lingua che imposti qui.
💡 Il pannello del widget non contiene un link alla dichiarazione di accessibilità. Se ne hai una, inserisci il link nel footer del tuo sito, così i visitatori la trovano da ogni pagina. Devi ancora scriverla? Leggi la nostra guida alla dichiarazione di accessibilità.
💡 Tutte le modifiche che fai nel configuratore vengono applicate automaticamente al tuo Accessibility Widget, anche se è già integrato nel tuo sito.
3: Installa l’Accessibility Widget sul tuo sito web
Una volta attivato e configurato il widget, puoi integrarlo nel tuo sito.
-
Integra il widget: Copia lo snippet fornito per l’Accessibility Widget e incollalo all’inizio della sezione Head del tuo sito web (subito dopo il tag
<head>) per installare il widget. - Verifica la funzionalità del Widget: Dopo l’integrazione, aggiorna il tuo sito web per assicurarti che il widget sia visibile e funzionante. Ora dovresti vedere una piccola icona per l’accessibilità:
Come funziona per gli utenti finali
Una volta che l’Accessibility Widget è stato integrato e attivato sul tuo sito, gli utenti finali potranno interagire con esso per personalizzare la loro esperienza di navigazione. Quando gli utenti modificano le loro impostazioni attraverso il widget, vengono apportate modifiche in tempo reale al layout del sito web, assicurando che i contenuti siano immediatamente ottimizzati in base alle preferenze selezionate. Ecco come si comporta il widget e le funzionalità che offre:
- Aspetto del widget: Il widget di accessibilità appare come una piccola icona; quando gli utenti cliccano sull’icona, si apre un menu di opzioni per l’accessibilità, fornendo un modo semplice per regolare il layout del sito web.
- Preferenze dell’utente: Il widget consente agli utenti di selezionare le proprie preferenze di accessibilità, come ad esempio:
- Dimensione del testo: Gli utenti possono regolare le dimensioni del testo per una migliore leggibilità.
- Impostazioni del contrasto: Regola il contrasto per far risaltare meglio i contenuti, soprattutto per chi ha problemi di vista.
- Font leggibili: I visitatori possono passare a font pensati per una lettura più facile, come Atkinson Hyperlegible e OpenDyslexic.
- Profili (piano Standard): Preimpostazioni attivabili con un clic per Ipovisione, Epilessia e convulsioni, Disabilità motorie, Dislessia, Disturbi cognitivi e dell’apprendimento, ADHD, Screen reader e Daltonismo. Cambiano ciò che vede il visitatore, non il codice del tuo sito.
- Dimensioni e stile del testo: Ingrandisce o adatta il testo in modo da renderlo più leggibile senza richiedere il ricaricamento della pagina.
- Contrasto: Applica modifiche ai colori dello sfondo e del testo per migliorare la visibilità degli utenti daltonici o ipovedenti.
- Controllo dinamico dei contenuti: Per gli utenti che potrebbero essere sensibili alle animazioni o ai contenuti lampeggianti, il widget offre la possibilità di disattivare le animazioni o modificare il comportamento dei contenuti dinamici. Questa funzione è particolarmente utile per chi soffre di patologie come l’epilessia.
- Struttura della pagina: Una scheda che elenca intestazioni, landmark e link della pagina, così i visitatori possono andare dritti alla parte che cercano. Inoltre, con Alt+0 si apre o si chiude il pannello e con Alt+9 si sospendono o si ripristinano le regolazioni.
- Testo alternativo IA e landmark: Il widget aggiunge il testo alternativo alle immagini e rileva intestazioni e landmark mentre i visitatori navigano, entro i limiti mensili del tuo piano. Così aiuta chi usa gli screen reader.
- Conveniente e accessibile: Le impostazioni di accessibilità sono sempre facilmente accessibili, con il widget che rimane in una posizione fissa sul sito, consentendo agli utenti di apportare modifiche ogni volta che ne hanno bisogno.
Con l’Accessibility Widget di iubenda puoi migliorare l’accessibilità del tuo sito web e offrire un’esperienza migliore e più inclusiva a tutti gli utenti.