Condividi tramite


Barre di stato (nozioni di base sulla progettazione)

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.

Una barra di stato è un'area nella parte inferiore di una finestra primaria che visualizza informazioni sullo stato della finestra corrente (ad esempio cosa viene visualizzato e come), attività in background (ad esempio stampa, analisi e formattazione) o altre informazioni contestuali (ad esempio selezione e stato della tastiera).

Le barre di stato indicano in genere lo stato tramite testo e icone, ma possono anche avere indicatori di stato, nonché menu per i comandi e le opzioni correlate allo stato.

screenshot della barra di stato tipica

Barra di stato tipica.

Nota

Le linee guida relative all'area di notifica vengono presentate in un articolo separato.

Si tratta dell'interfaccia utente corretta?

Per decidere, prendi in considerazione queste domande:

  • Lo stato è rilevante quando gli utenti usano attivamente altri programmi? In tal caso, usare le icone di un'area di notifica.

  • L'elemento di stato deve visualizzare le notifiche? In tal caso, è necessario usare un'icona dell'area di notifica.

  • La finestra è una finestra primaria? In caso contrario, non usare una barra di stato. Le finestre di dialogo, le procedure guidate, i pannelli di controllo e le finestre delle proprietà non devono avere barre di stato.

  • Le informazioni sono principalmente sullo stato? In caso contrario, non usare una barra di stato. Le barre di stato non devono essere utilizzate come barra dei menu o barra degli strumenti secondaria.

  • Le informazioni spiegano come usare il controllo selezionato? In tal caso, visualizzare le informazioni accanto al controllo associato usando invece una spiegazione supplementare o un'etichetta di istruzione.

  • Lo stato è utile e rilevante? Ovvero, è probabile che gli utenti modifino il proprio comportamento in seguito a queste informazioni? In caso contrario, non visualizzare lo stato o inserirlo in un file di log.

  • Lo stato è critico? È necessaria un'azione immediata? In tal caso, visualizzare le informazioni in un modulo che richiede attenzione e non può essere facilmente ignorate, ad esempio una finestra di dialogo o all'interno della finestra primaria stessa.

    schermata della barra di stato

    Barra degli indirizzi rossa in Windows Internet Explorer.

  • Il programma è destinato principalmente agli utenti principianti? Gli utenti inesperti in genere non sono a conoscenza delle barre di stato, quindi riconsiderare l'uso delle barre di stato in questo caso.

Concetti relativi alla progettazione

Le barre di stato sono un ottimo modo per fornire informazioni sullo stato senza interrompere gli utenti o interrompere il flusso. Tuttavia, le barre di stato sono facili da ignorare. Così facile, infatti, che molti utenti non notano affatto le barre di stato.

La soluzione a questo problema non è quella di richiedere l'attenzione dell'utente usando icone, animazioni o lampeggianti, ma per progettare questa limitazione. A questo scopo:

  • Assicurarsi che le informazioni sullo stato siano utili e pertinenti. In caso contrario, non fornire alcuna barra di stato.
  • Non usare le barre di stato per informazioni cruciali. Gli utenti non devono mai sapere cosa si trova nella barra di stato. Se gli utenti devono visualizzarlo, non inserirlo in una barra di stato.

Se fai solo una cosa...

Assicurarsi che le informazioni sulla barra di stato siano utili e rilevanti, ma non cruciali.

Modelli di utilizzo

Le barre di stato hanno diversi modelli di utilizzo:

Utilizzo Esempio
Stato corrente della finestra
Mostra l'origine di ciò che viene visualizzato insieme a qualsiasi modalità di visualizzazione
screenshot di una barra di stato 'location'
In questo esempio la barra di stato visualizza il percorso del documento.
Progress
Mostra lo stato di avanzamento delle attività in background, con un indicatore di stato determinato o un'animazione.
schermata della barra di stato con indicatore di stato
In questo esempio, la barra di stato include un indicatore di stato per visualizzare il caricamento della pagina Web in una finestra di Internet Explorer.
Informazioni contestuali
Mostra informazioni contestuali sulle operazioni attualmente in corso dell'utente.
screenshot della barra di stato che mostra il numero di pixel
In questo esempio, Microsoft Paint mostra le dimensioni della selezione in pixel.

