I pulsanti non dovrebbero avere un cursore a forma di mano

Questa è la parte 1 di una serie in 3 parti. Ecco la parte 2 e la parte 3.

C'è la convinzione che il cursore mano (puntatore) significhi cliccabile, ma questo è sbagliato e potenzialmente problematico.

La mano non significa cliccabile

Non è un caso che i browser non diano ai pulsanti (e altri elementi) un cursore del puntatore - è perché non sono pensati per questo. Vedi lo screenshot seguente:

Pagina di ricerca di Google su Chrome su Mac OS

Quasi ogni elemento è interattivo e cliccabile: il menu, le schede, gli spazi bianchi, i pulsanti del browser, la barra dei segnalibri e la casella di ricerca di Google, nessuno di questi ha un cursore del puntatore.

Ci sono più elementi interattivi e cliccabili non mostrati sopra: selezionare menu, cursori, caselle di controllo, radio, etichette, immagini, spazio vuoto (ad es. Clic con il tasto destro - visualizza sorgente) e testo - di nuovo, nessuno di essi ha un cursore del puntatore.

Lo stesso vale per il sistema operativo. È possibile toccare, trascinare, selezionare, premere, fare clic con il tasto sinistro e fare clic con il tasto destro su una pletora di diversi elementi inclusi i pulsanti. Tuttavia, i pulsanti non sono indicati dal cursore del puntatore visualizzato al passaggio del mouse.

L'accordo di licenza è un collegamento e ottiene il cursore del puntatore. I pulsanti non lo fanno.

La convenienza percepita è fornita dal modo in cui qualcosa appare indipendentemente dal cursore. Ricorda che il cursore è disponibile solo quando si passa con un dispositivo di puntamento come un mouse.

Ecco perché, ad esempio, le caselle di controllo non sono mai rotonde (e le radio non sono mai quadrate). Questo è anche il motivo per cui i collegamenti sono in genere sottolineati. Questo è il motivo per cui i collegamenti hanno, in effetti, un cursore a mano.

Cosa dicono le autorità

Le guide alla progettazione di Microsoft parlano della convenienza debole:

I collegamenti di testo e grafica utilizzano un puntatore a mano [...] [...] a causa della loro debolezza economica. Mentre i collegamenti possono avere altri indizi visivi per indicare che sono collegamenti (come sottolineature e posizionamenti speciali), la visualizzazione del puntatore della mano al passaggio del mouse è l'indicazione definitiva di un collegamento.
Per evitare confusione, è indispensabile non utilizzare il puntatore mano per altri scopi. Ad esempio, i pulsanti di comando hanno già una forte convenienza, quindi non hanno bisogno di un puntatore a mano. Il puntatore della mano deve significare "questo obiettivo è un collegamento" e nient'altro.

Le Linee guida per l'interfaccia umana di Apple affermano che il cursore a mano dovrebbe essere usato quando "il contenuto è un collegamento URL". Le linee guida dell'interfaccia utente del W3C dicono di nuovo la stessa cosa con "Il cursore è un puntatore che indica un collegamento".

Il cursore della mano è per i collegamenti

La mano (e spesso il testo sottolineato) indica un collegamento. I collegamenti non sono pulsanti. I collegamenti sono arrivati ​​insieme al web. Per aiutare gli utenti a capire che sono diversi, viene loro assegnato il cursore della mano. Serve come ulteriore indizio. Ecco perché:

  1. Facendo clic su un collegamento si apre una pagina Web o una risorsa.
  2. (Sul desktop) Posso fare clic con il tasto destro su un collegamento e fare molte cose (che non posso fare con un pulsante). Aprire in una nuova scheda / finestra, salvare un collegamento, copiare l'indirizzo, aggiungere all'elenco di lettura, aggiungerlo ai segnalibri e altro.
  3. (Sui dispositivi mobili) Posso toccare e tenere premuto un collegamento e ottenere un menu di scelta rapida simile al punto precedente.
  4. Un link mi dice anche che sto andando altrove. Non sto modificando alcun dato né apportando modifiche in alcun modo (come è probabile che faccia un pulsante).

Sommario

Quando un pulsante ha il cursore della mano, suggerisce sottilmente che l'utente sta interagendo con un collegamento quando non lo è. Se si desidera fornire un feedback visivo quando l'utente passa il mouse, è possibile farlo con altri cambiamenti di stile come il colore di sfondo. Un pulsante ben progettato non ha bisogno di un cursore a mano per aiutare l'utente a rendersi conto che fa qualcosa.

Il cursore della mano è riservato per i collegamenti. Questo perché sono unici nel loro comportamento. Browser e sistemi operativi hanno fatto il lavoro per te - perché contrariamente alla credenza popolare - i browser lo sanno meglio.

I collegamenti sono sempre stati gestiti in questo modo da quando è arrivata la rete: questa è la convenzione della rete su cui non è necessario innovare. Puoi stare tranquillo sapendo che i browser ti hanno coperto. Questo lascia te e il tuo team per risolvere problemi reali.

Post di follow-up

  • Ma a volte i collegamenti sembrano pulsanti
  • I pulsanti non dovrebbero avere un cursore a mano Parte 2

A proposito, sto scrivendo un libro chiamato Form Design Patterns. Se vuoi sapere quando viene rilasciato iscriviti qui e ti terrò aggiornato.