Visualizzazioni elenco

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 correnti sulla progettazione.

Con una visualizzazione elenco, gli utenti possono visualizzare e interagire con una raccolta di oggetti dati, usando una selezione singola o più selezioni.

Visualizzazione elenco tipica.

Le visualizzazioni elenco hanno maggiore flessibilità e funzionalità rispetto alle caselle di riepilogo. A differenza delle caselle di riepilogo, supportano la modifica delle visualizzazioni, il raggruppamento, il raggruppamento di più colonne con intestazioni, l'ordinamento delle colonne, la modifica della larghezza e l'ordine delle colonne, la presenza di un'origine di trascinamento o una destinazione di rilascio e la copia dei dati negli Appunti.

Nota

Le linee guida relative al layout e alle caselle di riepilogo vengono presentate in articoli separati.

È il controllo giusto?

Una visualizzazione elenco è più che una casella di riepilogo più flessibile e funzionale: la funzionalità aggiuntiva comporta un utilizzo diverso. Nella tabella seguente viene illustrato il confronto.

Utilizzo	Caselle di riepilogo	Visualizzazioni elenco
Tipo di dati	Sia i dati che le opzioni del programma.	Solo dati.
Contents	Solo etichette.	Etichette e dati ausiliari, possibilmente in più colonne.
Interazione	Usato per effettuare selezioni.	Può essere usato per effettuare selezioni, ma spesso usato per visualizzare e interagire con i dati. Può essere un'origine di trascinamento o una destinazione di rilascio.
Presentazione	Fisso.	Gli utenti possono modificare visualizzazioni, gruppi, ordinare per colonne e modificare le larghezze e l'ordine delle colonne.

Per decidere se si tratta del controllo corretto, prendere in considerazione queste domande:

• L'elenco presenta i dati anziché le opzioni di programma? In caso contrario, prendere in considerazione l'uso di una casella di riepilogo.
• Gli utenti devono modificare visualizzazioni, raggruppare, ordinare per colonne o modificare le larghezze e l'ordine delle colonne? In caso contrario, usare invece una casella di riepilogo.
• Il controllo deve essere un'origine di trascinamento o una destinazione di rilascio? In tal caso, usare una visualizzazione elenco.
• Gli elementi dell'elenco devono essere copiati negli Appunti o incollati? In tal caso, usare una visualizzazione elenco.

Visualizzazioni elenco casella di controllo

• Il controllo viene usato per scegliere zero o più elementi da un elenco di dati? Per scegliere un elemento, usare invece una selezione singola.
• La selezione multipla è essenziale per l'attività o comunemente usata? In tal caso, usare una visualizzazione elenco casella di controllo per rendere ovvia la selezione multipla, soprattutto se gli utenti di destinazione non sono avanzati. In caso contrario, usare una visualizzazione elenco a più selezioni standard se le caselle di controllo disegnerebbero troppo attenzione a più selezioni o comportano un numero eccessivo di schermate.
• La stabilità della selezione multipla è importante? In tal caso, usare un elenco di caselle di controllo, un generatore di elenchi o un elenco di aggiunta/rimozione perché facendo clic su modifica solo un singolo elemento alla volta. Con un elenco di selezione multipla standard, è molto facile cancellare tutte le selezioni anche per caso.

Nota

A volte un controllo simile a una visualizzazione elenco viene implementato usando una casella di riepilogo e viceversa. In questi casi, applicare le linee guida in base all'utilizzo, non all'implementazione.

Modelli di utilizzo

Tutte le visualizzazioni supportano una selezione singola, in cui gli utenti possono selezionare un solo elemento alla volta e più selezioni, in cui gli utenti possono selezionare qualsiasi numero di elementi, inclusi nessuno. Le visualizzazioni elenco supportano la modalità di selezione estesa, in cui la selezione può essere estesa trascinando o con MAIUSC+clic o ctrl+clic per selezionare gruppi di valori contigui o non adiacenti rispettivamente. A differenza delle caselle di riepilogo, non supportano la modalità di selezione multipla, in cui facendo clic su qualsiasi elemento attiva lo stato di selezione indipendentemente dai tasti MAIUSC e CTRL.

