laboratorio

Le teorie della Gestalt e Cognitive Web Design

Le teorie della Gestalt e Cognitive Web Design

La Gestalt si afferma come scuola di pensiero in Germania fra la fine dell'Ottocento e gli inizi del Novecento. I sostenitori di tale scuola ritengono che l'attività percettiva non sia basata sull'organizzazione dei singoli elementi considerati distintamente, ma sull'immediato riconoscimento di unità globalmente strutturate. Da ciò si evince quale sia l'obiettivo della Gestalt, ovvero quello di cercare di comprendere le leggi o principi per mezzo dei quali noi strutturiamo le nostre percezioni.

Cosa si intende per percezione? La percezione consiste nell' assegnare un significato agli input provenienti dagli organi di senso e nell'attribuire ad essi proprietà fisiche: nitidezza ad un' immagine, grandezza ad un oggetto, chiarezza ad un suono. Quindi, le leggi percettive formulate dalla Gestalt ci spiegano il nostro modo di percepire la realtà che a sua volta vincola anche quello di concepirla : la percezione va a vincolare il modo in cui diamo significato alla realtà, la interpretiamo, la viviamo.

Studi condotti nel tempo ci hanno consentito di capire come alcuni principi della Gestalt possono essere molto utili nella progettazione di un sito allo scopo di diminuire le ambiguità, contribuendo alla disposizione dei vari elementi che compongono una pagina web in modo da rendere chiara la struttura e l'organizzazione del proprio lavoro fin da un primo sguardo.

Legge della Vicinanza: All'interno di una stessa 'scena', gli elementi tra loro vicini vengono percepiti come un tutto. In altre parole più sono vicini fra loro due o più elementi maggiore è la probabilità che essi siano visti come una figura. Questo principio è molto utile nel design e può essere utilizzato per rendere più immediata la percezione del layout della pagina. Se le informazioni sono ammassate senza alcuna separazione né ordine, l'utente si trova nella condizione di non sapere da dove iniziare, di non distinguere i vari tipi di informazione poiché tutto appare della stessa importanza .Per risolvere tale problema è sufficiente mettere in pratica appropriate procedure di avvicinamento e allontanamento degli elementi che sono concettualmente correlati tra di loro e quelli che invece non lo sono. In tal modo si riesce ad aumentare la sensazione di ordine, a rendere più chiara la struttura della pagina e a facilitare la percezione di unità.

Legge della Similarità: All'interno di una stessa 'scena' gli elementi tra loro simili per forma, colore e dimensione vengono percepiti come collegati. Intensa in tal senso potremmo dire che la similarità rappresenta un prerequisito per notare la differenza. Questo principio ci fornisce una regola che può essere utile all'usabilità e trova la sua realizzazione nell'impaginazione. Sappiamo che generalmente elementi con caratteristiche comuni vengono raggruppati insieme, in un sito è possibile raggruppare visivamente le informazioni riguardanti lo stesso argomento attraverso un elemento molto comune e noto a tutti, mi riferisco all' l'elenco puntato oppure contrassegnandole con lo stesso colore. L'applicazione di questo principio rende accessibile e facilmente navigabile anche un sito con grandi quantità di contenuti.

Legge della Chiusura: Linee e forme familiari vengono percepite come chiuse e complete, anche se graficamente non lo sono. Anche questo principio come il precedente ha molti riscontri nell'impaginazione. Primo fra tutti l'allineamento: organizzare lo spazio secondo linee e rettangoli invisibili aiuta il lettore a capire la strutturazione e l'organizzazione della pagina.

Legge della Figura/ Sfondo: Le figure vengono percepite prima di tutto dal proprio contorno, il resto viene inteso come sfondo. In pratica secondo questa legge un immagine é percepita solo in contrasto al suo sfondo. Il principio della figura/sfondo è usato continuamente nella composizione grafica. Diremo inoltre che questo principio fa pieno riferimento alla nostra abilità di distinguere i potenziali oggetti in base al contrasto, ed infatti nei termini del graphic design esso è noto come principio del Contrasto.

LINK:

http://gestalttheory.net/it/

www.pro.html.it

http://tepserver.ucsd.edu/~jlevin/gp/

information architecture

Information  architecture

Arichettura dell'informazione    ricerca III

