it-swarm.it

Dimensione dell'elemento forma utilizzabile

Non sono un designer dell'interfaccia utente in alcun modo. Ho notato nell'ultimo o due anni che pulsanti/collegamenti importanti ... ecc. Su molti siti Web ora hanno zone di clic molto grandi. Devo dire che lo apprezzo, perché ottenere il cursore solo per agire è un dolore. Direi che probabilmente è più rilevante ora con il cellulare, che potrebbe anche essere il driver per questi cambiamenti di progettazione.

Quindi, esiste una regola empirica per le dimensioni di pulsanti/collegamenti in una pagina Web?

8
rick schott

È tutto basato su legge di Fitts che ti dà il tempo medio necessario all'utente per portare il cursore sul pulsante. Puoi trovare diversi articoli sull'argomento come la legge dell'interfaccia utente di Fitts applicata al Web o persino il podcast di Jared Spool .

E la regola empirica è semplice: un pulsante importante dovrebbe essere così grande che può essere premuto con, letteralmente, un pollice (ciao, iPad) :-)

10
Kostya

Ecco una regola empirica per l'iPhone, da Linee guida per l'interfaccia umana di Apple .

Crea controlli che siano alti almeno 29 pixel e fornisci un'area target che è 44 pixel alto.

Altro dal libro Tapworthy , dove l'ho scoperto.

Ma quanto è grande abbastanza grande quando si tratta di target dei tocchi iPhone? Bene, qual è la dimensione di una punta del dito? Apple lo inserisce esattamente a 44 pixel e questa misura appare affidabile in tutti i controlli standard di iPhone

5

Non esiste una regola empirica in quanto esiste una consapevolezza crescente che non tutti gli utenti di Internet hanno la destrezza e l'agilità di un progettista di interfacce professionale a tempo pieno. Nel 1999/2000 hai visto molti progetti "pixel" in cui le cose erano minuscole e utilizzavano pulsanti di dimensioni 8x8. Dal boom dell'usabilità ispirato a Steve Krug, Kathy Sierra, 37signals, Jakob Nielsen e altri nel corso degli anni 2000, le persone sono diventate più consapevoli di quanto siano utilizzabili le loro app e i loro siti e hanno iniziato a progettare di conseguenza.

Un altro aspetto della storia è che gli schermi e le risoluzioni dello schermo in generale stanno diventando più grandi. La media di oggi è probabilmente di 1280x1024 e oltre, mentre dieci anni fa saresti fortunato a trovare un visitatore di 1280x1024 sul tuo sito poiché la maggior parte delle persone continuava a fare una media di circa 800x600. Poiché le risoluzioni sono più grandi, più pixel si adattano allo schermo e ciò che prima era abbastanza facile da vedere ora sta diventando ancora più piccolo (e come tale, più difficile da fare clic).

E infine, l'introduzione di dispositivi touch-based ha portato molti sviluppatori a iniziare a prendere sul serio l'area dei clic, poiché è difficile colpire un piccolo bersaglio con qualcosa di impreciso come un dito rispetto all'estrema precisione del puntatore del mouse.

Tutti questi cambiamenti porteranno probabilmente a delle regole empiriche ad un certo punto, ma nel complesso la cosa migliore che puoi fare è identificare quale tipo di pubblico sta visitando il tuo sito e progettare di conseguenza, tenendo conto di chi sono, di quali dispositivi sono utilizzando e altri elementi come la quantità di spazio che hai sullo schermo/finestra.

4
Rahul

In una certa misura, la dimensione della zona clic è relativa agli altri elementi della pagina. Non ho uno standard rigoroso, ma in genere scopro che i miei pulsanti hanno un'altezza di almeno 40 px e la mia dimensione del testo è di solito almeno 13 px. Penso anche che per la navigazione e altri pulsanti con almeno qualche componente grafico, è importante rendere cliccabile l'intera area, anziché solo il testo.

0
Virtuosi Media