Caselle

Nota

Questa guida alla progettazione è stata creata per Windows 7 e non è stata aggiornata per le versioni più recenti di Windows. Gran parte delle linee guida si applica ancora in linea di principio, ma la presentazione e gli esempi non riflettono le linee guida di progettazione correnti.

Con una casella di controllo, gli utenti fanno una decisione tra due scelte chiaramente opposte. L'etichetta della casella di controllo indica lo stato selezionato, mentre il significato dello stato cancellato deve essere l'opposto non ambiguo dello stato selezionato. Di conseguenza, le caselle di controllo devono essere utilizzate solo per attivare o disattivare un'opzione o per selezionare o deselezionare un elemento.

Gruppo tipico di caselle di controllo.

Nota

Le linee guida relative al layout vengono presentate in un articolo separato.

È il controllo giusto?

Per decidere, prendi in considerazione queste domande:

• La casella di controllo viene utilizzata per attivare o disattivare un'opzione o selezionare o deselezionare un elemento? Se non è così, usa un altro controllo.

• Gli stati selezionati e cancellati sono chiari e non ambigui? In caso contrario, usare pulsanti di opzione o un elenco a discesa in modo da poter etichettare gli stati in modo indipendente.

• Se usato in un gruppo, il gruppo comprende scelte indipendenti, da cui gli utenti possono scegliere zero o più? In caso contrario, prendere in considerazione i controlli per le scelte dipendenti, ad esempio pulsanti di opzione e visualizzazioni albero casella di controllo.

• Se usato in un gruppo, il gruppo comprende scelte dipendenti, da cui gli utenti devono scegliere uno o più? In tal caso, usare un gruppo di caselle di controllo e gestire l'errore quando non sono selezionate nessuna delle opzioni.

• Il numero di opzioni in un gruppo è 10 o meno? Poiché lo spazio dello schermo usato è proporzionale al numero di opzioni, mantenere il numero di caselle di controllo su 10 o meno. Per più di 10 opzioni, usare un elenco di caselle di controllo.

• Un pulsante di opzione è una scelta migliore? Se le caselle di controllo sono adatte solo per attivare o disattivare un'opzione, i pulsanti di opzione possono essere usati per opzioni completamente diverse. Se entrambe le soluzioni sono possibili:

  • Usa pulsanti di opzione se il significato della casella di controllo deselezionata non è completamente ovvio.

    Non corretto:

    

    In questo esempio la scelta opposta da Orizzontale non è chiara, quindi la casella di controllo non è una scelta ottimale.

    Corretto:

    

    In questo esempio, le scelte non sono opposte, quindi i pulsanti di opzione sono la scelta migliore.

  • Utilizzare pulsanti di opzione nelle pagine della procedura guidata per rendere chiare le alternative, anche se una casella di controllo è altrimenti accettabile.

  • Usare i pulsanti di opzione se lo spazio sullo schermo è sufficiente e le opzioni sono sufficienti per essere un buon uso dello spazio dello schermo. In caso contrario, utilizzare una casella di controllo o un elenco a discesa.

    Non corretto:

    

    In questo esempio le opzioni non sono sufficienti per usare i pulsanti di opzione.

    Corretto:

    

    In questo esempio, una casella di controllo è un uso efficiente dello spazio sullo schermo per questa opzione periferica.

• Utilizzare una casella di controllo se nella finestra sono presenti altre caselle di controllo.

• L'opzione presenta un'opzione di programma, anziché i dati? I valori dell'opzione non devono essere basati sul contesto o su altri dati. Per i dati, usare un elenco di caselle di controllo o un elenco di selezione multipla.

Modelli di utilizzo

Le caselle di controllo hanno diversi modelli di utilizzo:

Utilizzo	Esempio
Una scelta individuale Una singola casella di controllo viene usata per selezionare una singola scelta.	Per una singola scelta viene usata una singola casella di controllo.
Scelte indipendenti (zero o più) Un gruppo di caselle di controllo viene usato per selezionare da un set di zero o più opzioni.	a differenza dei controlli a selezione singola, ad esempio pulsanti di opzione, gli utenti possono selezionare qualsiasi combinazione di opzioni in un gruppo di caselle di controllo. Per le scelte indipendenti viene utilizzato un gruppo di caselle di controllo.
Scelte dipendenti (una o più) È anche possibile utilizzare un gruppo di caselle di controllo per selezionare da un set di una o più opzioni.	potrebbe essere necessario rappresentare una selezione di una o più scelte dipendenti. poiché microsoft?windows non dispone di un controllo che supporta direttamente questo tipo di input, la soluzione migliore consiste nell'usare un gruppo di caselle di controllo e gestire l'errore quando nessuna delle opzioni è selezionata. Viene utilizzato un gruppo di caselle di controllo in cui è necessario selezionare almeno un protocollo.
Scelta mista Oltre agli stati selezionati e deselezionati, anche le caselle di controllo hanno uno stato misto per la selezione multipla per indicare che l'opzione è impostata per alcuni oggetti, ma non per tutti.	Casella di controllo con stato misto.

Indicazioni

Generale

• Caselle di controllo correlate al gruppo. Combinare le opzioni correlate e separare le opzioni non correlate in gruppi di 10 o meno, usando più gruppi, se necessario.

  

  Esempio di gruppi di opzioni correlate e indipendenti.

• Riconsiderare l'uso di caselle di gruppo per organizzare i gruppi di caselle di controllo , questo spesso comporta un disordine dello schermo non necessario.

• Le caselle di controllo elenco in un ordine logico, ad esempio il raggruppamento di opzioni altamente correlate o l'inserimento delle opzioni più comuni, o dopo un'altra progressione naturale. L'ordinamento alfabetico non è consigliato perché dipende dalla lingua e pertanto non localizzabile.

• Allineare le caselle di controllo verticalmente, non orizzontalmente. L'allineamento orizzontale è più difficile da leggere.

  Corretto:

  

  In questo esempio le caselle di controllo sono allineate correttamente.

  Non corretto:

  

  In questo esempio l'allineamento orizzontale è più difficile da leggere.

• Non usare lo stato misto per rappresentare un terzo stato. Lo stato misto viene usato per indicare che un'opzione è impostata per alcuni oggetti figlio, ma non per tutti. Gli utenti non devono essere in grado di impostare uno stato misto direttamente, ma lo stato misto è una reflection degli oggetti figlio. Lo stato misto non viene usato come terzo stato per un singolo elemento. Per rappresentare un terzo stato, usare invece pulsanti di opzione o un elenco a discesa.

  Non corretto:

  

  In questo esempio, lo stato misto dovrebbe indicare che il servizio Tema non è installato.

  Corretto:

  

  In questo esempio, gli utenti possono scegliere da un elenco di tre opzioni chiare.

• Se si fa clic su una casella di controllo con stato misto, è necessario scorrere tutti gli stati selezionati, tutti deselezionati e gli stati misti originali. Per il perdono, è importante essere in grado di ripristinare lo stato misto originale perché le impostazioni potrebbero essere complesse o sconosciute all'utente. In caso contrario, l'unico modo per ripristinare lo stato misto con fiducia consiste nell'annullare l'attività e ricominciare.

• Non usare le caselle di controllo come indicatore di stato. Usare invece un controllo indicatore di stato .

  Non corretto:

  

  In questo esempio le caselle di controllo vengono usate in modo errato come indicatore di stato.

  Corretto:

  

  Esempio di una tipica barra di stato.

• Visualizzare le caselle di controllo disabilitate usando lo stato di selezione corretto. Anche se gli utenti non possono modificarli, le caselle di controllo disabilitate forniscono informazioni in modo che siano coerenti con i risultati.

  Non corretto:

  

  In questo esempio l'opzione "Legge sempre questa sezione ad alta voce" deve essere cancellata perché la sezione non viene letta quando l'opzione è disabilitata.