Visualizzazione elenco standard

Il controllo visualizzazione elenco supporta cinque visualizzazioni standard:

Utilizzo	Esempio
Tile ogni elemento viene visualizzato come icona media, con un'etichetta e dettagli facoltativi a destra.	La visualizzazione riquadro mostra icone medie con etichette e dettagli facoltativi a destra.
Icona grande ogni elemento viene visualizzato come icona extra grande, grande o media con un'etichetta sotto di esso.	La visualizzazione Icona grande mostra ogni elemento come icona di grandi dimensioni con un'etichetta sotto di esso.
Icona piccola ogni elemento viene visualizzato come icona piccola con un'etichetta a destra.	Visualizzazione icona piccola mostra ogni elemento come icona piccola con la relativa etichetta a destra.
Elenco ogni elemento viene visualizzato come icona piccola con un'etichetta a destra.	in modalità elenco, questa visualizzazione ordina gli elementi nelle colonne e usa una barra di scorrimento orizzontale. al contrario, le modalità di visualizzazione icona ordinano gli elementi nelle righe e usano una barra di scorrimento verticale. La modalità elenco mostra ogni elemento come icona piccola con l'etichetta a destra.
Dettagli ogni elemento viene visualizzato come riga in formato tabulare. la colonna più a sinistra contiene sia l'icona facoltativa dell'elemento che l'etichetta e le colonne successive contengono informazioni aggiuntive, ad esempio le proprietà dell'elemento.	inoltre, le colonne possono essere aggiunte o rimosse e riordinate e ridimensionate. le righe possono essere raggruppate, ordinate in base alla colonna. La visualizzazione dettagli mostra ogni elemento come riga in formato tabella.

Varianti di visualizzazione elenco

Etichetta	Valore
Selezione colonne Le visualizzazioni elenco a volte hanno così tante colonne che non è pratico visualizzarli tutti. In questo caso, l'approccio migliore consiste nel visualizzare le colonne più utili per impostazione predefinita e consentire agli utenti di aggiungere o rimuovere colonne in base alle esigenze.	Facendo clic con il pulsante destro del mouse sull'intestazione di colonna viene visualizzato un menu di scelta rapida che consente agli utenti di aggiungere o rimuovere colonne. Facendo clic su Altro nel menu di scelta rapida dell'intestazione di colonna, viene visualizzata la finestra di dialogo Scegli colonne, che consente agli utenti di aggiungere o rimuovere colonne e riordinarle.
Visualizzazione elenco casella di controllo Consentire agli utenti di selezionare più elementi.	Le visualizzazioni elenco di selezione multipla hanno esattamente lo stesso aspetto delle visualizzazioni elenco a selezione singola, quindi non c'è alcun indizio visivo che supportano più selezioni. È possibile usare una visualizzazione elenco casella di controllo per indicare chiaramente che è possibile selezionare più. Di conseguenza, questo modello deve essere usato per le attività in cui la selezione multipla è essenziale o comunemente usata. In questo esempio una visualizzazione Icona piccola usa le caselle di controllo perché la selezione multipla è essenziale per l'attività.
Visualizzare elenchi con gruppi Organizzare i dati in gruppi.	Mentre le visualizzazioni Dettagli supportano spesso l'ordinamento dei dati in base a una qualsiasi delle colonne, le visualizzazioni elenco consentono inoltre agli utenti di organizzare gli elementi in gruppi. Ecco alcuni vantaggi del raggruppamento: I gruppi funzionano in tutte le visualizzazioni (ad eccezione dell'elenco), quindi, ad esempio, gli utenti potrebbero raggruppare una visualizzazione di icone extra large degli album da parte dell'artista. I gruppi possono essere raccolte di alto livello, che spesso sono più significative del raggruppamento diretto dei dati. Ad esempio, Esplora risorse di Windows raggruppa le date in Today, Yesterday, Last week, Earlier this year e A long time ago. In questo esempio, il Centro di benvenuto di Windows mostra gli elementi raggruppati in una visualizzazione elenco.

