lab

martedì, aprile 25, 2006

I colori e i formati immagini per il web.

Il sistema esadecimale.
La parola esadecimale è composta da una parte di derivazione greca "exi" (sei) e una di derivazione latina "decimale" (per dieci).
Il sistema numerico esadecimale è in base 16, cioè utilizza 16 simboli: i numeri da 0 a 9 e le lettere da A a F.
L'utilizzo del sistema esadecimale è utile quando si ragiona con la rappresentazione interna dei numeri nella memoria del computer.

Per fare un esempio: un byte si può rappresentare con 8 cifre binarie o con due sole cifre esadecimali, e se si pensa alle grandi operazioni e combinazioni di numeri che avvengono all'interno del computer, il sistema esadecimale è senza dubbio quello "più economico" in termini di spazio.

RGB,codifica con il sistema esadecimale e web-safe color.
RGB (acronimo di Red Green Blue) è un modello di colori additivo basato sui 3 colori primari: l'unione dei 3 colori dà il bianco, combinati a coppie dà il Ciano, il Magenta e il Giallo (CMYK).
Per esprimere i colori e renderli univoci e sicuri per il web, ovvero "web-safe", ad ognuno è stato dato un nome corrispondente in esadecimale, in modo da renderli compatibili con qualsiasi user agent o browser.
Un esempio di colori in esadecimale:
  • rosso: #ff0000;
  • verde: #00ff00;
  • blu: #0000ff;
  • bianco: #ffffff;
  • giallo: #ffff00;
  • nero: #000000;
  • arancione: #ffa500;
  • argento: #c0c0c0;
  • blu notte: #003366.

I colori si possono combinare a piacimento, è importante ricordare che la somma dei colori usati deve dare il grigio, per essere piacevole alla vista.

Differenze tra gif, png, jpeg, bmp.

Il formato GIF (Graphics Interchange Format) è il formato più utilizzato nel web.

Con le gif possiamo costruire immagini:

  • trasparenti;
  • animate;
  • interlacciate.

Le gif trasparenti sono quelle immagini che consentono di costruire un disegno circolare colorato con base trasparente, poichè il risultato di una immagine deve essere sempre un rettangolo o un quadrato, teoricamente non potremmo disegnare un cerchio.

Le gif animate sono quelle immagini che al proprio interno contengono altre immagini che vengono proiettate rapidamente in sequenza in modo da farle sembrare in movimento.

Le gif interlacciate sono le immagini che vengono visualizzate a poco a poco, cioè si vanno definendo durante il caricamento dell'immagine stessa rendendola sempre più chiara.

Le immagini gif servono per costruire un'icona, un logo, una piccola immagine o i pulsanti d'azione; per una animazione si utilizza la gif animata.

PNG (Portable Network Graphics) è un nuovo formato, non supportato da tutti i browser, che al contrario del formato gif è un formato pubblico, supporta le immagini trasparenti e interlacciate.

Si usa per le immagini destinate al web, lavora con milioni di colori o con scale di colore.

JPEG (Joint Photographic Experts Group) è un formato che lavora con milioni di colori; è uno dei tre formati disponibili per il web, insieme alle gif e png.

Quando lavoriamo con le foto, possiamo salvarle in tiff o png, ma il formato jpeg è consigliabile se vogliamo risparmiare spazio; al contrario, non conviene usare il formato jpeg per le immagini con pochi colori perchè le degrada, è più indicato in questi casi usare il formato gif o png.

Per le foto ad alta risoluzione e le immagini di alta qualità il formato migliore è il tiff.

BMP (Bitmap) è un formato basato su pixel. I file bmp non sono molto utilizzati nel web a causa della loro bassa compressione.

Salvare un'immagine in bmp conviene nel caso di ridimensionamento delle immagini perchè conserva le informazioni relative al numero di pixel per metro.

Quando lavoriamo con le immagini per inserirle nel web è fondamentale ricordarsi sempre di inserire il tag alt per mostrare il testo alternativo al posto di un'immagine, così un browser web testuale mostrerà il testo alternativo che spiegherà il contenuto dell'immagine.