• Non usare la selezione di una casella di controllo per:

  • Eseguire comandi.
  • Visualizzare altre finestre, ad esempio una finestra di dialogo per raccogliere più input.
  • Visualizzare dinamicamente altri controlli correlati al controllo selezionato (le utilità di lettura dello schermo non possono rilevare tali eventi).

Non visualizzare di nuovo questo <elemento>

• Prendere in considerazione l'uso di un'opzione Non mostrare di nuovo questo <elemento> per consentire agli utenti di eliminare una finestra di dialogo ricorrente solo se non esiste un'alternativa migliore. Provare a determinare in anticipo se gli utenti necessitano realmente della finestra di dialogo; se lo fanno, visualizzare sempre la finestra di dialogo e, se non lo fanno, eliminare la finestra di dialogo.

Per altre linee guida ed esempi, vedere Finestre di dialogo.

Controlli subordinati

• Posizionare i controlli subordinati a destra o sotto (rientro, scaricamento con l'etichetta della casella di controllo) la casella di controllo e la relativa etichetta. Terminare l'etichetta della casella di controllo con due punti.

  

  In questo esempio, la casella di controllo e il relativo controllo subordinato condividono l'etichetta della casella di controllo e la relativa chiave di accesso.

• Lasciare le caselle di testo modificabili dipendenti e gli elenchi a discesa abilitati se condividono l'etichetta della casella di controllo. Quando gli utenti digitano o incollare qualsiasi elemento nella casella, selezionare automaticamente l'opzione corrispondente. In questo modo si semplifica l'interazione.

  

  In questo esempio immettere un'intestazione o un piè di pagina seleziona automaticamente l'opzione .

• Se si annidano caselle di controllo con pulsanti di opzione o altre caselle di controllo, disabilitare questi controlli subordinati fino a quando non viene selezionata l'opzione di alto livello. In questo modo si evita confusione sul significato dei controlli subordinati.

• Effettuare controlli subordinati a una casella di controllo contigua con la casella di controllo nell'ordine di tabulazioni.

• Se si seleziona un'opzione si implica la selezione delle caselle di controllo subordinate, selezionare in modo esplicito le caselle di controllo per cancellare la relazione.

  Non corretto:

  

  In questo esempio le caselle di controllo subordinate non sono selezionate.

  Corretto:

  

  In questo esempio vengono selezionate le caselle di controllo subordinate, rendendo deselezionata la relazione con l'opzione selezionata.

• Usare le caselle di controllo dipendenti se le alternative aggiungono complessità non necessaria. Anche se le caselle di controllo devono essere opzioni indipendenti, talvolta alternative come i pulsanti di opzione aggiungono complessità non necessaria.

  Corretto:

  

  In questo esempio l'uso dei pulsanti di opzione è accurato, ma crea complessità non necessaria.

  Meglio:

  

  In questo esempio l'uso delle caselle di controllo è più semplice e consente agli utenti di concentrarsi sulla selezione delle opzioni desiderate anziché sulla relazione complessa.

  Importante: applicare questa linea guida solo in circostanze estremamente rare, quando mostra le dipendenze aggiunge complessità significativa senza aggiungere chiarezza. Nell'esempio precedente, è improbabile che gli utenti tentino di scegliere sia il superscript che il sottoscript, e se lo hanno fatto, sarebbe facile capire che erano opzioni esclusive.

Valori predefiniti

• Se una casella di controllo è per un'opzione utente, impostare la sicurezza (per evitare la perdita di dati o accesso al sistema), lo stato più sicuro e privato per impostazione predefinita. Se la sicurezza e la sicurezza non sono fattori, selezionare il valore più probabile o pratico.

Dimensioni e spaziatura consigliate

Dimensioni consigliate e spaziatura per le caselle di controllo.

Etichette

Etichette casella di controllo

• Etichettare ogni casella di controllo.

• Assegnare una chiave di accesso univoca a ogni etichetta. Per linee guida, vedere Tastiera.

• Usare la maiuscola in stile frase.

• Scrivere l'etichetta come frase o una frase imperativa e non usare punteggiatura finale.

  • Eccezione: Se un'etichetta di casella di controllo etichetta anche un controllo subordinato che lo segue, terminare l'etichetta con due punti.

• Scrivere l'etichetta in modo da descrivere lo stato selezionato della casella di controllo.

• Per un gruppo di caselle di controllo, usare la frase parallela e provare a mantenere la lunghezza uguale per tutte le etichette.

• Per un gruppo di caselle di controllo, concentrarsi sul testo dell'etichetta sulle differenze tra le opzioni. Se tutte le opzioni hanno lo stesso testo introduttivo, spostare il testo nell'etichetta di gruppo.

• Usare la formulazione positiva. Non frasere un'etichetta in modo che la selezione di una casella di controllo significa non eseguire un'azione.

  • Eccezione:Non visualizzare di nuovo questa <casella> di controllo.

  Non corretto:

  

  In questo esempio l'opzione non usa la formulazione positiva.

• Descrivere solo l'opzione con l'etichetta. Tenere breve le etichette in modo che sia facile fare riferimento a loro nei messaggi e nella documentazione. Se l'opzione richiede ulteriori spiegazioni, fornire la spiegazione in un controllo testo statico usando frasi complete e punteggiatura finale.

  Nota

  L'aggiunta di una spiegazione a una casella di controllo in un gruppo non significa che è necessario fornire spiegazioni per tutte le caselle di controllo nel gruppo. Specificare le informazioni pertinenti nell'etichetta se è possibile e usare le spiegazioni solo quando necessario. Non riassegnare semplicemente l'etichetta per la coerenza.

  

  In questo esempio, un'etichetta di casella di controllo include un testo esplicativo aggiuntivo sotto di esso.

• Se un'opzione è fortemente consigliata, è consigliabile aggiungere "(consigliato)" all'etichetta. Assicurarsi di aggiungere all'etichetta di controllo, non le note supplementari.

• Se è necessario usare etichette a più righe, allineare la parte superiore dell'etichetta con la casella di controllo.

• Non usare un controllo subordinato, i valori contenuti o l'etichetta delle unità per creare una frase o una frase. Tale progettazione non è localizzabile perché la struttura delle frasi varia con la lingua.

  Non corretto:

  

  In questo esempio la casella di testo viene inserita in modo errato all'interno dell'etichetta della casella di controllo.

Etichette di gruppo casella di controllo

• Usare l'etichetta del gruppo per spiegare lo scopo del gruppo, non come effettuare la selezione. Si supponga che gli utenti sappiano usare le caselle di controllo. Ad esempio, non dire "Selezionare una delle opzioni seguenti".

• Terminare ogni etichetta con due punti.

• Non assegnare una chiave di accesso all'etichetta. In questo modo non è necessario e rende più difficile assegnare le altre chiavi di accesso.

• Per una selezione di una o più scelte dipendenti, spiegare il requisito sull'etichetta.

  Corretto:

  

  In questo esempio, gli utenti potrebbero pensare che possano effettuare una sola selezione.

  Meglio:

  

  In questo esempio è chiaro che gli utenti possono effettuare più selezioni.

Documentazione

Quando si fa riferimento alle caselle di controllo:

• Usare il testo dell'etichetta esatta, inclusa la maiuscola, ma non includere il carattere di sottolineatura o i due punti di accesso. Includere la casella di controllo della parola.

• Fare riferimento a una casella di controllo come casella di controllo, non opzione, casella di controllo o semplicemente casella, perché la casella da sola è ambigua per i localizzatori.

• Per descrivere l'interazione dell'utente, usare selezionare e cancellare.

• Se possibile, formattare l'etichetta usando il testo grassetto. In caso contrario, inserire l'etichetta tra virgolette solo se necessario per evitare confusione.

  Esempio: selezionare la casella di controllo Sottolineatura .