La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

Web Design Fabio Vitali. 2 Sommario Oggi esaminiamo in breve categorie e soluzioni di progettazione di siti Web. In particolare: La progettazione dell’informazione.

Presentazioni simili


Presentazione sul tema: "Web Design Fabio Vitali. 2 Sommario Oggi esaminiamo in breve categorie e soluzioni di progettazione di siti Web. In particolare: La progettazione dell’informazione."— Transcript della presentazione:

1 Web Design Fabio Vitali

2 2 Sommario Oggi esaminiamo in breve categorie e soluzioni di progettazione di siti Web. In particolare: La progettazione dell’informazione Le peculiarità del Web come medium Principi di design del Web Principi di organizzazione dei contenuti Principi di navigazione Principi di presentazione L’usabilità di un sito Web

3 Fabio Vitali 3 Tre dimensioni della interazione Information Design: l’organizzazione e la presentazione di dati al fine di una loro significativa trasformazione in informazione. E’ una disciplina molto recente. Interaction Design: il creare e raccontare le storie. Il medium ha un’influenza determinante sullo stile del racconto. In particolare il ruolo dell’interazione con lo spettatore può essere molto diverso. E’ arte antica e scienza nuova. Sensorial Design: l’utilizzo ottimale di tutte le tecniche che usiamo nel comunicare: graphic design, cinematografia, tipografia, ingegneria dei suoni, musica, più tutti i sensi ancora non esplorati: tatto, olfatto, gusto, ecc.

4 Fabio Vitali 4 Information Design (1) Si occupa di aspetti della comunicazione come organizzazione, presentazione, senso e messaggio, chiarezza e complessità. Alla base di tutto c’è la consapevolezza che il dato, in sé, è sostanzialmente inutile o neutro. E’ nella sua preparazione per la comunicazione che acquista significato e valore, che diventa informazione. Inoltre l’informazione non è la conclusione del continuum chiamato comprensione: l’informazione va trasformata in conoscenza, che a sua volta, digerita e connessa con il resto, diventa sapienza.

5 Fabio Vitali 5 Information Design (2)

6 Fabio Vitali 6 InformazionePromozione Transazione Tre dimensioni del Web (1) Informazione (contenuto, publishing) libri, articoli, manuali, specifiche L’unità base è il fatto (anche se opinionato) Promozione (entertainment, marketing) Immagine, senso della comunità, atteggiamento mentale L’unità base è l’esperienza Transazione (vendita, scambio) Ordini, e-commerce, B2B, B2C L’unità base è la transazione

7 Fabio Vitali 7 InformazionePromozione Transazione Tre dimensioni del Web (2) Molti siti (in particolare quelli commerciali) in realtà presentano una mescolanza delle tre dimensioni: Specifiche del prodotto Giochi, concorsi, esibizioni Acquisto e gestione dell’ordine Rapporto annuale Catalogo dei prodotti Novità Gioco a premi

8 Fabio Vitali 8 Biblioteca e galleria d'arte Jeffrey Veen propone una classificazione in un continuum tra gli estremi di massimizzazione della presentazione e massimizzazione dei contenuti: La biblioteca ha una grande collezione di informazioni disponibili. Si preoccupa di fornirti i mezzi per accedere a questa informazione nella maniera più semplice e universale possibile. Il criterio di valutazione è la conoscenza. La galleria d'arte offre una presentazione controllata dei suoi contenuti. Si preoccupa di fornirti una presentazione orchestrata per darti un'esperienza estetica meticolosamente curata. contenutipresentazione BibliotecaGalleria d'arte

9 Fabio Vitali 9 La gestione dei contenuti Rendere i contenuti accessibili a chiunque Gestire in maniera semplice e uniforme tutte le fasi di gestazione di un prodotto editoriale Gestire in maniera semplice ed uniforme tutti i possibili usi di un medesimo contenuto: su carta, su video, su terminale Braille, su sintetizzatore vocale, ecc. Gestire in maniera semplice ed uniforme tutti i possibili riusi di un medesimo contenuto: libro, indice, sito web, catalogo, archivio, … Rendere il testo accessibile nel tempo Il recupero dei dati del Census Bureau del 1960 ( ) Il recupero dei dati per il progetto LUNR del 1969 (1986- ????) Brewster Kahle Bruce Sterling Boeing e la digitalizzazione dei manuali degli aerei.

