Perché il cursore predefinito è una freccia quando passi con il mouse su un HTML <button>
? Ho sempre pensato che le frecce ti consentissero di selezionare elementi, ma le mani ti consentono di eseguire un'azione. Poiché i pulsanti eseguono azioni, non dovrei sostituire lo stile predefinito per essere un puntatore a mano?
button {
cursor: pointer;
}
I pulsanti sono un tradizionale controllo dell'interfaccia utente del software desktop, un contesto in cui il puntatore a mano non è mai stato usato prima dell'avvento di Internet.
Quando le pagine Web hanno iniziato a utilizzare lo stesso controllo, hanno mantenuto il pulsante come in un ambiente desktop.
Si tratta di Affordance . I pulsanti hanno un prezzo elevato che suggerisce visivamente come possono essere utilizzati. Il puntatore a mano viene utilizzato quando la convenienza è inferiore per fornire un'indicazione su come interagire con quell'elemento.
Ecco un estratto da Microsoft Applicazioni desktop di Windows> Progettazione> Linee guida> Interazione> Mouse e puntatori )
"Si dice che gli oggetti dell'interfaccia utente (UI) ben progettati abbiano una certa convenienza, che sono proprietà visive e comportamentali di un oggetto che suggeriscono come viene utilizzato."
E:
I collegamenti di testo e grafici utilizzano un puntatore mano o "selezione collegamento" (una mano con il dito indice puntato Schermata della mano con il dito indice puntato) 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, è imperativo non utilizzare il puntatore della mano per altri scopi. Ad esempio, i pulsanti di comando hanno già un buon prezzo, quindi non Ho bisogno di un puntatore a mano. Il puntatore della mano deve significare "questo obiettivo è un collegamento" e nient'altro.
Entrambe le specifiche CSS 2.1 e CSS Basic UI affermano sicuramente che il cursore del puntatore è specifico per i collegamenti ('... un puntatore che indica un collegamento'). Uno degli autori della CSS 2.1 Test Suite ha scritto na seguente osservazione nella mailing list del W3C:
Anche quando si passa il cursore sopra un <img onclick = "... some function ...">, un pulsante, un pulsante di opzione, una casella di controllo, il cursore sotto Windows non si trasforma in un puntatore ma rimane una freccia.
Il cursore del puntatore deve indicare un collegamento e non qualsiasi/tutti selezionabili oggetti. È perché gli autori del web abusano della dichiarazione del cursore o abusano della dichiarazione del cursore che c'è una tendenza a generalizzare o assumere cose (come un cursore che rivela la cliccabilità) che la specifica non dice.
Quindi, se si utilizza cursor:pointer
in un contesto diverso da quello per i link migliora l'usabilità o meno, viola ancora gli standard CSS.
È interessante notare che, passando il pulsante di invio sul modulo di commento questo cambia il cursore sulla mano. Direi che "arrow = do and hand = go" era probabilmente una convenzione ad un certo punto, ma è stata ampiamente scartata attraverso a) l'ignoranza e b) una migliore progettazione. Rendi un pulsante selezionabile e la modifica del cursore non avrà importanza per l'utente finale.
Riguarda anche un po 'di psicologia. Cambiando anche il cursore, una freccia al passaggio del mouse indica che l'utente è in bilico su qualcosa che è utilizzabile, ma non necessariamente un'azione che li porterà altrove. È diverso dall'icona di una mano al passaggio del mouse, che sul Web indica che possono andare da qualche parte.
Le interfacce Web non hanno elementi standardizzati come ogni sistema operativo. Poiché le interfacce Web iCloud e il cursore OneDrive variano a seconda dei loro standard di sistema operativo desktop.
Se consideri iCloud e OneDrive entrambi hanno le loro interfacce native e web, in Native usano il cursore Predefinito su un pulsante, mentre nel Web usano il cursore della mano sui pulsanti.
Un pulsante è, in modo sottile, diverso da un collegamento. Mentre un collegamento sostituisce semplicemente la pagina corrente con un'altra, un pulsante - di solito - invia alcuni input dell'utente e, spesso, influenza i dati memorizzati da qualche parte. Quindi una distinzione è ragionevole.
Tuttavia, dal momento che di solito lascio i miei pulsanti ovviamente come pulsanti, e allo stesso modo i collegamenti, spesso designerò il puntatore del pulsante per donare "azione" con la mano.