Architettura dell'informazione, detta anche architettura delle informazioni, dal termine inglese "information architecture", è la struttura organizzativa logica e semantica delle informazioni, dei contenuti, dei processi e delle funzionalità di un sistema o un'applicazione informatica.L'architettura delle informazioni è il cuore di un qualsiasi progetto di interaction design. Applicabile anche al di fuori dell'ambito informatico, questa struttura è l'anima fondamentale di un qualsiasi insieme di contenuti e dati destinati alla fruizione e, integrando informazioni e processi, svolge un ruolo chiave nel definire il reale grado di fruibilità e di usabilità di un sistema digitale per l'utente finale.

L'architettura delle informazioni comprende gli strumenti tecnici e culturali per l'organizzazione, la catalogazione, la ricerca, la navigazione e la presentazione di contenuti e dati nei vari formati disponibili (digitali e non).Secondo un noto schema proposto da Peter Morville e Louis Rosenfeld, lo scopo fondamentale dell'architettura delle informazioni è mettere in relazione utenti e contenuti, con una finalità di business.In generale la progettazione del'architettura dei contenuti di un sistema o un servizio digitale, che sia online (un sito web) o offline (un'applicazione software o un sistema meccanico), si svolge su tre livelli tra loro collegati:

1 - Architettura: analisi e progettazione dell'organizzazione generale del sistema e del modello di interazione tra le parti;

2 - Processi: analisi e progettazione dei vari flussi operativi e processi compresi nel sistema, partendo dall'analisi dei compiti e degli obiettivi degli utenti;

3 - Pagine: analisi e progettazione dell'interfaccia che presenta dati, contenuti e strumenti di interazione per l'utente. In questo caso l'interfaccia può essere una pagina o una schermata di un computer, ma anche un pannello fisico, una tastiera meccanica e perfino un luogo.

Web Writing: le regole della scrittura efficace

Lavorando per il Web, con contenuti interamente digitali, si ha la fortuna di poter veicolare tutte le informazioni anche ai lettori disabili. Per far questo si devono rispettare gli standard del W3C, tenendo sempre in mente che scrivere per il Web non e' come scrivere un documento cartaceo: per aumentare la navigabilità e l'accessibilità dei contenuti, bisogna imparare ad ottimizzare gli ipertesti.

Quando non basta fare copia e incolla

Alcuni studi condotti da Jakob Nielsen, noto esperto di Usability, hanno dimostrato che le pagine web non vengono lette dall'inizio alla fine: i contenuti vengono "scrollati" alla ricerca delle parti ritenute interessanti. Chi realizza pagine web, deve lavorare sugli ipertesti in modo da facilitare la comprensione "a colpo d'occhio", abbattendo numerose barriere di accessibilità.

Testi Brevi e Semplici - via le parole superflue

Il primo accorgimento per scrivere buoni testi e' la sintesi. Steve Krug, autore di Dont' Make Me Think, consiglia di togliere il 50% delle parole da un testo da pubblicare on line e, dopo questa prima revisione, togliere un altro 50% delle parole rimaste. La soluzione e' drastica, ma la sintesi nel web e' importante perche' i lettori non hanno tempo da perdere.
La semplicità e' un altro elemento da considerare: periodi complessi saranno capiti a fatica e, per gli utenti con disabilità cognitive, potrebbero presentare notevoli difficoltà. Dividi il testo in periodi brevi e semplifica l'esposizione di ogni concetto.

Inizia dalla fine

E' importante andare subito al punto e partire dalle conclusioni. Il primo paragrafo dev'essere un riassunto, il resto del testo (per il quale bisognerà scrollare) un approfondimento. Il lettore deve capire fin da subito cosa sta leggendo, senza addentrarsi troppo nel testo. "In qualunque punto si fermi, il lettore deve sempre aver letto le informazioni piu' importanti" - da Web Usability di Jakob Nielsen.

Evidenzia le parole chiave

Sono pochi i lettori che leggono un articolo dall'inizio alla fine: la maggior parte scrolla la pagina, navigando a "colpo d'occhio" e ricercando keywords interessanti. Guida il lettore nell'esplorazione dei contenuti, focalizzando la sua attenzione nei punti caldi del testo. Evidenzia le parole chiave in grassetto (o usa un colore particolare).
Attenzione a non trarre in inganno il lettore, confondendo link e keyword (per es. non sottolineare parole che non sono link).

Definisci la struttura logica di un testo

Definire la struttura logica significa impostare titoli e sottotitoli dei vari paragrafi tramite gli Headers (h1 h2...h6). Usando questi comandi HTML, il contenuto viene interpretato logicamente da browser testuali e dagli screen reader. Per esempio un browser testuale riconosce che un titolo scritto in h1 e' piu' importante di un altro scritto in h2, indipendentemente dalla grandezza del carattere

 Fonti

www.ottimizzare.com

http://it.wikipedia.org

HTML - XHTML

Ricerca II

Il  passaggio dall'HTML al XHML

26 gennaio 2000: il World Wide Web Consortium (W3C) rilascia la prima specifica del linguaggio di markup destinato a sostituire HTML. Quel linguaggio si chiama XHTML. La specifica di XHTML occupa una sola pagina. L'elemento chiave è la X. Sta per EXTENSIBLE, è la stessa X su cui si fonda quella che è sicuramente la pietra angolare della comunicazione digitale del futuro: XML (Extensible Markup Language). La cosa "rivoluzionaria" è appunto questa: HTML è ora una parte della grande famiglia XML, ne condivide regole di base e potenzialità. Risultato: il tempo dell'anarchia, del codice "sporco ma basta che funzioni", degli elementi proprietari imposti è finito. Questo linguaggio si integra naturalmente con gli altri standard proposti dal W3C (XML, XSL, CSS) questa integrazione potrà cambiare il nostro approccio alla progettazione di siti e applicazioni web.Tutti gli attori sul mercato dei browser producono, oggi, programmi aderenti ai principali standard del W3C. La situazione non potrà che migliorare, con supporti più adeguati e bug residui finalmente colmati. Per la prima volta da quando esiste il web chi progetta una pagina "standard compliant" ha la certezza che sarà visualizzata senza problemi con questi strumenti e che lo sarà nel futuro. Prima si creava tutto il sito con HTML. Layout, stile, contenuto. Lavorare con gli standard significa invece usare un linguaggio per lo scopo per cui è stato concepito. La forza sta nell'integrazione dei singoli elementi. Separare il contenuto dalla presentazione e dalla logica di programmazione, Non è uno slogan vuoto, Significa progetti più gestibili, Informazioni più facili da ritrovare, Siti più accessibili e trasportabili su altri sistemi. Ma significa anche cambiare le modalità operative, il modo stesso di pensare un sito o una singola pagina Piuttosto che sfornare una nuova versione del linguaggio, un HTML 5.0, gli uomini del Consortium hanno compiuto un'opera di ridefinizione. Niente nuovi tag, attributi o metodi. Questi rimangono essenzialmente quelli di HTML 4.0. In pratica: il vocabolario rimane uguale, ma cambiano le regole sintattiche. Se si comprende questo fatto, sarà chiaro come XHTML risponda a due esigenze fondamentali:

1. portare HTML nella famiglia XML con i benefici che ciò comporta in termini di estensibilità e rigore sintattico
2. mantenere la compatibilità con i software che supportano HTML 4.0

Le versioni di XHTML attualmente disponibili e pubblicate come raccomandazioni dal W3C sono tre.

XHTML 1.0

Pubblicata il 26 gennaio 2000 e seguita da una versione rivista dell'ottobre 2001. Consiste, come detto, nella riscrittura in XML di HTML 4.0 e si basa sulle tre DTD già definite per questo linguaggio:

• DTD Strict
• DTD Transitional
• DTD Frameset

XHTML Basic

È una versione "ridotta" del linguaggio. Specificamente pensata per dispositivi mobili (PDA, cellulari), contiene solo gli elementi che si adattano a questi dispositivi (esclude, ad esempio, i frames che non hanno ovviamente senso in tale contesto). È destinata a sostituire WML come linguaggio di base per le applicazioni WAP.

XHTML 1.1

Basata sulla DTD Strict della versione 1.0, rappresenta la prima formulazione pratica del concetto di modularità. In questa visione, gli elementi fondamentali (in pratica l'insieme di tag che definiscono la struttura di un documento) sono raggruppati in una serie di moduli indipendenti, che possono essere implementati o esclusi secondo le necessità. Secondo il W3C è la base della futura estensione di XHTML con altri set di linguaggi o moduli, anche personalizzati.

Riferimenti

La guida HTML di HTML.it

Il guida XML di HTML.It

XHTML sul W3C: news, specifiche, definizioni e discussioni

Ricerca I

Laboratorio informatico web

Ricerca

Il www (World Wide Web) nacque nel 1989 presso il CERN di Ginevra su idea di Tim Berners-Lee e di Robert Cailliau, per permettere ai ricercatori di condividere la documentazione in formato elettronico migliorandone la comunicazione e la cooperazione, definirono cosi, i primi  standard e protocolli per scambiare documenti su reti dati. Il concetto che sta alla base del World Wide Web prevedel'uso dell'ipertesto per collegare fra loro le informazioni disponibili in internet. Un ipertesto è un modo non lineare di organizzazione delle informazioni. Quando si usa un sistema ipertestuale si può saltare da un argomento ad un'altro correlato per trovare rapidamente le informazioni cui si è interessati e poi tornare al punto di partenza. Nel web i collegamenti ipertestuali, che possono essere testi o immagini, possono inviare sd un'altra pagina web o possono aprire o prelevare un file, ad esempio un suono, un'immagine, un filmato o un file eseguibile. Inizialmente Internet era costruito solo da file di testo e binari; quando furono introdotte queste nuove funzionalità ipertestuali, si dovette coniare un nuovo termine: ipermedia.

HTML sta per Hyper Text Markup Language, linguaggio per marcatura degli ipertesti; progettato da Tim Barners-Lee del CERN di Ginevra nel 1989, che voleva uno strumento per scrivere ipertesti in modo indipendente dal tipo di computer e dal tipo di sistema operativo, cosa fondamentale sul web. Egli creò un'applicazione del linguaggio SGML (Standard Generalised Markup Language), un sistema standard utilizzabile per specificare la struttura di un documento, e lo chiamò HTML. La prima versione era molto semplice gli ipertesti erano leggibili su qualsiasi piattaforma. Da allora HTML è cresciuto controllato dal comitato WC3.

L' HTML è in formato testo e non è un linguaggio nel senso tradizionale, ma un impaginatore che consente di posizionare degli oggetti nella pagina con le caratteristiche indicate, naturalmente risulta essere un pò statico e non interagisce con l'utente e non può prendere decisioni se non per i formulari e la sua interpretazione ha bisogno di un browser. I linguaggi a cui si rifà sono:

1. linguaggi compilati: sono quei linguaggi abbastanza complessi in cui il sorgente viene compilato in codice macchina e viene impacchettato in un eseguibile utilizzabile solo nella forma e per le operazioni per cui è stato progettato;
2. linguaggi semicompilati: in realtà a questa classe appartiene solo Java perchè è un linguaggio compilato in un formato intermedio tra i file ASCII e il file binario, tale formato si chiama bytecode e va interpretato sul client da una macchina virtuale chiamata Java Virtual Machine;
3. linguaggi interpretati: sono quei linguaggi che risultano molto simili all'HTML ma hanno potenzialità maggiori perchè consentono di effettuare controlli e operazioni complesse.

L'evoluzione (da vers. 1.0 fino a 3.2 fino a 4.0 e 4.1), ragioni d'uso ed esigenze tecnologiche del linguaggio HTML:

Queste sono le evoluzioni del linguaggio HTML:

- versione 0.9b 30 marzo 1995. La prima versione pubblica.

- versione 2.0 7 ottobre 1995. Molte modifiche e correzioni.

- riscritta l'introduzione e la tabella di compatibilità del linguaggio.

- aggiunto il simbolo "+" per indicare le estenzioni di Netscape. Questa indicazione è naturalmente molto approssimativa. Aggiunto il simbolo ",,," nella tabella dei simboli per l'elenco dei campi delimitati dalla virgola.

- ristrutturare le sezioni "formattazione fisica" e "formattazione logica" in "formattazione di presentazione" e "formattazione di struttura". Questo cambiamento dovrebbe chiarire la distinzione tra presentation-based e structural-markup. Alcuni comandi sono stati spostati a causa di questo cambiamento, e il comando address è stato spostato da vari a formattazione di struttura.

Il termine WC3 significa "World Wide Web Consortium". Il WC3 è un consorzio di aziende del settore informatico che si occupa di stabilire standard di riferimento per il web . Questo consorzio studia i sistemi ed i linguaggi per la trasmissione di dati attraveso il Web e ne ufficializza l'utilizzo attraverso raccomandazioni definitive, Al WC3 si devonogli standard di HTML, XML, SMIL, CSS ed altri ancora. WC3 è stato fondato nell'ottobre del 1994 per portare il web al suo massimo potenziale,mediante lo sviluppo di protocolli comuni che promuovano la sua evoluzione e che assicurino la sua interoperabilità. Il suo scopo è quello di portare il web al suo massimo potenziale mediante lo sviluppo di tecnologie che possano creare un forum per informazioni, commercio, ispirazioni, pensiero indipendente e comprensione collettiva.Il WC3 definisce il web come l'universo delle informazioni accessibili in rete. Uno degli scopi principali del WC3 è quello di rendere queste opportunità fruibili a tutti indipendentemente da eventuali limitazioni determinate da hardware, software, distanza geografica ecc....

Fonti:

www.unibo.it

www.html.it

www.pro.html.it