Indicazioni

Presentazione

• Ordinare le voci di elenco in un ordine logico. Ordina i nomi in ordine alfabetico, numeri in ordine numerico e date in ordine cronologico.

• Se appropriato, consentire agli utenti di modificare l'ordinamento. L'ordinamento degli utenti è importante se l'elenco contiene molti elementi o se sono presenti scenari in cui gli elementi vengono trovati in modo più efficace usando un ordinamento diverso da quello predefinito.

• Usare l'attributo Mostra sempre selezione in modo che gli utenti possano determinare facilmente l'elemento selezionato, anche quando il controllo non ha lo stato attivo.

• Evitare di presentare visualizzazioni elenco vuote. Se gli utenti creano un elenco, inizializzare l'elenco con istruzioni o elementi di esempio che potrebbero essere necessari per gli utenti.

  

  In questo esempio, la visualizzazione Elenco di ricerca presenta inizialmente le istruzioni.

• Se gli utenti possono modificare le visualizzazioni, raggruppare, ordinare in base alle colonne o modificare le colonne e le relative larghezze e ordine, rendere persistenti tali impostazioni in modo che vengano applicate alla successiva visualizzazione elenco. Renderli persistenti in una visualizzazione per elenco, per utente.

Interazione

• Usare un solo clic per selezionare la voce di elenco a cui punta l'utente. Eccezione: per il modello di elenco dei collegamenti ai comandi, il singolo clic seleziona l'elemento e chiude la finestra o passa alla pagina successiva.

• Valutare la possibilità di fornire un comportamento di doppio clic. Facendo doppio clic dovrebbe avere lo stesso effetto della selezione di un elemento e dell'esecuzione del relativo comando predefinito.

• Rendere ridondante il comportamento di doppio clic. Dovrebbe essere sempre presente un pulsante di comando o un comando di menu di scelta rapida con lo stesso effetto.

• Se una voce di elenco richiede una spiegazione più dettagliata, fornire la spiegazione in una descrizioneinformazioni. Usare frasi complete e punteggiatura finale.

  

  In questo esempio viene usata una descrizione informativa per fornire ulteriori informazioni.

• Specificare i menu di scelta rapida dei comandi pertinenti. Tali comandi includono Taglia, Copia, Incolla, Rimuovi o Elimina, Rinomina e Proprietà.

• Se gli utenti possono modificare l'ordinamento e il raggruppamento, specificare i menu di scelta rapida Ordina per e Raggruppa per. Il primo clic su un nome di colonna ordina o raggruppa l'elenco in ordine crescente per tale colonna, il secondo clic ordina o gruppi in ordine decrescente. Usare l'ordine precedente (da un'altra colonna) come chiave secondaria.

  

  In questo esempio il menu di scelta rapida Ordina per modifica l'ordinamento. Fare clic su Nome dopo l'ordinamento in base al nome in ordine crescente. Facendo di nuovo clic su Nome viene ordinato in base al nome in ordine decrescente.

• Rendere accessibile l'intestazione di colonna della visualizzazione elenco tramite la tastiera.

  • Gli sviluppatori: A tale scopo, impostare lo stato attivo sul controllo intestazione di colonna. Questa funzionalità è una novità di Windows Vista.

• Quando si disabilita una visualizzazione elenco, disabilitare anche le etichette associate e i pulsanti di comando.

