Condividi tramite


Schede

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.

Le schede consentono di presentare informazioni correlate su pagine etichettate separate.

screenshot di cinque schede

Set tipico di schede.

Le schede sono in genere associate alle finestre delle proprietà (e viceversa), ma le schede possono essere usate in qualsiasi tipo di finestra.

I controlli tabulazioni rappresentano le cartelle a schede usate per organizzare le informazioni nei contenitori di archiviazione comunemente presenti nella Stati Uniti. Le cartelle di Manila non vengono usate in tutto il mondo.

Nota

Le linee guida relative al layout, ai menu a schede, alle finestre di dialogo e alle finestre delle proprietà sono presentate in articoli separati.

È il controllo giusto?

Per decidere, prendi in considerazione queste domande:

  • I controlli possono adattarsi comodamente a una singola pagina di dimensioni ragionevoli? In tal caso, usare una singola pagina.
  • Esiste una sola scheda? In tal caso, usare una singola pagina.
  • Le schede sono correlate tra loro in modo ovvio? In caso contrario, è consigliabile suddividere le informazioni in finestre separate di informazioni correlate.
  • Se usato per le impostazioni, le impostazioni sono completamente indipendenti da pagine diverse? La modifica di un'impostazione in una pagina influisce sulle impostazioni in altre pagine? Se non sono indipendenti, usare invece pagine attività o una procedura guidata .
  • Le schede sono principalmente peer l'una dell'altra o esiste una relazione gerarchica? Se gerarchico, prendere in considerazione l'uso di finestre di dialogo progressive o figlio per visualizzare informazioni correlate.
  • Le schede vengono usate per visualizzare i passaggi all'interno di un'attività? È possibile usare le "schede" per visualizzare i passaggi all'interno di un'attività solo se vengono presentati come passaggi e esiste un modo ovvio e alternativo per accedere al passaggio di testo, ad esempio un pulsante Avanti. In caso contrario, se sono necessari i passaggi, usare le pagine in un flusso di pagina o in una procedura guidata. Se i passaggi sono facoltativi, visualizzare invece i passaggi facoltativi usando le finestre di dialogo modali.
  • Le schede sono visualizzazioni diverse degli stessi dati? In tal caso, è consigliabile usare un pulsante di divisione o un elenco a discesa per modificare le visualizzazioni. Anche se le schede possono essere usate in modo efficace per modificare le visualizzazioni, le alternative sono più leggere.

Modelli di utilizzo

Le schede hanno diversi modelli di utilizzo:

Utilizzo Esempio
Superficie finestra dinamica
come le barre di scorrimento, le schede possono essere usate per aumentare l'area di superficie della finestra per visualizzare le informazioni correlate.
Con questo modello, l'uso delle schede è concettualmente simile all'inserimento di tutte le informazioni sulle schede in modo lineare su una singola superficie scorrevole, con le etichette di tabulazioni come intestazioni.
screenshot di cinque schede
In questo esempio le schede aumentano in modo efficace l'area della superficie della finestra.
Più visualizzazioni
ad esempio pulsanti di divisione o elenchi a discesa, le schede possono essere usate per visualizzare visualizzazioni diverse delle stesse informazioni o correlate.
screenshot delle schede di progettazione, suddivisione e anteprima
In questo esempio le schede cambiano le visualizzazioni all'interno di un documento.
Più documenti
come più finestre, le schede possono essere usate per visualizzare documenti diversi in una singola finestra.
screenshot di tre schede per documenti diversi
figura delle schede per mesi diversi
In questi esempi le schede mostrano documenti diversi all'interno di una singola finestra dell'applicazione.
Opzioni esclusive
come i pulsanti di opzione, le schede possono essere usate per presentare più scelte esclusive. in questo modello viene applicata solo la scheda selezionata e tutte le altre schede vengono ignorate.
screenshot delle schede location, data e messages
In questo esempio, le schede vengono usate (in modo non corretto) come sostituto dei pulsanti di opzione.
Questo modello non è consigliato perché usa un comportamento non standard. Le schede si comportano come un'impostazione anziché semplicemente un modo per spostarsi all'interno della finestra.

