it-swarm.it

Le barre di scorrimento sono morte nel 2020?

Di recente ho sentito un designer dire qualcosa sul fatto che i moderni web design non usano barre di scorrimento visive - o almeno sono visibili solo durante lo scorrimento. Sono uno sviluppatore front-end e non l'avevo davvero sentito. C'è qualche verità in questo? In particolare la mia domanda è:

Per un'app Web, quando il contenuto è scorrevole:

  1. Dovrebbero mai esserci barre di scorrimento visibili (e perché)?
  2. Non dovrebbero mai esserci barre di scorrimento visibili (e perché no)?
92
jbyrd

Sì ci dovrebbe.

Le barre di scorrimento visibili sono un vantaggio "questa pagina è scorrevole"

Senza suggerimenti visivi come questo la funzionalità potrebbe mancare.

107
colmcq

Alcune linee guida di design moderno certamente compromettono le barre di scorrimento permanentemente visibili, ma non tutte. Ad esempio, nella Guida alla progettazione dei materiali , per i menu, se un menu è scorrevole, dovrebbe mostrare una barra di scorrimento. In ogni caso, se il contenuto è scorrevole, dovrebbe essere chiaro dal guardarlo che consente lo scorrimento.

Spetta a un singolo designer o linea guida stabilire se tale convenienza è dettata da una barra di scorrimento che indica chiaramente quanto è possibile scorrere verso il basso (tradizionale), un link "leggi di più" o una freccia rivolta verso il basso dello schermo (come in molte home page o blog di app moderne ) o una dissolvenza mentre ti avvicini al bordo dell'area del contenuto, il che implica che puoi spostare quella direzione per vedere più o più chiaramente, ma la convenienza stessa è la componente necessaria. Sarebbe un progetto scadente presentare contenuti che possono essere fatti scorrere ma non indicare tale scorrevolezza all'utente. Potrebbe frustrare l'utente o fargli perdere informazioni importanti o inviti all'azione.

102
sintax

Come utente del mouse, detesto il contenuto scorrevole che non mi dà la visione e l'accesso alle barre di scorrimento.

  1. La barra di scorrimento è un controllo. Mi permette di navigare rapidamente in pagine di grandi dimensioni con cui non è possibile confrontare lo scorrimento delle dita, lo scrolling, ecc. Mi dà anche più precisione per la maggior parte delle pagine rispetto alla mia rotella di scorrimento.

  2. La barra di scorrimento mi fornisce informazioni. Mi permette di determinare rapidamente quanto tempo ci vorrà per leggere il contenuto della pagina (presumendo una barra di scorrimento decente la cui maniglia: rapporto di grondaia è uguale allo schermo: rapporto di pagina) e mi dice quanto lontano attraverso la pagina ho ottenuto . Mi dà anche un indice per determinare dove mi trovo nella pagina se voglio scorrere rapidamente verso l'alto e verso il basso.

  3. La barra di scorrimento occupa una quantità insignificante di spazio. In questo momento, il mio schermo è a 1920 x 1080 = 2,1 Mpx. La finestra di Firefox con questa pagina è a 1125 x 905 = 1,0 Mpx. La barra di scorrimento è 16 x 816, occupando 13 Kpx totali, ovvero l'1,3% del mio schermo. Il mio monitor è abbastanza vicino a me perché lo uso per i giochi, quindi tendo a tenere la finestra più stretta del monitor comunque, quindi la barra di scorrimento occupa effettivamente spazio.

  4. Ci sono occasioni in cui non so nemmeno che il contenuto sia scorrevole, anche se tendo a provare a scorrere con la rotellina senza nemmeno controllare la barra, quindi dubito che questo sia un grosso problema per le pagine web. Per le applicazioni desktop che in genere non scorrono, sarebbe un problema più grande.

  5. Se vuoi una barra di scorrimento nascosta, dovrebbe apparire ogni volta che scorro manualmente (tramite rotellina del mouse, tasti della tastiera, trackpad, ecc.) E ogni volta che muovo il mouse verso il bordo destro dello schermo.