• Evitare lo scorrimento orizzontale. La modalità Elenco usa lo scorrimento orizzontale. Questa modalità è in genere la più compatta, ma lo scorrimento orizzontale è in genere più difficile da usare rispetto allo scorrimento verticale. È consigliabile usare invece la visualizzazione Icona piccola se la compattazione non è importante. Tuttavia, la modalità Elenco è una buona scelta quando sono presenti molti elementi ordinati in ordine alfabetico e spazio sullo schermo sufficiente per un controllo wide.

  Accettabile:

  

  In questo esempio viene usata la modalità Elenco perché sono presenti molti elementi e un sacco di spazio disponibile sullo schermo per un controllo wide.

Elenchi di selezione multipla

• Valutare la possibilità di visualizzare il numero di elementi selezionati sotto l'elenco, soprattutto se è probabile che gli utenti selezionino diversi elementi. Queste informazioni non solo offrono feedback utile, ma indicano anche chiaramente che la visualizzazione elenco supporta più selezioni.

  

  In questo esempio il numero di elementi selezionati viene visualizzato sotto l'elenco.

• In alternativa, anziché il numero di elementi selezionati, è possibile assegnare altre metriche di selezione che potrebbero essere più significative, ad esempio le risorse necessarie per le selezioni.

  

  In questo esempio lo spazio su disco necessario per installare i componenti è più significativo del numero di componenti selezionati.

• Per le visualizzazioni elenco delle caselle di controllo, se sono presenti potenzialmente molti elementi e la selezione o la cancellazione di tutti questi elementi è probabile, aggiungere Seleziona tutto e Cancella tutti i pulsanti di comando.

• Usare caselle di controllo con stato misto per indicare la selezione parziale degli elementi in un contenitore. Lo stato misto non viene usato come terzo stato per un singolo elemento.

Modifica delle visualizzazioni

Se gli utenti possono modificare le visualizzazioni:

• Scegliere la visualizzazione più comoda per impostazione predefinita. Le modifiche apportate dagli utenti devono essere rese persistenti in una visualizzazione per elenco, per utente.

• Modificare la visualizzazione usando un pulsante di divisione, un pulsante di menu o un elenco a discesa. Ogni volta che è pratico, usare un pulsante di divisione sulla barra degli strumenti e modificare l'etichetta del pulsante per riflettere la visualizzazione corrente.

  

  In questo esempio viene usato un pulsante di divisione sulla barra degli strumenti per modificare le visualizzazioni.

• Specificare un menu di scelta rapida Visualizza.

  

In questo esempio viene usato un menu di scelta rapida Visualizza per modificare le visualizzazioni.

Visualizzazioni dettagli

• È consigliabile usare la visualizzazione riquadri per migliorare la leggibilità.

  Accettabile:

  

  In questo esempio sono presenti troppi dati e la finestra, l'elenco e le colonne sono troppo piccole, rendendo gli elementi di elenco difficili da leggere.

  Meglio:

  

  In questo esempio la visualizzazione Riquadro visualizza i dati senza troncamento.

• Scegliere le larghezze di colonna predefinite appropriate per i dati più lunghi. Le visualizzazioni elenco troncano automaticamente i dati lunghi con i puntini di sospensione, quindi le larghezze delle colonne sono appropriate se per impostazione predefinita vengono visualizzati pochi puntini di sospensione. Mentre gli utenti possono ridimensionare le colonne, preferisce altre soluzioni:

  • Ridimensionare ogni larghezza di colonna in base ai dati.
  • Ridimensionare la larghezza del controllo in base alle colonne e alle eventuali barre di scorrimento probabili.
  • Se necessario, usare lo scorrimento orizzontale.
  • I dati troncati vengono troncati solo per gli elementi di dimensioni dispari o come ultima risorsa.

  Se i dati di dimensioni normali devono essere troncati per impostazione predefinita, rendere ridimensionabile la finestra e la visualizzazione elenco. Includere un ulteriore 30% (fino al 200% per testo più breve) per qualsiasi testo (ma non numeri) che verrà localizzato.

  Non corretto:

  

  In questo esempio la maggior parte dei dati viene troncata. I numerosi puntini di sospensione indicano chiaramente che la larghezza del controllo e della colonna è troppo piccola per i dati.

  Non corretto:

  

  In questo esempio i dati vengono troncati senza motivo.