Se fai solo una cosa...

Assicurarsi che le informazioni sulle schede siano correlate, ma le impostazioni in pagine diverse sono indipendenti. L'ultima scheda selezionata non deve avere un significato speciale.

Indicazioni

Generale

  • Usare le schede orizzontali se:

    • La finestra ha sette o meno schede.
    • Tutte le schede si adattano a una riga, anche quando l'interfaccia utente è localizzata.
  • Usare le schede verticali se:

    • La finestra delle proprietà include otto o più schede.

    • L'uso di schede orizzontali richiede più righe.

      schermata della finestra delle proprietà con undici opzioni

      In questo esempio le schede verticali supportano otto o più schede.

  • Non annidare le schede o combinare schede orizzontali con schede verticali. Ridurre invece il numero di schede, usare solo schede verticali o usare un altro controllo, ad esempio un elenco a discesa.

  • Non scorrere le schede orizzontali. Lo scorrimento orizzontale non è facilmente individuabile. È tuttavia possibile scorrere le schede verticali.

    Non corretto:

    screenshot dell'etichetta di tabulazioni orizzontali troncate

    In questo esempio le schede orizzontali vengono scorrevoli.

  • Per le schede in una finestra o un riquadro ridimensionabile, inserire una barra di scorrimento, se necessario, nella pagina, non nella finestra o nel riquadro. Le schede devono essere sempre visibili e non scorrere all'esterno della visualizzazione.

    screenshot della pagina della scheda verticale con barra di scorrimento

    In questo esempio la pagina della scheda ha la barra di scorrimento, non il riquadro.

  • Assicurarsi che le schede siano simili a schede e non a un altro tipo di controllo.

    Non corretto:

    screenshot della finestra con pulsanti per le schede

    In questo esempio, queste schede hanno un aspetto simile ai pulsanti di comando.

Interazione

  • Quando i controlli si applicano solo a una pagina, inserirli all'interno del bordo della pagina a schede.
  • Quando i controlli si applicano all'intera finestra, posizionarli all'esterno della pagina a schede.
  • Non assegnare effetti alla modifica delle schede. Le schede devono essere accessibili in qualsiasi ordine. La modifica della scheda corrente non deve mai avere effetti collaterali, l'applicazione delle impostazioni o il risultato di un messaggio di errore.
  • Non assegnare un significato speciale all'ultima scheda selezionata. La selezione della scheda è destinata alla navigazione dell'ultima selezione della scheda dell'utente non è un'impostazione.
  • Non rendere le impostazioni in una pagina dipendenti dalle impostazioni in altre pagine. Inserire invece tutte le impostazioni dipendenti nella stessa pagina.
  • Se è probabile che gli utenti inizino con l'ultima scheda visualizzata, rendere persistente la scheda e selezionarla per impostazione predefinita. Rendere persistenti le impostazioni per ogni singolo utente. In caso contrario, selezionare la prima pagina per impostazione predefinita.

Icone

  • Non inserire icone nelle schede. Le icone in genere aggiungono spazi visivi non necessari, utilizzano lo spazio dello schermo e spesso non migliorano la comprensione dell'utente. Aggiungere solo icone che aiutano a comprendere, ad esempio i simboli standard.

    Non corretto:

    schermata della finestra con icone nelle schede

    In questo esempio le icone aggiungono un inclutter visivo e fanno poco per migliorare la comprensione dell'utente.

    Eccezione: È possibile usare icone chiaramente riconoscibili se potrebbe esserci spazio insufficiente per visualizzare etichette significative:

    Corretto:

    schermata delle schede con icone e etichette abbreviate

    In questo esempio la finestra è così stretta che le icone comunicano meglio le schede rispetto alle etichette.

  • Non usare i logo del prodotto per la grafica a schede. Le schede non sono per la personalizzazione.

