Migliorare l'usabilità del sito per le persone con disabilità.

Puoi personalizzare molti aspetti del tuo sito per renderlo più accessibile e facile da navigare per tutti i visitatori, compresi quelli con disabilità o che utilizzano screen reader e altre tecnologie assistive.

Utilizza questa guida per scoprire le procedure consigliate per progettare e strutturare i tuoi contenuti.

Prova anche: Rendi accessibile il tuo sito con funzionalità integrate

Nota: questa guida è una risorsa, ma non rappresenta una consulenza legale. Squarespace non fornisce consigli su leggi o standard sull'accessibilità specifici applicabili al tuo sito o alla tua attività, come indicato nei nostri Termini di Servizio.

Layout

Creare un sito web con un layout e un design chiari è utile per rispondere alle esigenze delle persone ipovedenti o con disabilità cognitive. Tuttavia, un layout semplice e coerente può essere utile anche ai visitatori che non hanno dimestichezza con il computer o che accedono al sito da un dispositivo con uno schermo più piccolo, come quello di un dispositivo mobile. Le diverse parti del sito web, come menu di navigazione, link e sezioni di testo, devono essere facilmente identificabili.

Navigazione da tastiera

Alcuni visitatori potrebbero utilizzare la tastiera per navigare nel sito anziché il mouse. L'accessibilità della tastiera è importante anche per alcune tecnologie assistive come il riconoscimento vocale e gli screen reader. Potresti prendere in considerazione l'idea di testare l'accessibilità del tuo sito provando a navigare solo con la tastiera.

Personalizzare il contorno dell'elemento da mettere in primo piano

Quando i visitatori navigano sul tuo sito premendo il tasto Tab, un contorno focus evidenzia automaticamente gli elementi interattivi della pagina, come i link di navigazione e i campi modulo.

Premendo Tab per la prima volta si apre un link Passa al contenuto. Premi la barra spaziatrice per saltare l’intestazione del sito e passare direttamente al contenuto principale, oppure premi di nuovo Tab per passare agli altri elementi della pagina. Non puoi personalizzare il colore o lo spessore del contorno del focus. 

Per assicurarti che il contorno del focus funzioni come previsto, aggiorna il browser all'ultima versione.

Scelte rapide da tastiera di Squarespace

Scopri quali sono le scelte rapide da tastiera che puoi utilizzare per la gestione e la modifica del tuo sito.

Editor fluido

Nel modificare le sezioni dell'Editor fluido, tieni a mente le nostre procedure consigliate:

• Se si verifica una sovrapposizione di blocchi, assicurati che il contenuto di tutti i blocchi sia ancora visibile e utilizzabile dai visitatori.
• Pensa a come i diversi elementi a blocco potrebbero interagire. Ad esempio, se hai un blocco modulo, sarebbe preferibile non inserire un blocco pulsante sopra di esso, perché i visitatori potrebbero non essere sicuri di quale sia il pulsante per l'invio del modulo.
• Se inserisci del testo sopra altri tipi di contenuto, assicurati che sia leggibile. Ciò potrebbe significare aggiungere uno sfondo colorato a un blocco, cambiare il colore del testo in modo che risalti su un'immagine o spostare il testo in un punto in cui sia ancora leggibile.

Linguaggio chiaro e conciso

Quando si creano i contenuti di un sito, è importante considerare l'accessibilità. Questo include il linguaggio utilizzato, la struttura del testo e il modo in cui si organizzano i contenuti del sito. Un testo ben organizzato, breve e chiaro è utile per tutti i visitatori, soprattutto per quelli con disabilità.

Quando scrivi il testo per il tuo sito, prendi in considerazione questi suggerimenti:

• Utilizza un linguaggio e una formattazione chiari.
• Scrivi frasi e paragrafi concisi.
• Evita di usare gergo tecnico e parole o frasi inutilmente complesse.
• Espandi gli acronimi al primo utilizzo. Ad esempio, Dominio di Primo Livello (TLD).
• Utilizza gli elenchi puntati quando è opportuno.
• Prova a utilizzare immagini, video, e audio per aiutare a chiarire il significato.

