Accessibilità: creare un modulo Wix accessibile
Tempo di lettura: 4 min.
I moduli consentono ai visitatori del sito di inviare informazioni, iscriversi a una mailing list e altro ancora. Quando crei un modulo, è importante tenerne presente l'accessibilità per garantire che tutti possano visualizzarlo e utilizzarlo.
Segui i passaggi in questo articolo per creare un modulo con cui i visitatori possono navigare, interagire e ottenere il massimo dal tuo sito.
Passaggio 1 | Mostra i titoli dei campi
Mostra i titoli dei campi per consentire ai visitatori di identificare ogni campo del modulo. La visualizzazione dei titoli fornisce chiarezza e indica ai visitatori il campo in cui si trovano attualmente.
Per visualizzare i titoli dei campi:
- Seleziona il modulo nell'Editor
- Clicca su Modifica modulo
- Seleziona un campo modulo
- Clicca su Impostazioni
- Passa il mouse sul titolo del campo e clicca sull'icona Altre azioni
- Clicca su Mostra titolo del campo
![I moduli sono al centro. È stato selezionato un campo e il mouse sta cliccando su](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2024/06/06/704b585c-e85a-42a3-a4f6-4918fc22ea7d/de509bb7-f65c-4ee0-9aa6-8c945a368eb3.jpg)
Passaggio 2 | Definisci i titoli dei campi
Dopo aver abilitato i titoli dei campi, assicurati di definirli chiaramente. Il titolo dovrebbe essere specifico per garantire che i visitatori sappiano esattamente cosa è richiesto (cognome, numero di telefono, ecc.).
Per definire i titoli dei campi:
- Seleziona il modulo nell'Editor
- Clicca su Modifica modulo
- Seleziona un campo modulo
- Clicca su Impostazioni
- Inserisci il testo sotto Titolo del campo
- Clicca su Salva
![I moduli sono al centro. È stato selezionato un campo e il mouse sta cliccando sul campo del titolo](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2024/06/06/b0c417e6-adb2-4bbb-9ac2-2d4990c1374b/83955b53-2aba-47eb-9a01-33be5f0f8066.jpg)
Passaggio 3 | Personalizza il design del modulo
Modificare i campi e tasti del modulo per stato (Normale, Passaggio del mouse ed Errore) può creare un'esperienza visiva logica. Ad esempio, ti consigliamo di personalizzare il design per lo stato Passaggio del mouse, in modo che i visitatori sappiano con quale parte del modulo stanno interagendo.
Lo sapevi che:
Lo stato Passaggio del mouse è l'aspetto del campo/tasto del modulo quando un visitatore passa il mouse su di esso. Lo stato Normale è il modo in cui viene visualizzato prima che un visitatore interagisca con esso.
Per personalizzare il design del modulo:
- Seleziona il modulo nell'Editor
- Clicca su Impostazioni
- Seleziona Design
- Scegli quale parte del modulo vuoi personalizzare:
- Campi:
- Seleziona Campi del modulo
- Seleziona Passaggio del mouse dal menu a tendina
- Modifica il design del campo:
- Colore e opacità: imposta il colore dello sfondo del campo e trascina il cursore per modificare l'opacità
- Colore e opacità bordo: imposta il colore e l'opacità del bordo del campo
- Tasti:
- Seleziona Tasti
- Seleziona il tasto che vuoi personalizzare (Invio, Indietro, Caricamento, ecc.)
- Clicca sulla scheda Passaggio del mouse
- Modifica il design del tasto:
- Colore testo: imposta il colore del testo del tasto nello stato al passaggio del mouse
- Colore e opacità: imposta il colore dello sfondo del tasto e trascina il cursore per modificare l'opacità
- Colore e opacità bordo: imposta il colore e l'opacità del bordo del tasto
- Campi:
![Il pannello di design del campo modulo è aperto. Lo stato Passaggio del mouse è stato selezionato e il mouse sta cliccando sulla casella del colore](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/651c25b0-2d60-43c8-addf-1df2fd575568/2024/06/07/f9359600-cb03-4d29-bbce-67dba5e29d86/8b155fad-596d-41c2-8d1b-ef00a834a912.jpg)
Suggerimenti:
- Dovresti anche personalizzare i campi del modulo nello stato Errore per garantire una migliore accessibilità
- Scopri di più sui colori e il contrasto nell'accessibilità del sito
Passaggio 4 | Abilita gli indicatori visivi sul tuo sito
Gli indicatori visivi possono aiutare le persone con diverse esigenze visive/mobilità a navigare nel tuo sito. Quando li abiliti, i visitatori che utilizzano il tasto Tab possono vedere un riquadro blu attorno alla sezione o all'elemento in cui si trovano. Scopri di più sugli indicatori visivi.
Gli indicatori visivi vengono abilitati automaticamente sui siti creati nell'Editor Studio.
Per abilitare gli indicatori visivi:
- Seleziona Impostazioni nella barra superiore dell'Editor Wix
- Seleziona Wizard accessibilità
- Seleziona l'icona Altre azioni in alto a destra del Wizard
- Seleziona Impostazioni avanzate per l'accessibilità
- Seleziona Indicatori visivi
- Abilita l'interruttore Consenti alle persone che utilizzano la tastiera di navigare sul tuo sito
![L'interruttore degli indicatori visivi è stato abilitato nelle impostazioni avanzate del Wizard accessibilità](https://d2x3xhvgiqkx42.cloudfront.net/12345678-1234-1234-1234-1234567890ab/8696077d-830a-4b1e-bd86-9df98f89994a/2021/07/22/451e930b-a31a-4d26-915c-95ff0c2c53a4/f00095b7-c375-43b5-aaba-479698334c3f.png)
Prossimo passo:
Torna alla Checklist per l'accessibilità per continuare a migliorare l'accessibilità del tuo sito.