Le immagini acquisite con lo scanner.

Quando acquisiamo un'immagine con lo scanner dobbiamo salvarla in formati diversi in base all'immagine stessa: se è una foto, allora serviranno 16 milioni di colori e l'immagine dovrà essere salvata in jpeg, tiff; se è un'immagine con pochi colori allora ne basteranno 256 e potrà essere salvata in gif o png; se è un disegno fatto a mano o un testo bastano solo i colori bianco e nero.

Quando dobbiamo acquisire un'immagine abbiamo la possibilità di scegliere la risoluzione: 100 dpi, 300 dpi, 600 dpi.

DPI sta per "dots per inch" ovvero "punti per pollice" e serve a definire il livello di dettaglio con cui verrà analizzata l'immagine.

Più saranno i dpi maggiori saranno i dettagli e maggiore sarà la dimensione del file.

Il formato jpeg è quello che consente di mantenere dimensioni ridotte pur ottenendo immagini bitmap di qualità a milioni di colori.

Sitografia:

  1. it.wikipedia.org/wiki/Sistema_numerico_esadecimale
  2. it.wikipedia.org/wiki/RGB

martedì, aprile 11, 2006

Information Architecture

L'Information Architecture, ovvero l'Architettura dell'informazione, nasce dall'esigenza di organizzare, categorizzare e creare gli schemi di navigazione all'interno di un sistema informativo; facilitare la ricerca e e la gestione delle informazioni; creare la struttura su cui verrà "costruito" un sito.
L'Information Architect è la figura chiave nella realizzazione di un progetto web, infatti è colui che organizza i contenuti e i processi di un sito basandosi sul contesto, sugli obiettivi e sul target.
Dopo aver stabilito gli obiettivi e il target del sito si passa all'individuazione del profilo degli utenti per definire meglio il target.
L'operazione successiva è quella di progettare la navigazione del sito.
L'Information Architect affida le strutture portanti del suo sito ai metadati.
L'obiettivo è concatenare le informazioni e i dati che formano ogni scheda finale di contenuto.
Il luogo in cui si interviene sull'unità finale di contenuto è il Content Management System (CMS): un sistema per la gestione di contenuti informativi da pubblicare su siti e portali web.
Non bisogna fare l'errore di confondere e unificare i ruoli dell'architettura e del content management, infatti la prima ha una visione immediata delle informazioni (piano della sincronia); il secondo vede le informazioni inserite in un flusso cronologico (piano della diacronia).
Anche la logica dei motori di ricerca si basa sull'I.A.
Il primo criterio è quello della rilevanza dei campi: quando digitiamo una parola la ricerca procederà a ricercare prima tutti i titoli che comprendono quella parola, poi quelle in cui è contenuta nel corpo del testo.
Una grande percentuale di visitatori non arriva ad esplorare un sito partendo dalla Home page, ma vi arriva dai motori di ricerca, quindi gli utenti arrivano subito all'unità di contenuto saltando le tappe iniziali del sito.
In un motore di ricerca vige un criterio ragionato di classificazione che permette, una volta inserita la parola chiave della ricerca, di reperire e organizzare tutti i dati ottenuti per categorie e rendere possibile una creazione dinamica di percorsi associativi estemporanei.

Le funzioni dell'I.A. sono:

  1. costruire schemi e sistemi di navigazione fissi dove inserire gli elementi;
  2. identificare thesauri;
  3. associare metadati ad ogni contenuto del sito;
  4. prevedere metadati aperti;
  5. tenere conto dei movimenti dei visitatori.

Sitografia:

  1. www.html.it/architettura_informazione/infoarch_19.htm
  2. www.fucinaweb.com/fw/iaftwww2/
  3. www.ateneomultimediale.com/c_infoarchitecture.htm
  4. pro.html.it/articoli/id_301/idcat_43/pro.html

Enzamaria La Mantia,LxWeb. DW1