• Scegliere un ordine di colonna predefinito appropriato. In genere, ordinare le colonne nel modo seguente:

  • Innanzitutto, il nome dell'elemento o i dati di identificazione.
  • Successivamente, altri dati utili per differenziare le voci di elenco.
  • Successivamente, i dati più utili (preferibilmente brevi o a lunghezza fissa).
  • Successivamente, dati meno utili (preferibili a lunghezza corta o fissa).
  • Ultimi dati a lunghezza variabile, lunga.

  I dati di lunghezza variabile lunghi vengono inseriti nelle ultime colonne per ridurre la necessità di scorrimento orizzontale. All'interno di queste categorie, inserire le informazioni correlate in una sequenza logica.

• Se appropriato, consentire agli utenti di aggiungere e rimuovere colonne, nonché di modificare l'ordine. Per impostazione predefinita, visualizzare le colonne più utili. Questa operazione viene ottenuta con l'attributo Header Drag Drop.

• Scegliere un allineamento appropriato per i dati. Usare le regole seguenti:

  • Allinea a destra numeri, valute e ore.
  • Testo allineato a sinistra, ID (anche se numerico) e date.

• Per le intestazioni di colonna ordinabili, il primo clic su un'intestazione ordina l'elenco in ordine crescente per la colonna, il secondo clic ordina in ordine decrescente. Usare l'ordinamento precedente (da un'altra colonna) come chiave di ordinamento secondaria.

  

  In questo esempio è stata selezionata prima la colonna Name, quindi la colonna Type. Di conseguenza, Il tipo in ordine crescente è la chiave di ordinamento primaria e Name in ordine crescente è quello secondario.

• Usare l'attributo Selezione riga completa in modo che gli utenti possano determinare facilmente gli elementi selezionati in tutte le colonne.

• Non usare un'intestazione di colonna ordinabile a meno che i dati non possano essere ordinati.

• Non usare un'intestazione di colonna se è presente una sola colonna e non è necessario invertire l'ordinamento. Usare invece un'etichetta per identificare i dati.

  Non corretto:

  

  Corretto:

  

  Nell'esempio corretto viene usata un'etichetta anziché un'intestazione di colonna.

Dimensioni e spaziatura consigliate

Dimensioni consigliate e spaziatura per le visualizzazioni elenco.

• Scegliere un'altezza della visualizzazione elenco che visualizza un numero integrale di elementi. Evitare di troncare gli elementi verticalmente.
• Scegliere una dimensione della visualizzazione elenco che elimina lo scorrimento verticale e orizzontale non necessario in tutte le visualizzazioni supportate. Le visualizzazioni elenco devono essere visualizzate tra 3 e 20 elementi. Prendere in considerazione la possibilità di ingrandire leggermente la visualizzazione elenco se si elimina una barra di scorrimento. Gli elenchi con potenzialmente molti elementi devono visualizzare almeno cinque elementi per facilitare lo scorrimento mostrando più elementi alla volta e rendendo la barra di scorrimento più facile da posizionare.
• Se gli utenti possono rendere più grande la visualizzazione elenco, rendere ridimensionabile la visualizzazione elenco e la relativa finestra padre. In questo modo gli utenti possono modificare le dimensioni della visualizzazione elenco in base alle esigenze. Tuttavia, le visualizzazioni elenco ridimensionabili devono essere visualizzate non meno di tre elementi.

Etichette

Etichette di controllo

• Per tutte le visualizzazioni elenco sono necessarie etichette. Scrivere l'etichetta come parola o frase, non come frase, terminando con due punti usando testo statico.

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

