Condividi tramite


Schede

Nota

Questa guida di 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 in pagine etichettate separate.

schermata 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 di manila a schede utilizzate per organizzare le informazioni nei archivi di archiviazione comunemente presenti negli Stati Uniti. Le cartelle di Manila non vengono usate in tutto il mondo.

Nota

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

Questo è il controllo giusto?

Per decidere, considerare 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 in pagine diverse sono completamente indipendenti? 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, è consigliabile usare la divulgazione progressiva o le finestre di dialogo figlio per visualizzare le 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 c'è un modo ovvio e alternativo per ottenere il 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 una procedura guidata di . Se i passaggi sono facoltativi, visualizzare i passaggi facoltativi usando finestre di dialogo modali.
  • Le schede sono visualizzazioni diverse degli stessi dati? In tal caso, è consigliabile usare un pulsante di divisione o 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:

Uso Esempio
superficie finestra dinamica
come le barre di scorrimento, le schede possono essere usate per aumentare la superficie di attacco 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 tabulazione come intestazioni.
schermata di cinque schede
In questo esempio, le schede aumentano in modo efficace la superficie di attacco della finestra.
più visualizzazioni
come pulsanti di divisione o elenchi a discesa, le schede possono essere usate per visualizzare visualizzazioni diverse delle stesse informazioni o correlate.
schermata 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.
schermata 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.
schermata delle schede posizione, dati e messaggi
In questo esempio, le schede vengono usate (erroneamente) 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 una sola 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.

Istruzioni

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à ha otto o più schede.

    • L'uso di schede orizzontali richiederebbe 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.

    risposta errata:

    schermata 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 verso l'esterno della visualizzazione.

    schermata 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.

    risposta errata:

    schermata 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, posizionarli 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 dovrebbe mai avere effetti collaterali, applicare impostazioni o generare un messaggio di errore.
  • Non assegnare un significato speciale all'ultima scheda selezionata. La selezione di tabulazioni è per lo spostamento dell'ultima scheda selezionata dall'utente non è un'impostazione.
  • Non rendere le impostazioni di una pagina dipendenti dalle impostazioni di 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 confusione visive non necessarie, consumano spazio sullo schermo e spesso non migliorano la comprensione dell'utente. Aggiungere icone che facilitano la comprensione, ad esempio i simboli standard.

    risposta errata:

    schermata della finestra con icone nelle schede

    In questo esempio, le icone aggiungono confusione visive e fanno poco per migliorare la comprensione dell'utente.

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

    risposta esatta:

    schermata di tabulazioni con icone ed etichette abbreviate

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

  • Non usare i logo dei prodotti per la grafica a schede. Le schede non sono per 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 dovrebbe essere sufficiente.

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

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

  • Se una scheda non si applica al contesto corrente e gli utenti non lo prevedono, rimuoverlo. In questo modo, l'interfaccia utente e gli utenti non lo perderanno.

    risposta errata:

    schermata della finestra delle opzioni con il nome della scheda in grigio

    In questo esempio, la scheda Percorsi file viene disabilitata in modo non corretto quando viene utilizzato microsoft Word 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 aspettarsi di:

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

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

    schermata della finestra con le opzioni delle schede di visualizzazione in grigio

    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

  • Utilizzare 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 utilizzano 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.

    risposta errata:

    schermata della finestra con due schede 'create'

    In questo esempio, le schede vengono usate in modo non corretto come sostituto dei pulsanti di opzione.

    risposta esatta:

    schermata della finestra con due pulsanti di opzione

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

Etichette

  • Etichettare le schede in base al modello. Usare i sostantivi anziché i verbi, senza terminare la punteggiatura. Per altre informazioni, vedere le linee guida del modello precedenti.
  • Usare la maiuscola in stile frase.
  • 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). C'è una carenza di buone scelte chiave di accesso, quindi non l'assegnazione di tasti di scelta alle schede rende più semplice assegnarli ad altri controlli.

Documentazione

Quando si fa riferimento alle schede:

  • Usare il testo esatto dell'etichetta, inclusa la relativa maiuscola e includere la scheda delle parole.
  • Per descrivere l'interazione dell'utente, usare clic.
  • Quando 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 sola scheda sostantivo per fare riferimento solo a un controllo struttura a schede. Per altri usi, chiarire il significato con un descrittore: tasto TAB, tabulazione o tabulazione nel righello.

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