Modello di superficie finestra dinamica

  • Non usare le barre di scorrimento nelle pagine delle schede. Le schede funzionano in modo analogo alle barre di scorrimento per aumentare l'area effettiva di una finestra. Un meccanismo deve essere sufficiente.

  • Usare etichette di tabulazioni concise. Usare una o due parole che descrivono chiaramente il contenuto della pagina. Le etichette più lunghe usano lo spazio dello schermo, soprattutto quando le etichette vengono localizzate.

  • Usare etichette di tabulazioni specifiche e significative. Evitare etichette di tabulazioni generiche che potrebbero essere applicate a qualsiasi scheda, ad esempio Generale, Avanzate o Impostazioni.

  • Se una scheda non si applica al contesto corrente e gli utenti non si aspettano che venga rimossa. In questo modo semplifica l'interfaccia utente e gli utenti non lo perderanno.

    Non corretto:

    schermata della finestra delle opzioni con nome di tabulazione dimmed

    In questo esempio, la scheda Percorsi file viene disabilitata in modo errato quando Microsoft Word viene usato come editor di posta elettronica. Anziché disabilitare questa scheda, deve essere rimossa perché gli utenti non si aspettano di visualizzare o modificare i percorsi dei file in questo contesto.

  • Se una scheda non si applica al contesto corrente e gli utenti potrebbero aspettarlo:

    • Visualizzare la scheda.
    • Disabilitare i controlli nella pagina.
    • Includere testo che spiega perché i controlli sono disabilitati.

    Non disabilitare la scheda, perché questa operazione non è auto-esplicativa e impedisce l'esplorazione. Gli utenti che cercano un valore specifico sarebbero costretti a cercare tutte le altre schede.

    schermata della finestra con opzioni della scheda visualizzazione disattivate

    In questo esempio, nessuna delle opzioni Di visualizzazione si applica in Layout di lettura. Tuttavia, gli utenti potrebbero aspettarsi che vengano applicati in base all'etichetta della scheda, quindi la pagina viene visualizzata ma le opzioni sono disabilitate.

Più visualizzazioni e modelli di documenti

  • Usare la visualizzazione o i nomi dei documenti nelle etichette delle schede.
  • Evitare nomi di tabulazioni eccessivamente lunghi. Se necessario, avere una dimensione massima del nome o troncare l'etichetta di tabulazione visualizzata usando i puntini di sospensione. Le etichette più lunghe usano lo spazio dello schermo, soprattutto quando le etichette vengono localizzate.
  • Se una scheda non si applica al contesto corrente, rimuovere la scheda.

Modello di opzioni esclusive

  • Non usare questo modello! Usare i pulsanti di opzione o un elenco a discesa.

    Non corretto:

    schermata della finestra con due schede

    In questo esempio le schede vengono usate in modo errato come sostituzione dei pulsanti di opzione.

    Corretto:

    schermata della finestra con due pulsanti di opzione

    In questo esempio, i pulsanti di opzione vengono usati correttamente.

Etichette

  • Schede etichetta in base al modello. Usare i sostantivi anziché i verbi, senza terminare la punteggiatura. Per altre informazioni, vedere le linee guida per il modello precedente.
  • Usare le maiuscole/minuscole come nelle frasi comuni.
  • Non assegnare una chiave di accesso. Le schede sono accessibili tramite i tasti di scelta rapida (CTRL+TAB, CTRL+MAIUSC+TAB, CTRL+PgUp, CTRL+PgDn). Esiste una carenza di scelte chiave di accesso valide, quindi non assegnando chiavi di accesso alle schede semplifica l'assegnazione di tali chiavi ad altri controlli.

Documentazione

Quando si fa riferimento alle schede:

  • Usare il testo esatto dell'etichetta, inclusa la maiuscola e includere la scheda della parola.
  • Per descrivere l'interazione dell'utente, fare clic su .
  • Se possibile, formattare l'etichetta usando il testo grassetto. In caso contrario, inserire l'etichetta tra virgolette solo se necessario per evitare confusione.
  • Poiché più usi possono essere ambigui, soprattutto per un pubblico mondiale, usare la scheda sostantivo da sola per fare riferimento solo a un controllo tabulazioni. Per altri usi, chiarire il significato con un descrittore: la chiave Tab, una tabulazione o un segno di tabulazione sul righello.

Esempio: nel menu Strumenti fare clic su Opzioni e quindi fare clic sulla scheda Visualizza .