Share
È probabilmente la parte meno glamour del web design, ma il design delle informazioni non è affatto il meno importante. Individuare e consumare informazioni è l'attività web per eccellenza, che sorpassa di gran lunga l'acquisto, la riproduzione e la comunicazione, ognuna delle quali include una buona parte della progettazione delle informazioni stesse. Il modo in cui gli utenti trovano e poi si avvalgono di tutte queste informazioni è influenzato da come è strutturato e presentato. Quindi ogni web designer dovrebbe essere equipaggiato per prendere decisioni qualificate e informate su come farlo.
Il design delle informazioni è un problema che diventa sempre più complesso più grande è il sito web. Tuttavia, anche un piccolo sito Web trarrà vantaggio da una procedura metodica e graduale per capire come ordinare e organizzare il contenuto del sito. Ecco alcuni semplici passaggi che potresti voler prendere:
Quindi, per un semplice esempio di ristorante potresti scoprire di avere un testo per le pagine da 1 a 20, sai che gli utenti cercheranno di completare alcune attività come fare una prenotazione. Potresti anche vedere che gli obiettivi di un utente sul sito sono scoprire che cosa serve il ristorante, dove si trova e se ci sono tavoli, e quindi, se tutto va bene, fare una prenotazione. Infine, gli obiettivi del cliente potrebbero essere quelli di servire l'utente, ma anche di spingerli verso una serie di offerte speciali che eseguono.
Anche con un semplice esempio come il nostro sito del ristorante, ci sono molti modi per definire le informazioni. Ad esempio potresti spingere le offerte speciali direttamente nella home page, oppure puoi legarle al processo di prenotazione, oppure potresti inserirle nei menu. Allo stesso modo potresti scoprire che, dati gli obiettivi di un cliente, avrai una priorità diversa sul contenuto della pagina. Forse il cliente ti dice che nessuno è mai in grado di trovare questo ristorante, quindi devi fare una pagina Come arrivare qui e dargli una priorità alta.
Sviluppa una mappa del sito o un piano di come le informazioni verranno collocate in modo gerarchico. Sebbene le sitemap siano di solito solo un insieme di riquadri che indicano le pagine, puoi lavorare in tutti i tipi di informazioni aggiuntive che spiegano come verrà impostato il sito, inclusi elementi come i collegamenti rapidi dalla home page, come diverse sezioni potrebbero collegarsi tra loro e percorsi che un utente può seguire attraverso una mappa del sito.
I siti con una quantità ragionevole di complessità possono essere riorganizzati e riorganizzati molti diversi modi. Un sito su cui ho lavorato per organizzare e riorganizzare innumerevoli volte è FlashDen. Ho perso il conto del numero di volte in cui ho guardato quel menu e l'ho riorganizzato. In alcuni casi spostiamo semplicemente le pagine in insiemi e gruppi diversi in modo che sembrino più logici, mentre in altri abbiamo introdotto un modo di pensare fuori dagli schemi.
Ad esempio alcuni mesi fa il menu stava diventando eccessivamente complesso, quindi abbiamo rimosso un intero mucchio di voci di menu più "soffici" e creato un blog che ora ospita concorsi, newsletter, collegamenti di siti secondari e altre pagine che stavano ingombrando il menu.
Recentemente abbiamo scoperto che abbiamo molti di quelli che io chiamo "ritardatari", cioè pagine senza una casa nel menu. Dal punto di vista del design dell'informazione, i ritardatari sono terribili - anche io non riesco a ricordare come raggiungerne alcuni! Questa volta la soluzione è quella di costruire un sistema wiki, canalizzare il contenuto di livello superiore nel menu dietro le quinte, e quindi utilizzare il wiki per ospitare livelli di informazione più profondi con le proprie funzionalità di ricerca, tagging e categorizzazione.
Il punto delle mie esperienze con FlashDen è che l'organizzazione delle informazioni non deve necessariamente riguardare la messa in menu e sottomenu. Potresti scoprire che alcune informazioni non dovrebbero essere su un sito, o che richiede un sito secondario, o che devi fare qualcos'altro. Con FlashDen ho il vantaggio che sono passati quasi 3 anni da quando guardo i contenuti e ancora oggi trovo nuovi arrangiamenti e soluzioni.
Per essere un efficace progettista dell'informazione e per trovare le soluzioni ottimali spesso è necessario pensare fuori dagli schemi. Naturalmente dire "pensare fuori dagli schemi" è molto più facile da dire che da fare! A volte siamo costretti in una scatola che non possiamo nemmeno vedere. Qualche tempo fa ho sentito di un esperimento in cui un gruppo di insetti saltatori sono stati collocati in una scatola di vetro e col tempo hanno imparato a saltare solo così in alto. Quando il coperchio di vetro fu rimosso, gli insetti continuarono a saltare la stessa altezza ridotta, non rendendosi nemmeno conto di poterlo fare se volevano uscire.
Quindi come si supera una scatola che non si vede? Semplice! Con l'aiuto di altri che non sono limitati dagli stessi problemi che hai. Per progetti di informazioni complesse, spesso chiedo ad altre persone idee organizzative dando loro solo il problema grezzo e non le mie permutazioni personali. Dire che le idee di un programmatore o le opinioni di un utente ti sorprenderanno spesso dato che le loro prospettive sono completamente diverse dalle tue e senza ostacoli con gli stessi modi di pensare.
Quando organizzi grandi insiemi di informazioni, una domanda ovvia che sorge sempre è quanto profondo o quanto largo dovrebbe essere la tua navigazione. La profondità si riferisce a quanti livelli di categorie e sottocategorie ci sono, mentre la larghezza riguarda quanti di ogni livello ci sono. Il trucco è trovare l'equilibrio. Se ci sono troppi articoli su un singolo livello, specialmente il livello superiore, rischi di confondere l'utente. D'altra parte se un utente deve fare clic su molti livelli, rischi di perderli.
Una buona regola è quella di mantenere il numero di opzioni su un dato livello a 4 - 8. Se si hanno 8 elementi di livello superiore, ognuno con 8 sottocategorie e ognuno con 8 sottocategorie, si avrà abbastanza spazio per un 512 pagine. Ovviamente raramente le cose si bilanciano automaticamente così bene. Quindi, di nuovo, devi stare attento a non avere un lato pesante e un lato leggero. Ad esempio, su un sito con un paio di centinaia di pagine, se si inserisce contatto fino al livello più alto da qualche parte, è probabile che non avrà 8 sottocategorie con 8 sottocategorie. È più probabile che contatto sarà una sezione piuttosto semplice, anche per un sito complesso.
Il rovescio della medaglia se non si mette qualcosa di simile contatto al livello più alto, è possibile ottenere una profondità di informazioni più bilanciata, tuttavia si rischia di non avere completato un compito utente importante perché sarà difficile capire come trovare le informazioni di contatto. Una soluzione semplice a questo particolare problema potrebbe essere l'aggiunta di "link rapidi" in cui si fornisce all'utente alcune opzioni sulla home page per entrare più in profondità nella struttura senza navigare nel modo consueto.
Non so voi, ma è seriamente raro che legga sempre una pagina web. Sia che si tratti di leggere istruzioni, termini e condizioni, o semplicemente una copia regolare, la maggior parte delle volte scuoto, scansiona e salta. Supponendo che non sia l'unico a farlo, ha senso progettare pagine per facilitare questo modo di consumare informazioni.
Non avvolgere le informazioni chiave in gruppi di testo - evidenziarlo. Non dare paragrafi agli utenti alla fine - suddividili con intestazioni, sottotitoli, punti elenco, diagrammi, qualunque cosa serva! Pensa a come un utente utilizzerà il tuo sito e lo progetta per facilitarne l'uso.
Un buon esempio di progettazione per il consumo degli utenti è sul nostro sito gemello NETTUTS, un sito che, come molti di voi conoscono, pubblica tutorial su argomenti di sviluppo web. Ora su NETTUTS abbiamo notato subito che la maggior parte delle persone, alla prima visione di un tutorial, salta fino alla fine, dove cercano di trovare un collegamento a una demo e / o codice sorgente in modo che possano decidere se il tutorial vale la pena di leggerlo nel primo posto. Una volta capito questo, è stato semplice aggiungere speciali pulsanti Demo e Source e posizionarli coerentemente nella parte superiore delle esercitazioni. Questo semplice adeguamento per abbinare il nostro design ai modelli di consumo degli utenti ci ha portato a lotto di buon feedback.
Non sono sicuro che sto invecchiando, o se passare tutto il mio tempo davanti a uno schermo mi sta solo facendo diventare pignoli, ma ultimamente mi dà fastidio quando mi viene presentato un testo che non mi obbliga a leggilo. Lo scopo del design di un sito è solitamente quello di trasmettere informazioni e la maggior parte di esse è un testo scritto, quindi concentrarsi sulla sua visualizzazione dovrebbe essere una priorità.
L'uso di caratteri troppo piccoli, il basso contrasto tra il testo e il colore di sfondo, o l'uso errato di testo chiaro su uno sfondo scuro, sono tutti peccati di design di cui tutti siamo stati colpevoli (io in molti in un'occasione!) Ma oltre a questi, ci sono altri modi in cui il tuo disegno può effettivamente leggere il visitatore. Mira a progettare in modo tale che il tuo layout focalizzi i visitatori sulla copia e li porti con titoli, sottotitoli, demarcazioni, pullquotes e altre tecniche per attirare l'attenzione.
In precedenza ho menzionato Percorsi utente - questo è il modo in cui gli utenti tendono ad attraversare un sito web. Molti di questi verranno semplicemente dal modo in cui le persone si comportano, ma con la pianificazione, puoi scegliere come guidare un utente sia attraverso una singola pagina che attraverso più pagine. Una volta che conosci percorsi specifici, puoi lavorare su guide visive e link per aiutarli a muoversi lungo quel percorso.
Ad esempio su FlashDen, quando arriva un nuovo utente, è nostro obiettivo farli registrare, trovare file, depositare denaro e quindi acquistare quei file. Quindi, per prima cosa forniamo loro un riepilogo del processo in quattro fasi sulla home page, quindi ad ogni fermata ci sono indicazioni per indirizzare l'utente sul passaggio successivo. Nella nostra prossima riprogettazione spero di rendere questo percorso ancora più ovvio in quanto è essenziale che il sito funzioni come dovrebbe. Si noti che il percorso che sto descrivendo non è di 4 pagine, ma di 4 attività. Ad esempio, la ricerca di file potrebbe implicare che l'utente guardi dozzine di pagine, ma è un compito discreto. Non è necessario che i percorsi utente passino attraverso le pagine impostate, ma possono comprendere altrettanto facilmente le attività impostate!
Va da sé che per gli utenti è più semplice che complicato. Tuttavia è fin troppo facile sovrapporre i progetti. So che spesso faccio sembrare le cose più complicate in modo da avere più elementi visivi su una pagina con cui lavorare (cattiva Collis, cattiva Collis!) Un'altra pecca di eccessiva complicazione sta usando parole inutili sui pulsanti e inviti all'azione. Steven Krug nel suo eccellente libro Do not Make Me Think
fornisce l'esempio di un ipotetico sito di lavoro con un pulsante che dice:
Uno di questi è chiaro, uno è abbastanza ovvio, e uno è - beh, chi lo sa.
Come designer, noi più della maggior parte, conosciamo il valore di un buon visual. E ci sono molte opportunità per diagrammare o visualizzare alcuni dati, concetti o informazioni. Questo stesso articolo, come ricorderete, inizia con un diagramma molto basilare di come si riferiscono il design dell'interfaccia, il design delle informazioni e il design estetico. Queste immagini non solo spezzano il testo, ma sono anche più memorabili e ti danno l'opportunità di dare vita a una pagina.
DoshDosh ha un interessante articolo sulla visualizzazione delle informazioni, i diagrammi e ciò che l'autore chiama infografica che vale la pena controllare anche se è solo per vedere gli esempi grafici brillanti.
Il design delle informazioni è una di quelle cose che è difficile ottenere subito al primo tentativo. Quindi, una volta creato un sito, dovresti analizzarlo per vedere come le persone usano e digeriscono le informazioni, come si comportano e dove puoi migliorare il tuo design.
Uno strumento pulito a questo proposito è Google Analytics. Ad esempio, dove ho menzionato i percorsi utente in precedenza, Analytics ti consente di tracciare percorsi attraverso le pagine utilizzando la funzione Obiettivi. Si imposta una sequenza di pagine e Analytics riporterà il% dei visitatori che lo attraversano (e per estensione scatti) in ogni punto.
Un'altra funzione di Analytics che puoi utilizzare è il monitoraggio dei termini di ricerca che ti consente di vedere cosa cercano gli utenti nel campo di ricerca del tuo sito. Sapere cosa cercano le persone ti dice quali informazioni devono essere più prontamente disponibili!
Questo post è il terzo giorno della nostra sessione di Web Design. Sessioni creative "Session Day 2Session Day 4"
Accentsconagua