I dispositivi mobili sono più complicati, poiché la barra di scorrimento occupa una quantità così grande di spazio, soprattutto se è abbastanza grande da usare.

  • R. Solitamente risolvo il problema passando alla visualizzazione desktop (non ho ancora visto un sito Web la cui versione mobile è buona, figuriamoci migliore della versione desktop, quindi di default la visualizzazione desktop comunque). Quindi eseguo lo zoom indietro, scorro verso il basso, quindi eseguo lo zoom indietro. È più veloce e più preciso del tentativo di scorrere, scorrere, scorrere mentre si esegue lo zoom e non richiede una barra di scorrimento. (Mi consente anche di ingrandire per una migliore visualizzazione di immagini, diagrammi, ecc., Che la maggior parte dei siti mobili rifiuta inspiegabilmente di consentire.)

  • B. Firefox su Android ha una barra di scorrimento non accessibile per dirmi quale parte della pagina mi trovo (per entrambe le versioni desktop e mobile di un sito), così come l'impostazione predefinita "Internet "browser. Li uso come su un browser desktop con un mouse per indicizzare e determinare la lunghezza della pagina.

  • C. Tendo anche a visualizzare pagine Web di grandi dimensioni solo su un monitor adeguato, quindi è molto meno probabile che io sia su un dispositivo mobile che prova a scorrere un .pdf di 900 pagine o qualcosa del genere. Se la tua app web non supera mai le due o le tre schermate, lo scorrimento è molto meno problematico.

  • D. Vale anche la pena notare che lo scorrimento del dito sul touchscreen è in genere sia più veloce che più preciso rispetto all'uso della rotellina del mouse, quindi una pagina deve essere molto più grande prima che sia difficile navigare rapidamente.

Conclusione

Per le impostazioni del mouse (o trackpad o trackball), penso che la barra di scorrimento dovrebbe essere sempre visibile e accessibile. Come minimo, dovrebbe apparire durante lo scorrimento o quando si sposta il mouse vicino alla barra di scorrimento.

Per le configurazioni del touchscreen mobile, penso che la barra di scorrimento dovrebbe essere sempre visibile durante lo scorrimento, ma non deve essere acquisibile e probabilmente dovrebbe nascondersi quando non si scorre per ridurre lo spazio sprecato.

Non ho pasticciato con tablet/iPad o touchscreen più grandi, quindi non sono sicuro di come mi sento.

Ovviamente, avere la possibilità di modificare gli stili di visualizzazione (tramite cookie temporanei o tramite impostazioni utente memorizzate, a seconda che l'utente sia un ospite o abbia un account) è la soluzione migliore, ma per impostazione predefinita è necessario che funzioni.

61
MichaelS

Questo punto di vista proviene principalmente dall'ambiente Mac, in cui le barre di scorrimento vengono in genere visualizzate brevemente quando il contenuto viene visualizzato per la prima volta, quindi scompaiono. Quando si verifica lo scorrimento (attivato dall'utente o altro), ricompare la barra di scorrimento. È visibile solo la maniglia (come una barra nera arrotondata semitrasparente); nessuna freccia o grondaia. Se il cursore si trova sopra la barra di scorrimento quando appare, si allarga e consente di trascinare con il cursore. In nessun momento il contenuto cambia dimensione; si comporta come se la barra di scorrimento non fosse presente e la barra di scorrimento è visualizzata in alto.

Questo vale quando si utilizzano meccanismi di input simili a trackpad o trackpad (ad esempio un laptop). Le barre di scorrimento normali vengono comunque visualizzate per impostazione predefinita quando si utilizza un mouse.