Titoli

La prima cosa che gli screen reader comunicano quando i visitatori accedono a una nuova pagina web è il titolo. Se la pagina ha un titolo SEO, gli screen reader lo leggeranno e ignoreranno il titolo della pagina. Se una pagina non ha un titolo SEO, gli screen reader leggono il titolo della pagina.

Fornire un titolo di pagina breve, specifico e unico aiuta gli utenti che navigano tramite tecnologie assistive a comprendere rapidamente il contenuto e lo scopo di una pagina web.

Procedure ottimali per i titoli

Quando scrivi i titoli, tieni a mente quanto segue:

• Presenta l'argomento e lo scopo della pagina.
• Il titolo di ogni pagina deve essere univoco e differenziare la pagina dalle altre pagine del sito.
• Metti al primo posto le informazioni uniche e più rilevanti. Ad esempio, "Guida all'accessibilità" invece di "Una guida a riguardo dell'accessibilità".

Testo

Intestazioni

Gli screen reader utilizzano il codice HTML anziché elementi visivi per comprendere la struttura di una pagina. I visitatori che utilizzano uno screen reader possono navigare più facilmente tra le pagine quando ogni sezione della pagina ha un'intestazione. I motori di ricerca utilizzano anche le intestazioni per comprendere meglio i contenuti, quindi le intestazioni sono un ottimo modo per dare al tuo sito una spinta nella SEO.

Per maggiori informazioni sulla struttura delle pagine e sulle intestazioni, visita Web Accessibility Initiative.

Elenchi

Organizza il layout del tuo testo utilizzando elenchi e intestazioni. L'utilizzo di elenchi è utile per mostrare la relazione tra elementi di contenuto, come un gruppo di link o una serie di esempi. La formattazione del testo utilizzando elenchi:

• Semplifica la navigazione tra i tuoi contenuti.
• Aiuta i visitatori con disabilità cognitive a comprendere i contenuti.

Link

Descrivi chiaramente lo scopo di ciascun link nel testo del link, in modo che i visitatori che utilizzano la tecnologia assistiva possano passare da un link all'altro senza perdere il contesto. Formattare correttamente i link contribuisce anche a migliorare la SEO. Non è necessario includere la parola "link" nel testo del link. La maggior parte degli screen reader annuncia "link" quando ne trova uno.

Ad esempio:

Spaziatura

Assicurati che il testo abbia un'interlinea adeguata. In questo modo, i visitatori possono regolarla in base alle loro esigenze per migliorare l'esperienza di lettura, se necessario. Puoi controllare la spaziatura tra lettere e l'altezza riga in Stili sito.

Colori

È possibile personalizzare i colori del sito utilizzando Stili sito. Tuttavia, evita di affidarti esclusivamente al colore per trasmettere informazioni ai tuoi visitatori. È possibile che le differenze di colore vengano ignorate dalle persone ipovedenti o affette da alterazioni del senso cromatico (discromatopsia). Inoltre, il colore da solo non trasmette il significato ai visitatori non vedenti che utilizzano gli screen reader.

Puoi utilizzare gli Strumenti per sviluppatori di Google Chrome o l'Accessibility Inspector di Firefox per simulare il modo in cui le tue pagine appaiono agli utenti con le più comuni anomalie della percezione cromatica.

Nota: questi sono strumenti di terze parti che non rientrano nell'ambito dell'assistenza Squarespace.

Moduli

I moduli possono rappresentare una sfida per alcuni visitatori. È importante assicurarsi che ogni campo sia chiaramente etichettato e che il modulo sia facile da navigare. Utilizza un blocco di testo per includere brevi istruzioni che informino i visitatori esattamente su ciò che devono sapere per completare correttamente il modulo.

È possibile includere dei segnaposto con il testo che appare nei campi del modulo come esempio per i visitatori. In questo modo, i visitatori avranno un'idea più precisa di come devono compilarlo. Tieni presente che il testo segnaposto non deve sostituire il testo dell'etichetta. Per maggiori informazioni sul testo segnaposto, puoi consultare il nostro forum.