Indicazioni

Generale

  • Valutare la possibilità di fornire un comando Visualizza barra di stato se solo alcuni utenti avranno bisogno delle informazioni sulla barra di stato. Nascondere la barra di stato per impostazione predefinita se la maggior parte degli utenti non ne ha bisogno.
  • Non usare la barra di stato per spiegare le voci della barra dei menu. Questo modello della Guida non è individuabile.

Presentazione

  • Disabilitare lo stato modale che non si applica. Lo stato modale include stati della tastiera e del documento.
  • Rimuovere lo stato non modale che non si applica.
  • Presentare le informazioni sullo stato nell'ordine seguente: stato della finestra corrente; Progresso; e informazioni contestuali.

Icone

  • Scegli i disegni delle icone di stato facilmente riconoscibili. Preferisce le icone con contorni univoci rispetto alle icone a forma quadrata o rettangolare.

  • Usare le swath di puro rosso, giallo e verde solo per comunicare le informazioni sullo stato. In caso contrario, tali icone creano confusione.

    Corretto:

    screenshot della barra di stato con icone blu

    Non corretto:

    schermata della barra di stato con un'icona rossa

    Nell'esempio errato, l'icona rossa suggerisce involontariamente un errore, creando confusione.

  • Usare varianti o sovrimpressioni dell'icona per indicare modifiche dello stato o dello stato. Usare le varianti delle icone per visualizzare le modifiche nelle quantità o nei punti di forza. Per altri tipi di stato, usare queste sovrimpressioni standard:

    Sovrapposizione (Overlay) Stato
    screenshot dell'icona di avviso
    Avviso
    screenshot dell'icona di errore
    Errore
    screenshot dell'icona disabilitata/disconnessa
    Disabilitato/disconnesso
    screenshot dell'icona bloccata/offline
    Bloccato/offline
  • Non modificare lo stato troppo frequentemente. Le icone della barra di stato non devono essere visualizzate rumorose, instabili o richiedono attenzione. L'occhio è sensibile ai cambiamenti nel campo periferico della visione, quindi lo stato cambia deve essere sottile.

  • Per le icone che forniscono informazioni importanti sullo stato, preferiscono etichette sul posto.

  • Le icone della barra di stato non etichettate devono avere descrizioni comandi.

Per altre informazioni, vedere Icone.

Interazione

  • Rendere interattiva un'area della barra di stato per consentire agli utenti l'accesso diretto ai comandi e alle opzioni correlate.
    • Usare un controllo che sembra e si comporta come un pulsante di menu o un pulsante di divisione. Queste aree della barra di stato devono avere una freccia a discesa per indicare che sono selezionabili.
    • Visualizzare il menu a sinistra facendo clic con il mouse verso il basso, non con il mouse verso l'alto.
    • Non supportare il clic con il pulsante destro del mouse o fare doppio clic. Gli utenti non si aspettano tali interazioni in una barra di stato, quindi non sono probabile che tentino di provarli.
  • Visualizzare le descrizioni comandi sul puntatore del mouse.

Testo

  • In genere, usare etichette concise. Tagliare qualsiasi testo che può essere eliminato.
  • Preferisce frammenti di frase, senza punteggiatura finale. Usare frasi complete (con punteggiatura finale) solo quando i frammenti di frase non sono significativamente più brevi.
  • Per le etichette di stato facoltative, indicare cosa sta facendo con un'etichetta che inizia con un verbo (forma gerund) e termina con i puntini di sospensione. Ad esempio: "Copia...". Questa etichetta può cambiare dinamicamente se l'operazione ha più passaggi o elabora più oggetti.
  • Non usare il colore, il grassetto o il corsivo per evidenziare il testo della barra di stato.
  • Per le linee guida per la descrizione comando, vedere Descrizioni comandi e Descrizioni comandi.

Documentazione

Fare riferimento alle barre di stato come barre di stato, non linee di stato o altre varianti. Esempio: "Il numero di pagina corrente viene visualizzato sulla barra di stato".