10 Fabio Vitali 10 Accessibilità nel tempo (1) Medium fisico La corretta conservazione delle tracce ottiche, elettriche o magnetiche sul supporto fisico prescelto. Hardware La periferica usata per la scrittura e lettura delle informazioni Il computer su cui questa periferica funziona Software Sistema operativo in grado di far funzionare il computer Driver in grado di far funzionare le periferiche prescelte Applicazione in grado di leggere i dati dal medium fisico Interpretazione Il formato dei dati in cui il contenuto è stato scritto( mescolando il contenuto vero e proprio con funzioni dell'applicazione originaria) La codifica dei caratteri usata (il meccanismo di conversione dei codici numerici in caratteri di un alfabeto)

11 Fabio Vitali 11 Accessibilità nel tempo (2) Problema HW: migrazione dei dati La predominanza degli hard disk sui medium esterni e il costo in diminuzione dell'hardware connesso rendono possibile il trasferimento di tutti i dati sulla nuova macchina appena acquistata Problema SW: conversione Non altrettanto semplice, non altrettanto efficace, non altrettanto automatizzabile, non altrettanto universale. Richiede ancora una buona dose di lavoro manuale, in quantità proporzionale alla quantità di dati da trattare. Entrambe richiedono attenzione costante nel tempo, ma per il software è più difficile.

12 Fabio Vitali 12 Livelli diversi di riuso Riaccedere in lettura ai dati Corretta lettura del media fisico Reinterpretare i dati Corretta identificazione delle caratteristiche del formato dati Rieseguire le applicazioni di manipolazione Disponibilità e compatibilità (diretta o via emulazione) delle applicazioni originali Modificare e aggiornare i dati Conversione dei dati alle applicazioni odierne senza perdita di informazioni Realizzare nuove funzionalità sui dati Adattare le vecchie informazioni alle nuove applicazioni in modo da permettere l'esecuzione di nuove funzionalità

13 Fabio Vitali 13 Cos’è il markup? Definiamo markup ogni mezzo per rendere esplicita una particolare interpretazione di un testo. Per esempio, tutte quelle aggiunte al testo scritto che permettono di renderlo più fruibile. Oltre a rendere il testo più leggibile, il markup permette anche di specificare ulteriori usi del testo. Con il markup per sistemi informatici (il nostro caso), specifichiamo le modalità esatte di utilizzo del testo nel sistema stesso. Il markup non è soltanto un’inevitabile e sgradevole risultato della informatizzazione dell’arte tipografica. Non è qualcosa che sta con noi a causa dell’informatica.

14 Fabio Vitali 14 Modi del markup: proprietario vs. pubblico Un formato proprietario è stato creato da una specifica azienda con uno specifico scopo commerciale. L'azienda ne detiene i diritti, e dunque è in grado di modificarlo, aggiornarlo o rivoluzionarlo in qualunque momento e per qualunque motivo. Un formato pubblico è stato creato da un gruppo di interesse (individui, aziende, enti non commerciali, ecc.) come modello di armonizzazione tra le esigenze di ciascun partecipante. Il gruppo tipicamente pubblica le specifiche del formato, permettendo a chiunque di realizzare strumenti software per quel formato. A volte questo si concretizza in uno standard ufficiale, avente valore normativo.

15 Fabio Vitali 15 Modi del markup: binario vs. leggibile Un formato binario è la memorizzazione esatta delle strutture in memoria dell'applicazione, che niente hanno a che vedere con le esigenze di comprensione di esseri umani. Il testo non è visibile o è visibile per caso. Un formato leggibile invece è fatto per essere, in casi speciali, letto anche da esseri umani, che possono intervenire per operazioni di emergenza. L'applicazione deve trasformare quanto legge in una struttura interna utile per le operazioni di modifica o presentazione. Questa fase si chiama parsing.

16 Fabio Vitali 16 Esempio:.doc di MS Word

17 Fabio Vitali 17 Esempio: Quark Xpress

18 Fabio Vitali 18 Esempio: Adobe PageMaker

19 Fabio Vitali 19 Esempio: PDF

20 Fabio Vitali 20 Esempio: RTF di MS Word

21 Fabio Vitali 21 Esempio: PostScript

22 Fabio Vitali 22 Esempio: HTML

23 Fabio Vitali 23 Esempio: XML

24 Fabio Vitali 24 Modi del markup: interno vs. esterno Il markup interno inserisce istruzioni di presentazione all'interno del testo, in mezzo alle parole. Il markup esterno prevede due blocchi di informazioni: il contenuto e il markup, separati e collegati da meccanismi di indirezione Il markup interno richiede sintassi particolari per distinguere il markup dal contenuto. Tipicamente si adottano segnalatori particolari che cambiano il tipo di interpretazione del documento. La presenza del carattere segnalatore nel testo richiede l'adozione di tecniche di escaping. Il markup esterno richiede un meccanismo di indirezione, basato su indirizzi, offset o identificatori, per associare con correttezza il markup al contenuto.

25 Fabio Vitali 25 Modi del markup: procedurale vs. descrittivo Markup procedurale Il markup procedurale consiste nell’indicare con precisione ad un sistema automatico che effetto attivare e che procedura (serie di istruzioni) eseguire nella visualizzazione del contenuto. In definitiva, utilizzo le capacità del sistema di presentazione per avere con precisione l’effetto voluto. Markup descrittivo Il markup descrittivo consiste nell’identificare strutturalmente il tipo di ogni elemento del contenuto. Invece di specificare effetti grafici come l’allineamento o l’interlinea, ne individuo il ruolo all’interno del documento, specificando che un elemento è un titolo, un paragrafo, o una citazione.

26 Fabio Vitali 26 Effetti dei modi del markup Formati proprietari, binari, procedurali sono intrinsecamente legati ad un hic et nunc, che lega e limita: Scopo del contenuto Strumento di accesso al contenuto Durata della disponibilità del contenuto Un formato pubblico, testo, dichiarativo, al contrario, può permettere: Nuove applicazioni dello stesso contenuto Accesso con strumenti diversi e futuribili Lunga vita ai contenuti

27 Fabio Vitali 27 L’usabilità di un sito Web Nello studio dell’usabilità, dobbiamo valutare: Come organizzare i contenuti Come organizzare la navigazione Come organizzare la presentazione Cosa contribuisce all’usabilità Evitare gli errori più comuni di usabilità Organizzare il feedback degli utenti.

28 Fabio Vitali 28 Organizzazione dei contenuti Individuazione della gerarchia dei contenuti (profondità vs. ampiezza) Gestione della gerarchia dei contenuti (subsites, directories, canali) Presentazione all’utente della gerarchia e dell’ampiezza dei contenuti (essenzialità vs. eclettismo)

29 Fabio Vitali 29 Organizzazione della navigazione “dove sono?” e “dove posso andare?” Sfruttamento di: Navigation bars Breadcrumbs trails Sitemaps Titoli di pagina Links Logo con link alla home page Motori di ricerca

30 Fabio Vitali 30 Organizzazione della presentazione Coerenza Discrezione (sobrietà) Scansionabilità

31 Fabio Vitali 31 L’usabilità di un sito Web (1) Uno studio importante (Jared Spool) ha valutato l’effettiva usabilità dei siti con un controllo a doppio cieco. In particolare ha messo alla prova alcuni preconcetti. Ecco alcuni risultati. La progettazione dell’usabilità è uguale per applicazioni di desktop e siti Web -> I siti Web non sono come le applicazioni del computer. L’usability testing usato per le applicazioni è poco adatto per il Web. Ad esempio, la user preference nelle applicazioni è una misura della usabilità, nel Web dell’interesse totale. L’usabilità dei siti Web è indipendente da natura e scopo - > L’information retrieval non è il surfing. Nel surfing, l’utente si aspetta sorprese e serendipità. Nell’information retrieval, si aspetta di ottenere e presto le informazioni che gli servono.

32 Fabio Vitali 32 L’usabilità di un sito Web (2) La grafica aiuta -> La progettazione grafica non guasta… ma non aiuta! Siti molto testuali rendevano altrettanto di siti molto grafici. L’uso della grafica non sposta in maniera sensibile l”usabilità del sito. E’ possibile progettare il sito indipendentemente dai contenuti -> Navigazione e contenuto sono inseparabili. La shell strategy (qualcuno che si occupa del feeling generale del sito, e lascia ai vari dipartimenti di creare il contenuto relativo) funziona poco. Non genera un struttura chiara e uniforme. I link di testo sono un’inutile ripetizione -> I link testuali sono fondamentali. Il testo viene disponibile prima dell’immagine. Per un surfing senza scopo, o per una ricerca di informazioni specifiche, il link di testo viene cliccato più spesso, ancora prima che la pagina abbia finito di caricare.

33 Fabio Vitali 33 Progettazione del contenuto (1) Jakob Nielsen, 1999 Velocità: Il tempo di risposta tra click e pagina completa dovrebbe essere ≤ 1sec per Intranet, e ≤ 10 sec per Internet. Questi sono risultati teorici universali: la percezione di continuità dell’azione si interrompe per attese superiori al decimo di secondo. Dopo un secondo, la percezione di lentezza è evidente. Dopo dieci secondi, l’attenzione è inevitabilmente attratta altrove e l’utente inizia a svolgere un’altra azione. Con un modem a 56 Kb, questo significa pagine (complessivamente) < 4kb per Intranet, e < 60 kb per Internet. Broken link: Gli utenti odiano i broken link (404 not found). Secondo un’indagine del 1998, 23% delle pagine ne contiene uno. Da notare che esistono tool per controllare automaticamente i link.

34 Fabio Vitali 34 Progettazione del contenuto (2) Graceful degradation: Ogni nuova versione di browser ci mette circa 2 anni per diventare diffusa. Inoltre nuovi meccanismi di accesso limiteranno la disponibilità di browser sofisticati (PDA, telefonini, ecc.). Scrolling: pochi utenti scrollano oltre la prima schermata di una pagina. E’ necessario tenere le pagine corte, e mettere gli elementi di contenuto più importanti nella prima schermata. Le righe orizzontali suggeriscono psicologicamente la fine della pagina. Scan vs. read: la maggior parte degli utenti non leggono la pagina parola per parola, ma fanno una scansione approssimativa fermandosi su termini evidenziati, prime righe dei paragrafi, link.

35 Fabio Vitali 35 Progettazione del contenuto (3) Color overload (link overload): Se tutto è evidenziato, grassetto, link,ecc., niente è più identificabile. Troppi link, e link troppo lunghi, sono nocivi. Rari i link interni alla pagina: I link interni possono confondere gli utenti, perché si aspettano si essere portati ad altre pagine. URL come parte dell’interfaccia: L’URL viene usato spesso come meccanismo per comprendere la struttura e il modello concettuale di un sito. URL corti, con domini facili da ricordare, nomi significativi, e facili da digitare aiutano a ricordarsi. Meta-informazioni, search e titoli: Spesso il lettore arriva alla pagina attraverso un motore di ricerca. Bisogna indirizzare correttamente questi lettori. Per esempio rendendo le pagine elementi autonomi del sito (sempre tutte le informazioni di contesto).

36 Fabio Vitali 36 Principi di navigazione (1) Fleming, 1998 La navigazione è ciò che differenzia il WWW da altri medium. Alla base di una navigazione di successo c’è l’orientamento. Quattro sono le domande che si pone l’utente a riguardo della navigazione: Dove sono? Dove posso andare? Come ci arrivo? Come faccio a tornare dove ero prima? Esistono dei principi che ci possono aiutare nel dare risposta a queste domande?

37 Fabio Vitali 37 Principi di navigazione (2) Facilità dell’apprendimento: anche se il contenuto è misterioso, arrivarvi non dovrebbe esserlo. Tanto più tempo è speso per capire i meccanismi di navigazione, tanto meno è speso per il contenuto. L’utente non possiede un sito come possiede un software, quindi non acconsentirà ad una curva di apprendimento lunga! Coerenza: L’abilità di predire gli elementi navigazionali di un sito è fondamentale nel fare scelte sensate. La coerenza aiuta a mantenere un senso di stabilità e predicibilità utile. Feedback: siamo abituati a aspettarci reazioni agendo sugli oggetti. Il feedback è l’unico modo che abbiamo per sapere se la nostra azione sta andando in porto.

38 Fabio Vitali 38 Principi di navigazione (3) Sfruttamento del contesto: quando eseguo azioni, ho bisogno degli strumenti a portata di mano. Quando navigo, ho bisogno di strumenti di navigazione vicino. In ogni caso, non basarsi MAI su un percorso prestabilito. Proposta di alternative: alternative sia tecnologiche (supporto per browser vecchi) sia di navigazione (site map, percorsi multipli, ecc.) permettono all’utente di massimizzare la propria esperienza relativamente alle proprie possibilità e necessità. Economia di azioni e tempi: in macchina, in aereo, sul Web, la gente perde interesse se il viaggio è lungo. Livelli e livelli di categorie e sottocategorie allungano l’interazione inutilmente.

39 Fabio Vitali 39 Principi di navigazione (4) Chiari messaggi visuali: il design grafico non serve solo per abbellire, ma anche e soprattutto per dare guida visuale. Gerarchie, movimenti, colori, posizioni e dimensioni aiutano a fornire suggerimenti sulle parti della pagina Etichette chiare e comprensibili: usare la terminologia appropriata per lo scopo. Ad esempio, “mappa” va bene in siti di un certo tipo, ma se il sito è di una città o un luogo fisico, molta gente si aspetterà una piantina del luogo o della città stessa.

40 Fabio Vitali 40 Principi di navigazione (5) Appropriatezza allo scopo del sito: la navigazione di un sito di shopping non è la stessa di un sito di informazioni o di comunità. Il meccanismo di navigazione deve rafforzare il senso del sito. Un approccio alla navigazione basato su icone misteriose ha senso in un sito di entertainment, pochissimo in un sito di identità aziendale. Supporto di goal e comportamenti dell’utente: di conseguenza, il sito deve favorire i goal più appropriati alla natura del sito stesso, e i comportamenti più comuni.

41 Fabio Vitali 41 Principi di progettazione dell’impatto (1) Jeffrey Veen Semplicità Essere capiti immediatamente è più elegante di essere decodificati. E’ importante essere ovvi online. Velocità Grandi colori. Poche immagini grandi. Se si deve osare, meglio osare in grande. Chiarezza Competizione significa meno tempo per essere compresi ed apprezzati. Devi spiegare, o esplorare? Ricordarsi che chiaro non è necessariamente noioso. Combatti le gerarchie Navigare è lungo e difficile. Pochi link fondamentali. No all’annidamento.

42 Fabio Vitali 42 Principi di progettazione dell’impatto (2) Padroneggia l’ipertestualità Nessuno legge, tutti cliccano. C’è un ritmo nella lettura, che viene spezzato dal blu dei link. Bisogna capire quando vale la pena mettere un link. Bisogna evitare di interrompere. Temi la multimedialità Video, animazioni e suoni sono affascinanti e pericolosi. I plug-in sono belli ma richiedono azioni. Segui l’audience Personalizzare il servizio, ma non eccedere. Osserva l’utente, ma senza invaderne la privacy.

43 Fabio Vitali 43 Riduzione della complessità Steve Krug, 2000 Approccio reale all'uso del Web Scansione, girovagare, approccio suffifacente (una via di mezzo tra sufficiente e soddisfacente) Difficoltà nella comprensione dell'organizzazione del sito (senso della scala, della direzione, della locazione) Riduzione del carico cognitivo Sfruttamento della struttura e del layout (immediata comprensione delle parti del sito) Scelte immediate ed ovvie (strutture strette e profonde o larghe e poco profonde) Keyword semplici e universali Riduzione del testo da leggere Imitazione e adeguamento al mercato Ausili alla navigazione: breadcrumbs, segnali di locazione, link alla home page

44 Fabio Vitali 44 I pericoli dei plug-in I plug-in permettono di arricchire l'esperienza Web con nuove rutilanti modalità, colorate, animate, sofisticate. Tuttavia bisogna ricordare che: Gli oggetti dei plug-in sono ospiti ma estranei alla pagina Web: non funziona il search, non vengono indicizzati dai motori di ricerca, non permettono visualizzazioni personalizzate, possono interagire in maniera strana con Back e Forward e con i bookmark. I plug-in sono tipicamente orientati ad un uso specifico: ad esempio, la visione su schermi a colori di personal computer collegati ad alta velocità ad Internet. Gli oggetti dei plug-in sono quindi inaccessibili al di fuori di queste situazioni. I plug-in aggiungono un ulteriore membro all'equazione complessa che lega le versioni e le marche dei browser, la disponibilità di specifiche feature, la internaziolizzabilità dei contenuti: la mancanza del plug-in corretto, la non disponibilità per il proprio sistema operativo, la non compatibilità per il proprio sistema operativo, la non compatibilità con altri software opzionali che possono avere alcuni utenti. Inserire contenuti nei plug-in (invece che solo decorazioni) ne predetermina una vita limitata e breve

45 Fabio Vitali 45 Principi di progettazione delle pagine Web Nome e logo su tutte le pagine Search se il sito ha più di 100 pagine Titoli di pagina e di paragrafo che abbiano senso fuori contesto. Facilitare lo scanning della pagina Strutturare la pagina in blocchi di dimensione ragionevole, e usare funzioanlità ipertestuali. Usare foto, ma con cautela Utilizzare tecniche di riduzione delle immagini basate sulla rilevanza. Usare i titoli nei link Adeguarsi a quello che fanno gli altri. Jakob’s law on Web User Experience: la gente passa la maggior parte del tempo online in altri siti, ed è lì che si forma le aspettative sul tuo.

46 Fabio Vitali 46 I dieci errori del Web design (0) Impedire l’uso del bottone Back Aprire nuove finestre Uso non standard di widget standard Pagine anonime (senza autori) Siti senza archivio Cambiare gli URL Titoli senza senso fuori dal contesto Adottare ogni singola tecnologia di moda Risposta del server lenta Banner e pubblicità (soprattutto cose che gli assomiglino)

47 Fabio Vitali 47 I dieci errori del Web design (1) Impedire l’uso del bottone Back E’ un widget usatissimo (2º dopo i link) E’ il modo più comune per ri-orientarsi Evitare nuove finestre (vedi #2), redirect immediati o pagine che impediscono il caching. Aprire nuove finestre Un atto aggressivo nei confronti dell’utente (chi ha il controllo del mio monitor?) Un nuovo elemento del desktop che non aggiunge nessuna utilità all’utente. Anzi spesso spesso non si accorge della nuova finestra (il bottone Back è grigio; perché?)

48 Fabio Vitali 48 I dieci errori del Web design (2) Uso non standard di widget standard La coerenza è uno dei fattori più importanti nell’usabilità dei siti. Fornisce prevedibilità, senso di controllo all’utente, conservazione delle energie mentali. La principale violazione della coerenza è l’uso di widget non standard o di widget standard in modo non standard. Es.: I bottoni radio servono per scegliere opzioni esclusive, non per opzioni multiple e soprattutto NON per attivare comandi. Stessa cosa per i menu pop-up. Pagine anonime (senza autori) Gli utenti vogliono sapere chi c’è dietro alle pagine lette. Una pagina senza autori è come una lettera anonima. Fornire un link mailto: è sbagliato: un conto è sapere chi sei, un altro è volerti conoscere.

49 Fabio Vitali 49 I dieci errori del Web design (3) Siti senza archivio Anche l’informazione vecchia è buona informazione. Non buttar via la roba vecchia senza motivo. Lo spazio su disco è a buon mercato. Cambiare gli URL Cambiare gli URL significa impedire il ritorno ai tuoi vecchi utenti, quelli che erano così interessati da segnarsi il bookmark o addirittura da includere il tuo URL in un loro documento. Titoli senza senso fuori dal contesto I titoli di pagine e capitoli sono elementi dell’interfaccia e aiuti per la navigazione. I titoli sono spesso usati negli indici, dai motori di ricerca e nei bookmark degli utenti. Fuorviare è sempre, alla lunga, controproducente

50 Fabio Vitali 50 I dieci errori del Web design (4) Adottare ogni singola tecnologia di moda Push, chat, 3D, Flash, ecc. affascinano i tecnologi e possono fornire qualche beneficio, ma nulla può risollevare un sito strutturato e pensato male. Risposta del server lenta Computer lenti o sottodimensionati. Grafiche pesanti. Dinamismi eccessi, accessi a database su altri computer…agli utenti non importa quale sia la causa, il punto è che se non trovano qualcosa di interessante entro due/tre secondi, se ne andranno. Banner e pubblicità (ed ogni cosa che gli assomigli) Gli utenti sono abituati ad usare attenzione selettiva nel fare lo scanning di una pagina. La pubblicità su Internet è diventata sempre meno efficace e sempre più ignorata. Non solo non conviene fare pubblicità, ma è opportuno anche usare widget che ricordino banner pubblicitari, perché verranno ignorati.

51 Fabio Vitali 51 Le domande che spaventano gli utenti 10Prego, identifica il tipo del tuo browser 9Prego, scarica questo plug-in/upgrade/xxx 8Prego, attiva Java/Javascript/stylesheet 7Prego, ingrandisci la finestra/togli i bottoni del browser 6Prego, accetta/rifiuta questo certificato 5Prego, accetta/rifiuta questo cookie 4Conferma che hai richiesto una pagina non sicura 3Prego, inserisci nome e password 2Prego, riempi il questionario qui sotto con informazioni su di te 1Prego, inserisci il numero e la scadenza della tua carta di credito

52 Fabio Vitali 52 Ignorare le linee guida Ripeto quanto magistralmente sostenuto da Nico Bondi nella sua esercitazione: "Trasgredire alle regole di usabilità vuol dire innanzitutto conoscerle e tenerle in mente. La trasgressione deve avere una ragione di ordine comunicazionale, e in generale è apprezzata solo dagli utenti esperti. È necessario adottare una ‘grammatica della trasgressione’, che permetta di inferire la nuova chiave di lettura. Altrimenti si rischia il caos cognitivo."

53 Fabio Vitali 53 Conclusioni C'è differenza tra TV e Web? Tra CD-ROM e Web? Tra stampa e Web? Il grande successo del WWW come medium ha spinto alla progettazione di siti molte figure professionali formate su altri media. Il grande successo del Web come vetrina commerciale a basso costo ha fatto privilegiare negli ultimi anni le scelte grafiche sul contenuto. Risultato: il Web commerciale è oggi una collezione di veicoli pubblicitari, propri o impropri, che determinano e soffocano i contenuti. Soprattutto, è un medium effimero e aggregato: i link non durano nel tempo, non esistono gli archivi, facciamo link non alle sezioni, non alle pagine, ma ai siti. La contrapposizione tra contenuto e presentazione ha visto ad oggi un chiaro perdente: in contenuto. E' possibile salvare capra e cavoli? Sì: attraverso una chiara distinzione tra contenuti e presentazione, che permetta di applicare dinamicamente i criteri grafici più avanzati e di moda a contenuti che possono resistere nel tempo. Per questo XML è così importante: perché fornisce un meccanismo neutro e privo di semantica per la creazione di contenuti, su cui diventa possibile specificare la presentazione preferita.

54 Fabio Vitali 54 Riferimenti - libri J. Nielsen, Web Usability, Apogeo, 2000 M. Visciola, Usabilità dei siti Web, Apogeo, 2000 D. Siegel, Creating Killer Web sites (2nd Edition), Hayden Books, J. Fleming, Web Navigation, designing the user experience, O’Reilly, 1998 J. Veen, Hot Wired Style, Principles for building smart Web sites, Wired Books, J. Spool, T. Scanlon, W. Schroeder, C. Snyder, T. DeAngelo, Web Site Usability, Morgan kaufmann, 1999.

55 Fabio Vitali 55 Riferimenti - risorse on-line D. Siegel, The Balkanization of the Web, N. Shedroff, Information Interaction Design: a Unified Field Theory of Design, in R. Jacobson, W.S. Wurman (eds.), Information Design, MIT Press, K. Andrews, Human-Computer Interaction Lecture Notes, Final Version of 13 July 1999, J. Nielsen, The alertbox: current issues in Web usability, bi- weekly column, Keith Instone, The usable Web,


Scaricare ppt "Web Design Fabio Vitali. 2 Sommario Oggi esaminiamo in breve categorie e soluzioni di progettazione di siti Web. In particolare: La progettazione dell’informazione."

Presentazioni simili


Annunci Google