• Usare la maiuscola in stile frase.

• Posizionare l'etichetta sopra il controllo e allineare l'etichetta con il bordo sinistro del controllo.

• Per le visualizzazioni elenco a selezione multipla, scrivere l'etichetta che indica chiaramente che è possibile eseguire più selezioni. Le etichette delle visualizzazioni elenco casella di controllo possono essere meno esplicite.

  Corretto:

  

  In questo esempio, l'etichetta indica chiaramente che è possibile eseguire più selezioni.

  Non corretto:

  

  In questo esempio, l'etichetta non fornisce informazioni sulla selezione multipla.

  Accettabile:

  

  In questo esempio, le caselle di controllo indicano chiaramente che è possibile eseguire più selezioni, quindi l'etichetta non deve essere esplicita.

• È possibile specificare unità (secondi, connessioni e così via) tra parentesi dopo l'etichetta.

Etichette intestazioni

• Mantenere brevi le etichette delle intestazioni (tre parole o meno).
• Usare un singolo sostantivo o una frase sostantiva senza punteggiatura finale.
• Usare la maiuscola in stile frase.
• Allineare l'intestazione allo stesso modo dei dati.

Raggruppare le etichette

• Usare le etichette di gruppo seguenti per le raccolte di alto livello:
  • Nomi: usare la prima lettera di intervalli di nomi o lettere.
  • Dimensioni: Non specificato, 0 KB, 0-10 KB, 10-100 KB, 100 KB - 1 MB, 1-16 MB, 16-128 MB
  • Date: Oggi, Ieri, Settimana scorsa, Precedente quest'anno e Molto tempo fa.
• In caso contrario, le etichette di gruppo usano il testo esatto dei dati raggruppati, incluse la maiuscola e la punteggiatura.

Testo dati

• Usare la maiuscola in stile frase.

Testo informativo

• Se è necessario aggiungere testo informativo su una visualizzazione elenco, aggiungerlo sopra l'etichetta. Usare frasi complete con punteggiatura finale.
• Usare la maiuscola in stile frase.
• Informazioni aggiuntive utili ma non necessarie devono essere mantenute brevi. Inserire queste informazioni tra parentesi tra l'etichetta e i due punti o senza parentesi sotto il controllo.

Documentazione

Quando si fa riferimento alle visualizzazioni elenco:

• Usare il testo esatto dell'etichetta, inclusa la relativa maiuscola, ma non includere il carattere di sottolineatura o i due punti della chiave di scelta e includere l'elenco di parole. Non fare riferimento a una casella di riepilogo come casella di riepilogo, visualizzazione elenco o campo.
• Per i dati dell'elenco, usare il testo esatto dei dati, inclusa la relativa maiuscola.
• Fare riferimento alle visualizzazioni elenco come visualizzazioni elenco solo nella programmazione e in altre documentazioni tecniche. Ovunque si usi l'elenco.
• Per descrivere l'interazione dell'utente, usare select per i dati e fare clic per le intestazioni.
• Quando possibile, formattare le opzioni di etichetta e elenco usando il testo in grassetto. In caso contrario, inserire l'etichetta e le opzioni tra virgolette solo se necessario per evitare confusione.

Esempio: nell'elenco Programmi e servizi selezionare Condivisione file e stampanti.

Quando si fa riferimento alle caselle di controllo in una visualizzazione elenco:

• Usare il testo esatto dell'etichetta, inclusa la relativa maiuscola, e includere la casella di controllo parola. Non includere il carattere di sottolineatura del tasto di scelta.
• Per descrivere l'interazione dell'utente, usare seleziona e deseleziona.
• Quando possibile, formattare l'etichetta usando il testo in grassetto. In caso contrario, inserire l'etichetta tra virgolette solo se necessario per evitare confusione.

Esempio: selezionare la casella di controllo Sottolineatura .