risposta-alla-domanda-sullo-sviluppo-web-bd.com

Larghezza fissa per pulsanti o proporzionale al testo?

Qual è la migliore pratica per un'interfaccia utente, per rendere tutti i pulsanti simili con una larghezza fissa , indipendentemente dalla lunghezza del testo (con la condizione di adatta) o rende la larghezza proporzionale al testo e aggiungi lo stesso imbottitura?

enter image description here

Aggiornare:

Controllare anche questo esempio nelle Linee guida per la progettazione dei materiali che suggeriscono una larghezza minima e una larghezza flessibile.

enter image description here

Pulsanti della finestra Altezza pulsante: 36dp Margine superiore pulsante: 24dp Riempimento pulsanti: 8dp Allineamento pulsanti: bordo destro per script LTR Larghezza pulsante: varia in base alla lunghezza del testo del pulsante

enter image description here

È questa una regola generale?

17
Madalina Taina

Secondo me, se i pulsanti sono uno sopra l'altro, prova ad adattare il più corto per avere la larghezza più ampia. Nel tuo esempio sarebbe l'opzione verde, ma dando meno padding al pulsante "Iscriviti".

Se i pulsanti sono orizzontali non è necessario assegnare loro la stessa larghezza.

enter image description here

9
Alvaro

Penso che la larghezza fissa sia l'opzione migliore perché fornisce un equilibrio visivo allo schermo. A volte si usano anche dimensioni diverse per dare enfasi, per esempio, potrebbe essere possibile che i pulsanti allo stesso livello, ma il pulsante con dimensioni maggiori stia attirando più attenzione.

4
Dhiraj Pandagre

Dopo aver fatto più ricerche su questo problema, non ho trovato una buona ragione per credere che i pulsanti con la stessa larghezza aiutino l'utente in alcun modo, influenzino meno la decisione o migliorino l'accessibilità. Invece, penso che non dovremmo ignorare la raccomandazione di Material Design Guidance che suggerisce un'altezza preferita, ma non una larghezza fissa: "Accessibilità

Per garantire l'usabilità per le persone con disabilità, assegnare ai pulsanti un'altezza di 36dp e assegnare a target tangibili un'altezza minima di 48dp. "

enter image description here

3
Madalina Taina

Madalina, una larghezza minima generale per i pulsanti, come indicato nelle Linee guida per la progettazione dei materiali, è importante, perché garantisce che tutti i pulsanti siano ragionevolmente facili da fare clic o toccare anche per etichette molto brevi come OK. Pensa " Legge di Fitts ."

E mentre i pulsanti della stessa larghezza possono sembrare più esteticamente gradevoli, devo ancora vedere la ricerca che mostra qualsiasi usabilità vantaggi nell'usarli.

0
JochenW

Nel sistema di progettazione che ho creato per la mia azienda, ho combinato entrambi i tipi. I pulsanti di dimensioni fisse possono essere utilizzati meglio per finestre modali e pop-up. Questo è più estetico e normale per gli utenti e finge di essere come "modello di progettazione". Quindi di dimensioni fisse ovunque quando abbiamo 2 o un gruppo di pulsanti. La larghezza, in questo caso, viene calcolata dall'etichetta di testo più lunga possibile. In tutti gli altri casi, utilizzo pulsanti con imbottiture, ad es. 16px + TextLabel + 16px.

La correzione della larghezza dei pulsanti darà un aspetto coerente all'interfaccia. Tuttavia, ha il rischio di non essere in grado di gestire ulteriori pulsanti con etichette forse più lunghe. Questo motivo lo rende incompatibile con una linea guida fissa.

Puoi sempre enfatizzare un pulsante in particolare giocando su dimensioni, colore e imbottitura.

0
asiegf