Naturalmente, questo si estende anche ai dispositivi mobili; iOS utilizza un comportamento quasi identico (meno l'interazione con il cursore). In effetti penso che sia iniziato su iOS (dove le barre di scorrimento sarebbero troppo piccole per essere toccate in modo affidabile) e migrato su macOS.

Nel complesso, ciò presenta vantaggi e svantaggi:

  • Il fatto di non dover fare spazio per le barre di scorrimento semplifica la progettazione della pagina (meno elementi di distrazione) e consente più spazio per il contenuto, soprattutto quando possono scorrere più posizioni.
  • Gli utenti su Mac sono abituati a questo comportamento e se lo aspettano.
  • Non vi è alcun salto nelle dimensioni del contenuto quando un'area diventa improvvisamente scorrevole, il che risolve anche un'ambiguità comune in cui una barra di scorrimento può essere necessaria finché è visibile e non necessaria se è nascosta (ad esempio a causa del ritorno a capo del testo).

  • Sul lato negativo, come già accennato, è necessario trovare un altro modo per indicare che il contenuto è scorrevole. Non è un problema del genere per la parte principale di una pagina Web perché è comunque previsto, ma può essere un problema per i contenuti interni a seconda delle aspettative degli utenti. Il flash iniziale aiuta, ma non è sempre abbastanza.

  • L'interazione dell'utente per saltare in un'altra posizione nel documento è goffa; l'utente deve spostare il cursore sul punto in cui apparirà la barra di scorrimento, scorrere leggermente con la rotellina del mouse o "scorrimento a 2 dita", afferrare la barra di scorrimento quando appare e trascinare nella posizione desiderata. Lo scorrimento del momento aiuta ad evitare questo in alcuni casi.
  • Poiché la barra di scorrimento appare su uno sfondo trasparente, se lo sfondo è scuro può essere difficile da vedere. macOS fornisce una barra di scorrimento alternativa bianca che può essere utilizzata in questo caso (credo che i browser passino automaticamente a questo se lo sfondo è sufficientemente scuro, ma non è sicuro al 100%). Inoltre, conferisce alla barra un leggero bagliore (o ombra) come una sicurezza quasi perfetta.

Se possibile, ovviamente, attenersi ai componenti nativi del browser per questo genere di cose. Garantiranno a ogni utente un'esperienza naturale per la propria piattaforma (ho sicuramente visto molti siti Web tentare di replicare lo scorrimento del momento e lo scorrimento elastico con risultati finali atroci). Gli utenti Mac non ti ringrazieranno per aver forzato le barre di scorrimento visibili dove non si sarebbero aspettati, e gli utenti Windows non ti ringrazieranno per aver nascosto le barre di scorrimento dove si sarebbero aspettati.

26
Dave

La rimozione delle barre di scorrimento a mio avviso è un altro esempio dell'ideologia idiota e superficiale di mettere lo stile sulla funzionalità. Questo è in primo piano rispetto a come dovrebbe essere ed è indicativo dello scemo della società per me. Le barre di scorrimento hanno uno scopo funzionale importante che altri metodi alternativi non possono sempre replicare. Penso che il cambiamento si basi in parte sull'idea che le persone usano i touchscreen, quindi non è necessario, ma molte persone ancora non lo fanno. Molti metodi alternativi richiedono maggiore concentrazione e finezza per manipolare il che è uno spreco di energia che preferirei spendere per fare un lavoro, piuttosto che combattere con una cattiva interfaccia utente. I metodi di scorrimento tradizionali di solito si combinano con lo scorrimento della tastiera premendo il tasto freccia giù, che trovo molto più facile rispetto ad altri metodi che richiedono maggiore concentrazione, ma con le barre di scorrimento rimosse, lo scorrimento della freccia della tastiera a volte scompare con esso, che dovrebbe essere un GRANDE no -no! Un esempio è Il grande social network F ha causato costantemente irritazione con il suo stile di scorrimento "dinamico" durante lo scorrimento della cronologia dei messaggi e dove non sai dove ti trovi nella conversazione mentre scorri verso l'alto, ma poi scorri verso l'alto certo punto e all'improvviso viene caricato un carico extra di cronologia delle conversazioni e si finisce per saltare molto avanti rispetto a dove si voleva essere.

Penso che sia anche in parte ignoranza e in parte il desiderio di risparmiare risorse e larghezza di banda sui server per risparmiare denaro delle aziende a spese dell'esperienza dell'utente. Si tratta anche di smorzare le cose per gli idioti per rendere le cose "più facili" da usare per comandi molto semplici, a scapito di rendere le cose più problematiche per chiunque non sia stupito e potrebbe voler fare qualcosa di così leggermente fuori dall'ordinario. Spero che la blockchain preannunci la fine di questa era di sacrificio dell'esperienza dell'utente per risparmiare denaro e possiamo avere sistemi che funzionano rapidamente e che sono privi di seccature sia per utenti di base che avanzati.

Ad esempio, non sarebbe bello se software come skype e F messenger ti permettessero di scorrere immediatamente fino all'inizio della tua cronologia di msg invece di aspettare per sempre il caricamento di sezione dopo sezione ?! Ho sempre sospettato che ciò consistesse nel risparmiare risorse caricando l'intero lotto in una volta. Tuttavia, se qualcuno con un po 'di intelligenza e pensiero sfumato stesse progettando questo, (più comune nei circoli blockchain rispetto alle società, spero), potremmo tutti avere la nostra torta e mangiarla. Possiamo risparmiare risorse (che non è ancora una cosa banale nemmeno nella blockchain) e ottenere le informazioni che vogliamo istantaneamente senza dover sopportare questo orribile sistema di caricamento delle pagine per pagina.

Disporre semplicemente la struttura dell'intera cronologia della cronologia su una barra di scorrimento insieme alle date che compaiono mentre si scorre. Non appena si rilascia il pulsante del mouse o si scorre lo strop, quella particolare sezione può essere caricata. Se vuoi tornare all'inizio, scorri verso l'alto e devi caricare solo la prima pagina. Se hai bisogno di tutto da caricare immediatamente, ad esempio per cercare una parola chiave, allora basta fornire un semplice pulsante che può essere premuto, se necessario, per ottenere l'intera cronologia di msg o la cronologia di tutto ciò che stavi scorrendo.

Se qualcuno segnala specificamente che è necessario caricare tutto ciò, la blockchain dovrebbe accogliere le risorse. Questa è la differenza tra esso e le società sul vecchio modello, che sospetto sarebbe riluttante a consentire anche a quelli che hanno specificamente bisogno di tutto da caricare, di poterlo fare per proteggere le loro risorse per il loro sporco motivo di profitto e fregare l'utente. Questo è il motivo per cui abbiamo bisogno della blockchain, e preferibilmente della versione aperta.

11
Lex

Come punto di vista misto ...

Le barre di scorrimento orizzontali sono in genere una cosa negativa. Può significare che hai ottimizzato per la larghezza dello schermo di un monitor per PC, che non si traduce bene in dispositivi mobili. Quando si scorre verso il basso, la lettura dell'intera pagina richiede molti scorrimento da sinistra a destra per ogni schermata di contenuto. E viceversa quei siti avranno sprecato spazio su schermi più grandi. (Lettori più vecchi, ricordi i siti web che dicevano "I migliori da vedere a 1024x768"? Sì, quelli.) Non dovremmo tollerarli nel 2019, non sono gli anni '90 e non stiamo ancora usando Netscape Navigator. Basta non andarci.

D'altra parte, le barre di scorrimento verticali vanno bene. Siamo intuitivamente abituati a scorrere verso il basso qualcosa, ad esempio pensate a come leggereste un giornale di carta. L'intera pagina è facilmente visibile con solo pergamene su/giù.

C'è una scuola di pensiero che oltre 2 o 3 schermi pieni di contenuti siano troppo però. Dopodiché diventa difficile trovare cose. Quindi, mentre le barre di scorrimento funzionano, non lasciare che ti porti a pagine di lunghezza illimitata!

8
Graham

Sì, le barre di scorrimento dovrebbero essere visibili, se non altro per motivi di accessibilità.

Ci sono molti casi in cui nascondere una barra di scorrimento rende inutilizzabile il tuo sito/programma tra frustrante e borderline:

  • Utilizzo di hardware/software assistivo per accedere alla tua pagina
  • Usando un mouse che non ha una rotella di scorrimento
  • Utilizzo di un sistema desktop remoto che non passa attraverso gli eventi di scorrimento
  • Utilizzo di un touchpad che scorre utilizzando i gesti con più dita (la maggior parte degli utenti medi non sa che esistono)
  • Utilizzando un touchscreen, la pagina è alta più di un paio di schermate e devo scorrere da qualche parte all'altra estremità della pagina
  • Usando un touchscreen, scorrendo una pagina piena di collegamenti/pulsanti (in cui è probabile che il movimento tap-and-flick possa attivare accidentalmente qualcosa)

Le barre di scorrimento visibili sono un modo semplice per evitare tutti questi problemi. Se l'argomento principale del tuo collega è che lo stanno facendo altri siti, non ascoltarlo nemmeno. La pressione dei pari non è un argomento valido a meno che non sia accompagnato da una ragione significativa e significativa perché farlo è una buona idea. Questo tipo di pensiero è come il <blink> il tag è diventato popolare.

Anche per motivi di accessibilità, non implementare le barre di scorrimento. Utilizzare quelli forniti dal sistema. La tecnologia di assistenza non può sempre identificare barre di scorrimento fatte in casa e gestirle come tali.

7
bta

Una barra di scorrimento è estremamente utile

  1. mostra all'utente che la pagina è scorrevole
  2. mostra all'utente dove si trovano attualmente nella pagina scorrevole

Non hai idea di quante volte mi sono incazzato e perso perché un progettista schifoso ha pensato che cancellare la barra di scorrimento fosse una buona idea.

3
Solid_Metal

Per aggiungere alla risposta di MichaelS,

Su tablet e iPad, è preferibile una barra di scorrimento non afferrabile, che si nasconde quando non si scorre,. Come ha detto, lo scorrimento su dispositivi touch è molto più preciso e le barre di scorrimento visibili, afferrabili sono goffe e fastidiose. Tuttavia, a seconda della lunghezza della pagina, sarebbe gradito un pulsante Torna all'inizio.

Inoltre, mentre scrivevo questo su StackExchange utilizzando un iPad Pro da 12,9 pollici, ho notato che l'aggiunta di una discreta quantità di imbottitura (~ 1 cm), con un tono leggermente diverso, è utile in quanto consente lo scorrimento senza aprire accidentalmente i collegamenti.

2
Bob Kerman

Una domanda interessante, il mio 2c proviene da uno sviluppatore ma UX guida e ha anche progettato interfacce con diverse aree scorrevoli interne.

Alcuni punti:

  1. Le barre di scorrimento visibili dovrebbero esistere se il contenuto è abbastanza grande da richiedere uno scorrimento, poiché la presenza di una barra di scorrimento indica e consente di scorrere il contenuto.
    • Lo scorrimento infinito è la mia idea personale dell'inferno, specialmente se hai fatto clic sulla barra della traccia e la stai trascinando (tangente sopra)
  2. Se il contenuto non può essere fatto scorrere, le barre di scorrimento sono un anti-economico che suggerisce cose che non possono accadere.
    • Un caso Edge è qualcosa che non può essere fatto scorrere ora ma potrebbe essere in grado di dire, il contenuto aumenta di dimensioni, questo è comune negli editor o in qualsiasi sistema con output dinamico. In particolare perché se aggiungi/rimuovi la funzionalità di scorrimento, puoi rovinare i layout, otterrai un orizzontale jank man mano che il contenuto si estende e quindi appare la barra di scorrimento. (se usi overflow: auto per esempio). In questo caso può essere più facile inserire una barra di scorrimento disabilitata per indicare che si tratta di un'area scorrevole, ma il contenuto non è ancora abbastanza grande da consentire questo comportamento.
  3. Le barre di scorrimento orizzontali sono generalmente una cattiva idea se combinate con barre di scorrimento verticali in quanto introduce e seleziona la modalità implicita. Come in, l'impostazione predefinita da uno scroll del mouse è normalmente lo scroll verticale, ma con un'aggiunta implicita del tasto (o interazione del trackpad) è possibile ottenere lo scorrimento orizzontale. La complessità di ciò si ottiene molto raramente.
  4. All'interno di alcune interfacce dell'applicazione (ad es. Mappe Slippy) la rimozione di tutte le barre di scorrimento può essere una buona idea, poiché il contenuto si sposta sotto la finestra del browser in quel paradigma, non viceversa. I controlli sono ben compresi dalla maggior parte degli utenti.
  5. Cercare di stile le barre di scorrimento non è una buona idea il 99% delle volte a meno che tu non voglia molte versioni personalizzate specifiche, quindi ammetto che non sembreranno perfette in tutti gli ambienti e usi le impostazioni predefinite del browser.
1
dougajmcdonald

Il designer sta parlando di sostituire le barre di scorrimento con un pulsante di scorrimento verso il basso/verso l'alto? Penso che sia ragionevole perché si tratta di un approccio mobile-first e ho visto che viene utilizzato con successo in determinati contesti, ma quei pulsanti non possono sostituire le barre di scorrimento in una griglia.

0
Ling