Prefazione. 1. Usabilità del sito

Dimensione: px
Iniziare la visualizzazioe della pagina:

Download "Prefazione. 1. Usabilità del sito"

Transcript

1 Prefazione Il Web Design è l'arte di costruire siti. Tra le varie professioni del Web rappresenta quella più multidisciplinare, coinvolge la progettazione, la realizzazione ed i contenuti. Quando un visitatore apre una home page, la possibilità che abbia intenzione di passare molto tempo a scoprirne il sistema di navigazione o a decifrarne le icone, è praticamente nulla. Gli utenti web non sono spettatori né esploratori, vogliono fare qualcosa. Accedere a Internet non è come guardare un film o un video in tv (le aree in cui spesso i creativi sono più ferrati). Il web è fatto per lavorare. Cliccare. Cercare. Ottenere dei risultati. Non semplicemente, guardare. L'usabilità è una della armi a nostra disposizione per trattenere l'audience e per consentire ai visitatori di lavorare con il nostro sito. 1. Usabilità del sito Originariamente la parola usabilità deriva dalla progettazione dei software: dalla metà degli anni 80 iniziò a svilupparsi quella che è una vera e propria scienza, che coniuga la psicologia e l'intelligenza artificiale all'informatica. Questi erano e sono tuttora i principali attributi dell'usabilità definiti nel Sun Usability Lab: 1.1 Utilità 1.2 Facilità di apprendimento 1.3 Efficienza 1.4 Facilità di ricordo 1.5 Quantità di errori 1.6 Soddisfazione 1.1 Utilità La prima domanda riguarda ovviamente il senso stesso del sito. Serve a qualcosa? A chi serve?

2 1.2 Facilità di apprendimento Come si comportano gli utenti davanti a un sito che non hanno mai visto? Indugiano? Si ritrovano in aree di cui non conoscono il senso generale e di cui non sanno dire come sono arrivati? Vorrebbero fare qualcosa ma non sanno "Come"? Ci sono delle "metafore" di facile intuizione? (tra le queste la più' famosa è l'onnipresente "carrello della spesa") 1.3 Efficienza I visitatori possono interrogare il sistema e ricevere delle risposte sensate e veloci, o devono tentare e ritentare per ottenere ciò che hanno in mente? Il caricamento del sito è rapido? 1.4 Facilità di ricordo Gli utenti ricordano immediatamente come usare il sito la seconda o terza volta che ci ritornano? 1.5 Prevenzione degli errori I navigatori compiono errori o usano spesso il tasto back come se fossero finiti dove non volevano? Il sito stesso contiene errori di vario genere? 1.6 Soddisfazione Il sistema è divertente e soddisfacente da usare o crea ansia e frustrazione? Il punto di vista dell'utente è la prima cosa di cui tenere conto nella progettazione e produzione di un sito web.la scelta più facile sarebbe quella di cadere nel tranello della tecnologia a tutti i costi, del "facciamo colpo sul navigatore". Mentre, nel costruire schemi di navigazione, grafica e database occorre sempre chiedersi: "come si comporteranno i visitatori, che vantaggi ne trarranno?"

3 In tutte le fasi della progettazione occorre sempre avere ben chiari gli obiettivi che si vogliono raggiungere, conoscendo soprattutto le necessità degli utenti, prevedendo i loro comportamenti nel sito.

4 2. Il Concept Uno dei cambiamenti più determinanti segnati dalla rete è il passaggio dai siti tradizionali "vetrina" in cui si presenta il "chi siamo", "cosa facciamo", "i nostri contenuti" ad un'idea di presenza sul web che abbia un valore aggiunto. I siti sono sempre più delle strutture complesse che permettono l'identificazione del pensiero, attraverso un media nuovo, che diventa parte integrante di una strategia di comunicazione completa. Si punta quindi all'omogeneità, come possibilità di riconoscere il pensiero anche nei servizi che offre. Questo obiettivo di coerenza deriva dall'esistenza di un concept. C'è un mondo all'interno del sito con dei codici di riferimento e una forte coerenza interna che contribuisce a mostrare quello che il sito vuole trasmettere. Il concept è un'idea e Internet è il campo ideale dove trasferire l'idea che il concept definisce. Un sito è quasi sempre la metafora comunicativa di ciò che il concept, vuole trasmettere. I siti di e commerce diventano metafore di fiere di paese, i siti di informazione metafora di quotidiani e lo sviluppo nel concept influenza la struttura e la navigazione del sito, permeandole con questa metafora. In realtà, il concept non è solo un'idea, ma un progetto. Questo significa che diventa l'elemento che fornisce identità al pensiero, da sviscerare in tutte le sue componenti fino ad arrivare alla definizione del piano editoriale. In questo si evidenzia la differenza più forte tra il web e i media tradizionali. Un sito Internet ha una struttura complessa, non chiusa in sé stessa, perché si tratta di un prodotto di comunicazione, ma anche di un prodotto di servizio.

5 3. I Contenuti I contenuti internet sono assai diversi e richiedono strumenti e metodologie che possano permettere la gestione, la trasferibilità e la fruibilità efficace. Le tipologie dei contenuti sono svariate: informativi, interattivi, rappresentativi, educativi, istituzionali, d'intrattenimento, promozionali... Scelti in maniera coerente con l'obiettivo del sito, possono avere diversi formati: testi (per cui si dovranno gestire lunghezze, suddivisioni, ipertesti, archivi); immagini (l'attenzione qui sarà posta su dimensioni, taglio, figure, sfondo, peso, sequenze, didascalie, copyright); elementi di interazione ( , forum, chat, sondaggi, questionari, newsletter); audio, video e altri file (la presenza di file da copiare, visualizzare, ascoltare e scaricare crea problemi legati ai limiti di peso e banda larga, convergenza fra internet e la televisione, download, necessità di software per diffusione e utilizzo). Infine i microcontenuti. Definiti da Jacob Nielsen "perle di chiarezza", garantiscono una migliore navigazione del sito ed una più rapida acquisizione dei contenuti. tra gli altri menù e indici, titoli e sottotitoli, didascalie, parole in grassetto, link, URL, bottoni, infografica, nomi dei file, nomi delle cartelle, didascalie, titoli delle pagine (nel codice), meta keyword (nel codice), meta description (nel codice), oggetti delle mail, titoli di forum e sondaggi. L'attenzione a questi elementi facilita la navigazione interna ed esterna, fornisce informazioni rapide, articola l'ipertesto, favorisce l'attività dei motori di ricerca, facilita l'organizzazione di archivi. I siti sono spesso redatti in più lingue. Non sempre basta la semplice traduzione dei testi, risolvibile con una clonazione (e limitando i problemi a questioni di lunghezza): in certi casi è necessario adeguare la comunicazione al contesto culturale del paese interessato, attività non sempre così facile. Chi si occupa di content stende il piano editoriale, descrive in modo dettagliato quali sono i contenuti e gli strumenti di gestione, decide le tipologie di argomenti da inserire, i servizi da fornire (forum, chat, posta, motori di ricerca...) e i programmi utilizzati per la gestione e per la pubblicazione (editor, sistema editoriale, CMS...). Collabora nella creazione di database, sistemi di "profilazione" utenti (registrazione, questionari) e programma l'archiviazione (consistenza e previsione crescita). Stabilisce poi i servizi da fornire, elenchi puntati, indici, mappa, motori di ricerca interni, modalità di registrazione... Dà indicazioni a chi fa il template, lavorando con il grafico e con chi si occupa della struttura informatica.

6 La gestione dei contenuti avviene spesso attraverso l'uso di sistemi informatici, detti sistemi di content management (CMS). Questi sistemi raccolgono l'intero processo tecnologico dalla fonte alla pubblicazione, anche se non sempre considerano tutto il processo nella sua complessità ed è quindi necessario intervenire per garantire l'impostazione data e la struttura definita nel piano editoriale. L'area content acquista in questa fase un ruolo strategico e potrà garantire il ritorno sul sito dei visitatori. Il testo giornalistico segue normalmente la struttura basata sulla teoria delle 5W (who, what, when, where, why). Sul web si parla non solo di testo ma anche di ipertesto. Il lettore legge e attraversa le pagine quando trova parole generalmente sottolineate che indicano collegamenti e approfondimenti. Lo sforzo per costruire la mappa ipertestuale, soprattutto di fronte a temi ampi e complessi, è un esercizio utilissimo per organizzare le informazioni, per abbracciare il nostro lavoro con un solo sguardo. È, insomma, la scaletta dei nostri contenuti, che possiamo riutilizzare anche per scrivere una brochure, un articolo, un discorso. L'organizzazione dei concetti e delle frasi acquista quindi un nuovo spessore (la profondità), permettendo al lettore di muoversi, di "navigare" secondo percorsi proposti, che lasciano però la libertà all'utente di non seguire più la lettura sequenziale che caratterizza invece la carta. Quando si scrive per il web,si ha davanti un lettore interattivo. Lo stile del web è quindi simile a quello giornalistico, si arricchisce di domande e di possibilità di approfondimento (che non devono diventare di fuga). Quando si deve organizzare il testo,bisogna sempre trovare le giuste posizioni per i link: non devono essere inviti a fuggire via, ma ad approfondire, a creare nella mente dell'utente dei collegamenti.

7 4. L'ipertesto L'ipertesto è un concetto fondamentale per capire l'impostazione che dobbiamo dare alle nostre pagine web. L'ipertesto è un testo, quindi un messaggio dotato di significato, ma i suoi contenuti non sono articolati secondo un ordine prestabilito. Un ipertesto è caratterizzato dalla combinazione di due tipi di elementi: i singoli blocchi di contenuti, cioè le pagine di un sito Web i collegamenti, sia logici che "fisici", cioè le molteplici vie che il lettore può seguire per passare da un contenuto all'altro. Per quanto bravi possiamo essere a predisporre i collegamenti tra le varie pagine del sito, e quindi tra i contenuti dello stesso, non si può sapere a priori quale percorso sceglierà l'utente per trovare ciò che sta cercando. Bisogna partire dal presupposto che in qualunque pagina del sito si trovi il visitatore, sappia dove si trova:quindi lo sviluppo grafico deve essere coerente per tutto il sito,se si propone una grafica molto diversa tra le pagine web, il rischio è che l'utente pensi di saltare da un sito ad un altro, invece di trovarsi sempre all'interno dello stesso sito. 5. L'interfaccia utente Progettare l'interfaccia Utente significa comporre in un unico disegno: metafore di interazione, immagini, e concetti usati per veicolare funzioni e contenuto informativo sullo schermo. Proprio per questo risulta essere di fondamentale importanza un'accurata progettazione che ponga l'attenzione sull'utente e i suoi Compiti piuttosto che sugli aspetti tecnologici. L'interfaccia permette l'utilizzo di un sistema tecnologico complesso e dipende dal livello di esperienza culturale di chi utilizza l'oggetto tecnologico, cioè dall'esperienza e dal know how di quell'ambiente specifico posseduti dall'utilizzatore. È possibile riuscire ad utilizzare un telefonino con le istruzioni in cinese, se si ha una buona esperienza di telefonini perché si è in grado di interpretare la struttura semiotica del telefonino anche senza capire i singoli "segni". Sintetizzando, per utilizzare agevolmente una interfaccia due sono le opzioni

8 possibili: "capire" il linguaggio e/o "conoscere" l'utilizzo. Un'interfaccia fa sempre riferimento ad un ipotetico "livello medio" cognitivo dell'utilizzatore. Proprio per questo si identificano tre categorie di operazioni, che qui sintetizziamo: 1. le operazioni che un oggetto permette di compiere 2. le operazioni che l'utilizzatore percepisce come consentite dall'oggetto 3. le operazioni che l'utilizzatore effettivamente compie con l'oggetto Una buona interfaccia (o potremmo dire un buon design) deve ridurre le distanze tra le operazioni che l'oggetto permette di compiere e quelle che effettivamente compie. Il progetto di una interfaccia di un sito Web efficiente deve rispondere ai requisiti di facilità di navigazione e deve essere caratterizzato da una organizzazione intuitiva. Una buona interfaccia web deve assolvere a diverse funzioni: far percepire i contenuti permettere di individuare le principali aree tematiche far orientare il visitatore, cioè far capire dove si trova in ogni momento consentire di passare agevolmente da un argomento all'altro con percorsi diretti e rapidi facilitare la ricerca di un argomento Gli obiettivi, che sembrano ambiti, si raggiungono utilizzando sia testi che immagini. A quelli vanno aggiunti creatività e capacità comunicative e soprattutto la capacità di mettersi nei panni del nostro visitatore. Possiamo sintetizzare le regole fondamentali per la realizzazione di un buon sito web: Usare il logo e il nome del sito in tutte le pagine del sito in una posizione strategica, collegati tramite link alla homepage del sito stesso. I simboli e le funzioni che usi devono essere riconoscibili e identificabili in tutto il sito e non devono cambiare da una pagina all'altra. Quando il sito diventa molto grande e comunque quando presenta un numero di pagine superiore alle 100, è bene usare una funzione di ricerca. Usare dei font standard, perché non tutte le macchine hanno installati tutti i font.

9 6. I Software indispensabili I software a disposizione per fare al meglio il web designer possono essere divisi in quattro categorie principali: 1. Programmi di grafica (photoshop,gimp) 2. Editor HTML(frontpage,nvu) 3. Programmi specializzati nell'applicazione di effetti particolari a testo e immagini (flash,dreamweaver) 4. Browser(firefox,opera,internet explorer,netscape) Prima di parlare nello specifico di software bisogna approfondire dei concetti di base sulle immagini, i fonti e i colori usati nelle pagine web. 7. Gestione immagini Le immagini si dividono in due categorie: immagini bitmap immagini vettoriali Le immagini bitmap, chiamate anche immagini raster, sono quelle immagini che per la loro visualizzazione hanno bisogno di una griglia o retino di piccoli quadratini (i pixel). A ogni pixel di un'immagine bitmap il computer assegna una posizione specifica e un valore di colore. Da queste considerazione si capisce che quando si interviene a modificare un'immagine bitmap si opera sulla modifica di gruppi di pixel anziché sulla modifica di oggetti o di forme. Questa categoria di immagini dipendono dalla risoluzione cioè il numero di pixel per unità di superficie. Si usano questo tipo di immagini per riprodurre foto o immagini che necessitano di sottili sfumature cromatiche. Le immagini vettoriali sono caratterizzate da linee e curve definite da entità matematiche: i vettori. I vettori descrivono un'immagine o meglio i disegni in base alle loro caratteristiche geometriche. Il vantaggio delle immagini vettoriali è la loro indipendenza dalla risoluzione. Infatti puoi ridurre o ingrandire un'immagine

10 vettoriale senza temere di perdere in definizione, poiché non vai a intervenire sulla grandezza del file in termini di peso (Kb). Si usano le immagini vettoriali per riprodurre contorni nitidi o disegni geometrici, per i caratteri o le immagini piatte, come ad esempio i logo. A monitor difficilmente ci si può rendere conto della differenza reale che c'è tra questi due tipi di formato perché il monitor del computer rappresenta le immagini visualizzandole su un retino, quindi entrambi i formati vengono rappresentati a video in pixel. Vediamo insieme quali sono i programmi più famosi e che vengono usati in ambito professionale. 1. Gestione delle immagini bitmap: Adobe Photoshop, gimp 2. Gestione delle immagini vettoriali: Macromedia FreeHand, Adobe Illustrator (arrivato alla versione 10), Gestione di entrambi i formati: Macromedia Fireworks I formati che vengono usati nel web supportati da tutti i browser sono di due tipi: JPEG e GIF. Li esamineremo velocemente entrambi.un formato di file è semplicemente un modo per salvare le parti elettroniche che compongono i file di un computer. I diversi formati strutturano le varie parti in maniera differente. 7.1 Il formato jpeg La sigla JPEG o JPG è l'acronimo di Joint Photographic Experts Group. Questo tipo di immagine usa una compressione con perdita di dati. La perdita dei dati consiste nel fatto che alcuni dati che formavano la tua immagine vengono persi durante il processo di compressione. Questo corrisponde a una perdita di qualità nell'immagine, direttamente proporzionale al livello di compressione che sceglierai. Possiamo dire che a bassi livelli di compressione la perdita di qualità è praticamente nulla e non si percepisce a occhio nudo, ma se aumentiamo il livello di compressione dobbiamo controllare che l'immagine sia comunque di buona qualità, perché la

11 perdita di dati in questo caso può essere rilevante. Si usa questo tipo di formato per immagini a tinte non piatte, cioè per immagini fotografiche o con immagini con sfumature leggere e continue. Dato che, come abbiamo già detto, il formato è a perdita di dati non è una buona soluzione salvare un'immagine JPEG da un'altra immagine JPEG. La cosa migliore è ottenere immagini JPEG dall'immagine originale. 7.2 Il formato Gif La sigla GIF è acronimo di Graphic Interchange Format. Questo tipo di compressione, al contrario del JPEG non lavora a perdita di dati, ma può esportare solo immagini che contengono al massimo 256 colori. Se l'originale contiene un numero più elevato di colori, la perdita di qualità sarà significativa. Il formato GIF usa colori a 8 bit ed è efficace per comprimere immagini vettoriali, geometriche o testo. Il formato GIF supporta la trasparenza, quindi puoi far emergere lo sfondo attraverso l'immagine senza vincolare le immagini stesse al solo formato rettangolare o quadrato. Le immagini GIF ti permettono anche di creare delle piccole animazioni, le GIF ANIMATE, perché supportano anche fotogrammi multipli. I GIF animati si realizzano con semplici tool grafiche e con la tecnica del cartone animato. 7.3 La risoluzione delle immagini La dimensione del file di un'immagine è proporzionale alla sua dimensione in pixel, il numero di pixel visualizzato per unità di lunghezza in un'immagine viene chiamato RISOLUZIONE dell'immagine. La risoluzione delle immagini viene misurata in pixel per pollice. Nel web la risoluzione dell'immagine è condizionata dalla risoluzione del monitor. Nel utilizzare immagini per il web bsogna sempre tener conto che: 1. Le immagini devono avere sempre la risoluzione di 72 dpi, in modo tale da permettere a tutti i tipi di computer di poter visualizzare correttamente le vostre immagini. 2. Se bisogna ridimensionare un'immagine, bisogna sapere che nel passaggio da un'alta risoluzione a una bassa risoluzione non c'è sostanziale perdita di qualità, ma quando si cambia la risoluzione di un'immagine da una più bassa a una più alta il rischio è di perdere qualità dell'immagine.

12 3. Quando si imposta un'immagine per il web non è difficile definire la dimensione in cui l'immagine deve essere visualizzata, soprattutto se si usa un editor. Se si lavora direttamente con il codice basta impostare le dimensioni dell'immagine usando gli attributi WIDTH e HEIGHT. 4. Usare sempre l'alt TEXT, cioè il testo alternativo. 8. I Font per il web Si hanno disposizione diversi tipi di carattere, raggruppati per famiglie: Times New Roman, Times, Georgia, Serif Courier New, Courier, Mono Verdana, arial, Helvetica, Geneva, Sans serif La leggibilità dei caratteri sul monitor è diversa dalla leggibilità sulla carta. Mentre sulla carta i caratteri più leggibili sono quelli con le grazie (Serif), sul monitor la lettura è più agevolata dai caratteri Sans serif. In modo particolare i caratteri in assoluto più leggibili sono il Verdana e il trebuchet. Se no si può fare a meno di usare i caratteri standard, allora trasforma il testo in immagine: solo in questo modo si può essere sicuro che tutti lo visualizzeranno così come è stato rogettato.

13 9. La gestione dei colori La definizione del tipo di colore viene espressa mediante caratteri esadecimali preceduti dal simbolo "#" (cancelletto): essi possono comprendere i numeri da 0 a 9 e le lettere da "A" a "F". I primi due caratteri si riferiscono alla quantità di rosso presente nella gamma RGB (Red Green Blue), i due successivi determinano la quantità di verde, mentre gli ultimi due si riferiscono alla componente blu. L'intera gamma di colore è compresa tra "#FFFFFF" (bianco) e "#000000" (nero). In Internet non si possono utilizzare tutti i colori esistenti nello spettro cromatico, ma è consigliabile operare una scelta attraverso quelli disponibili nella "palette web" (una raccolta di 216 colori comuni a sistemi operativi differenti), altrimenti i browser potrebbero sostituire il colore scelto.

14 10. Gli editor html Per quanto riguarda gli editor HTML si dividono in due macro categorie: Editor testuali Editor What You See Is What You Get (WYSIWYG) Gli Editor testuali sono programmi che permettono di effettuare modifiche direttamente sul codice HTML puro con possibilità di preview del risultato. Hanno a disposizione comandi preconfezionati attivabili con semplici click. Gli Editor What You See Is What You Get, che sono indicati per brevità con l'acronimo WYSIWYG, permettono di interagire visimamente con gli oggetti, le immagini ed il testo. In questo modo si ha la possibilità di non lavorare direttamente sul codice HTML ma si lavora graficamente alla creazione della pagina così come sarà visualizzata nel browser. Il vantaggio di questo tipo di editor è evidente: lo sforzo di comprensione delle specifiche HTML è ridotto al minimo e il tempo di apprendimento è brevissimo. Questo tipo di editor, però spesso genera un codice "sporco" su cui bisogna comunque intervenire manualmente per correggere gli errori, quindi, devi in ogni caso conoscere bene il codice per essere in grado di capire dove si nascondono i problemi. Vediamo insieme quali sono gli editor più usati: Editor testuali: HomeSite Hotdog Editor What You See Is What You Get: Front Page, nvu Editor WYSIWYG e Testuali: Dreamweaver MX

15 11. Lo sviluppo Lo sviluppo di un sito web è molto più complicato di quanto si possa pensare, ma con una buona pianificazione del flusso di lavoro possiamo semplificarci molto la vita. La grafica è solo l'ultima fase del lavoro del web designer. Non esiste una legge scritta su come sia meglio sviluppare il progetto di un sito, ma orientativamente possiamo individuare nel percorso di produzione diverse fasi. Cerchiamo di analizzarle insieme 1. L'idea del sito e i suoi obiettivi 2. Organizzare l'albero di navigazione 3. Realizzazione del sito 4. Verifica 5. Pubblicazione Vediamo ora nello specifico i vari passaggi L'idea del sito e i suoi obiettivi Il primo passo da fare consiste nella precisazione dell'idea di base del sito e dei suoi obiettivi e destinatari. Abbiamo già visto ampiamente l'idea di concept e la realizzazione dell'interfaccia utente Organizzare l'albero di navigazione Un passaggio fondamentale prima della produzione grafica è avere ben chiara in mente e, possibilmente, anche su un pezzo di carta, la struttura generale del sito: tipo di navigazione o navigator, numero di pagine, collegamenti interni ed esterni, contenuti sia grafici che testuali, tecnologie da usare. In questa fase è molto utile pianificare il nome da assegnare a ogni pagina (e agli eventuali file multimediali allegati). Oltre che essere un ottimo esercizio per entrare nella logica della progettazione dei siti, risulterà più facile apportare eventuali correzioni o modifiche che non erano state previste all'inizio del lavoro.

16 11.3 Realizzazione del sito A questo punto si può passare alla realizzazione materiale del sito. Se il sito è realizzato in html il primo passo è quello di disegnare la grafica, usando i software illustrati nei paragrafi precedenti e scegliendo quello che meglio si adatta alle nostre esigenze. Successivamente possiamo tagliare le nostre immagini e scrivere il codice html, aiutandoci sempre con i software adatti. Se il sito è pensato per essere realizzato in flash, la costruzione della grafica andrà di pari passo con la scrittura degli actionscript e della programmazione necessaria. Unica avvertenza da usare in questa fase è fare molta attenzione ai collegamenti del sito: collegamenti tra le pagine e collegamenti con i rispettivi file multimediali come immagini, suoni, animazioni... Quando si progetta un sito bisogna tener presente che: 1. La forma dello schermo del computer è diversa da quella del foglio di carta. Il video ha generalmente una forma orizzontale, mentre la carta è generalmente posizionata in verticale. 2. La risoluzione della carta stampata è molto più alta rispetto a quella di un video. 3. Lo schermo è una sorgente di luce, al contrario della carta che la riflette. Questo condiziona molto i colori che possiamo usare, i font e la loro dimensione. Lo schermo è fortemente condizionante per l'interfaccia dei nostri siti proprio per la sua forma rettangolare. Il rettangolo è composto da due tipologie di linee: verticali e orizzontali. Quale sensazione ci danno queste due tipologie di linea? Sicuramente le linee orizzontali ci danno una sensazione di stabilità e pacatezza, mentre quelle verticali ci trasmettono una sensazione di tensione. Se la schermata è caratterizzata da una prevalenza di linee orizzontali si avrà quindi un'idea di maggiore stabilità. Se al contrario a caratterizzare la schermata è la prevalenza delle linee verticale, avremo un effetto di maggiore dinamismo.

17 11.4 Homepage Non è necessariamente la prima pagina che si visita, ma è sicuramente la più importante. Le sue caratteristiche principali devono essere quelle dell'equilibrio e della chiarezza: entrando in un sito devo capire subito di cosa si parla, devo capire chi mi parla e soprattutto devo essere attratto da qualche cosa. Per il primo punto posso risolvere il problema con il logo e il pay off. La capacità attrattiva è data da una grafica accattivante, il linguaggio, la relazione che nasce tra emittente e destinatario. Gli utenti che arrivano per la prima volta hanno bisogno di sapere dove si trovano e che tipo di navigazione possono fare nel nostro sito, quindi possiamo dire che fornire identità e orientamento sono dunque le due funzionalità principali dell'homepage. Gli utenti che ritornano sul sito lo conoscono già. È probabile che le cose che vogliono trovare sono informazioni sui più recenti aggiornamenti, e, in generale sulle novità e avere facilitazioni nella navigazione. La homepage, nel suo insieme, deve presentare informazioni semplici ed efficaci sull'identità del sito.

Elementi di progettazione di un sito web

Elementi di progettazione di un sito web Elementi di progettazione di un sito web Lo scopo del web designer è quello di rendere accessibile il proprio sito al maggior numero possibile di utenti, alla luce di questo è importantissimo tenere in

Dettagli

Dal foglio di carta alla multimedialità

Dal foglio di carta alla multimedialità Dal foglio di carta alla multimedialità Multimediale Che utilizza più mezzi di comunicazione. Nell'ambito delle tecnologie educative significa utilizzare più mezzi didattici integrati. IPERTESTO E IPERMEDIA

Dettagli

Componenti multimediali per il Web. Modulo 14

Componenti multimediali per il Web. Modulo 14 Componenti multimediali per il Web Modulo 14 Obiettivi Valutare e usare strumenti di utilità e produzione grafica anche animata per inserire e modificare componenti multimediali (immagini, immagini animate,

Dettagli

La codifica delle Immagini. Prof. Francesco Accarino IIS Altiero Spinelli Via Leopardi 132Sesto San Giovanni

La codifica delle Immagini. Prof. Francesco Accarino IIS Altiero Spinelli Via Leopardi 132Sesto San Giovanni La codifica delle Immagini Prof. Francesco Accarino IIS Altiero Spinelli Via Leopardi 132Sesto San Giovanni Lettere e numeri non costituiscono le uniche informazioni utilizzate dagli elaboratori, infatti

Dettagli

Dispense a cura del prof. Ing. Dino Molli. prof. ing. Dino Molli SVILUPPO SOFTWARE - FORMAZIONE E CONSULENZA INFORMATICA MARIGLIANO (NA)

Dispense a cura del prof. Ing. Dino Molli. prof. ing. Dino Molli SVILUPPO SOFTWARE - FORMAZIONE E CONSULENZA INFORMATICA MARIGLIANO (NA) prof. ing. Dino Molli SVILUPPO SOFTWARE - FORMAZIONE E CONSULENZA INFORMATICA MARIGLIANO (NA) http://www.dinomolli.it info@dinomolli.it Dispense a cura del prof. ing. Dino Molli Il sito Web Il Sito Web

Dettagli

CMS MUSEO&WEB Tutorial sulle immagini digitali, la loro elaborazione per il web, il caricamento nell archivio media del CMS

CMS MUSEO&WEB Tutorial sulle immagini digitali, la loro elaborazione per il web, il caricamento nell archivio media del CMS CMS MUSEO&WEB Tutorial sulle immagini digitali, la loro elaborazione per il web, il caricamento nell archivio media del CMS Maria Teresa Natale (OTEBAC) 12 aprile 2010 Introduzione Argomenti: terminologia

Dettagli

Immagini digitali Appunti per la classe 3 R a cura del prof. ing. Mario Catalano

Immagini digitali Appunti per la classe 3 R a cura del prof. ing. Mario Catalano Immagini digitali LA CODIFICA DELLE IMMAGINI Anche le immagini possono essere memorizzate in forma numerica (digitale) suddividendole in milioni di punti, per ognuno dei quali si definisce il colore in

Dettagli

Disegnare il Layout. www.vincenzocalabro.it 1

Disegnare il Layout. www.vincenzocalabro.it 1 Disegnare il Layout www.vincenzocalabro.it 1 Il problema dell interfaccia Una buona interfaccia deve assolvere a diverse funzioni: far percepire i contenuti permettere di individuare le principali aree

Dettagli

Immagini vettoriali. Immagini raster

Immagini vettoriali. Immagini raster Immagini vettoriali Le immagini vettoriali sono caratterizzate da linee e curve definite da entità matematiche chiamate vettori. I vettori sono segmenti definiti da un punto di origine, una direzione e

Dettagli

LA CODIFICA DELLE IMMAGINI

LA CODIFICA DELLE IMMAGINI LA CODIFICA DELLE IMMAGINI Anche le immagini possono essere memorizzate in forma numerica (digitale) suddividendole in milioni di punti, per ognuno dei quali si definisce il colore in termini numerici.

Dettagli

1.3a: La Codifica Digitale delle Immagini

1.3a: La Codifica Digitale delle Immagini 1.3a: La Codifica Digitale delle Immagini Bibliografia Curtin, 4.7 e 4.9 (vecchie edizioni) Curtin, 3.7 e 3.9 (nuova edizione) CR pag. 14-18 Questi lucidi La codifica delle immagini: Pixel Un immagine

Dettagli

Progettazione e costruzione di un sito - Introduzione

Progettazione e costruzione di un sito - Introduzione Differenza fra pagina web, sito e portale Le pagine web sono documenti di testo pubblicati sul Web, che comprendono collegamenti verso file grafici e verso altre pagine web. Una pagina web è costituita

Dettagli

Richiami sugli elementi del linguaggio HTML

Richiami sugli elementi del linguaggio HTML Richiami sugli elementi del linguaggio HTML Un documento in formato Web può essere aperto con un browser, attraverso un collegamento a Internet oppure caricandolo dal disco del proprio computer senza connettersi

Dettagli

Un ripasso di aritmetica: Rappresentazione binaria - operazioni. riporti

Un ripasso di aritmetica: Rappresentazione binaria - operazioni. riporti Un ripasso di aritmetica: Rappresentazione binaria - operazioni A queste rappresentazioni si possono applicare le operazioni aritmetiche: riporti 1 1 0 + 1 0 = 1 0 0 24 Un ripasso di aritmetica: Rappresentazione

Dettagli

Comune di Padova. Manuale pagine NoProfit. Guida alla redazione di pagine web per la sezione NoProfit di Padovanet

Comune di Padova. Manuale pagine NoProfit. Guida alla redazione di pagine web per la sezione NoProfit di Padovanet Comune di Padova Manuale pagine NoProfit Guida alla redazione di pagine web per la sezione NoProfit di Padovanet 1 2 1. INTRODUZIONE 1.1 Il Cms del NoProfit - Plone Che cos'è Plone? 1.2 Ruolo utenti Qual

Dettagli

Usabilità dei Siti Web

Usabilità dei Siti Web Corso di Laurea Magistrale in Scienze dell Informazione Editoriale, Pubblica e Sociale Usabilità dei Siti Web Prof.ssa E. Gentile a.a. 2011-2012 Usabilità La efficacia, efficienza e soddisfazione con cui

Dettagli

Immagini vettoriali Immagini bitmap (o raster) Le immagini vettoriali .cdr.swf .svg .ai.dfx .eps.pdf .psd

Immagini vettoriali Immagini bitmap (o raster) Le immagini vettoriali .cdr.swf .svg .ai.dfx .eps.pdf .psd Esistono due tipi di immagini digitali: Immagini vettoriali, rappresentate come funzioni vettoriali che descrivono curve e poligoni Immagini bitmap, (o raster) rappresentate sul supporto digitale come

Dettagli

Indice. Introduzione 7

Indice. Introduzione 7 Indice Introduzione 7 Capitolo primo. Dove costruiamo 15 1. Internet 15 2. HTML e Web Browser 18 3. Testi e ipertesti 22 4. I navigatori 24 In conclusione 26 Capitolo secondo. Gettiamo le fondamenta 27

Dettagli

PROGETTAZIONE DI UN SITO WEB

PROGETTAZIONE DI UN SITO WEB PROGETTAZIONE DI UN SITO WEB UN BUON SITO DEVE AVERE DUE CARATTERISTICHE: USABILITA ACCESSIBILITA Navigazione fluida con contenuti facilmente reperibili. Organizzazione dei contenuti e predisposizione

Dettagli

Corso di Informatica

Corso di Informatica Corso di Informatica Modulo T2 A2 Elaborazione grafica in 2D 1 Prerequisiti Utilizzo elementare di applicazioni grafiche Conoscenza elementare di dispositivi grafici Elementi di numerazione binaria 2 1

Dettagli

Le immagini digitali. Modulo 2. Rappresentazione analogica. Rappresentazione digitale. Una palette a 16 colori

Le immagini digitali. Modulo 2. Rappresentazione analogica. Rappresentazione digitale. Una palette a 16 colori Foto digitale, invio via mail e inserimento in una pagina web Modulo 2 Cosa si intende con analogico e digitale? Come avviene la rappresentazione digitale delle immagini? Come è possibile trasformare un

Dettagli

02 web. designer. info. certificazioni. specializzazioni avanzate

02 web. designer. info. certificazioni. specializzazioni avanzate info durata: 10 mesi inizio: novembre 2010 frequenza: 4 ore a settimana software: Adobe Illustrator, Photoshop, Flash, Dreamweaver certificazioni Adobe Certified Expert (ACE) per i software: Illustrator,

Dettagli

CORSI I principali programmi Adobe Photoshop/InDesign/Illustrator Nozioni di base

CORSI I principali programmi Adobe Photoshop/InDesign/Illustrator Nozioni di base CORSI I principali programmi Adobe Photoshop/InDesign/Illustrator Nozioni di base Interfaccia programma InDesign Comprendere il concetto dei programmi Adobe e la loro funzione Prima di tutto bisogna tener

Dettagli

01. Conoscere l area di lavoro

01. Conoscere l area di lavoro 01. Conoscere l area di lavoro Caratteristiche dell interfaccia Cambiare vista e dividere le viste Gestire i pannelli Scegliere un area di lavoro Sistemare le barre degli strumenti Personalizzare le preferenze

Dettagli

IMMAGINE BITMAP E VETTORIALI

IMMAGINE BITMAP E VETTORIALI BITMAP VETTORIALE VETTORIALE BITMAP IMMAGINE BITMAP è una immagine costituita da una matrice di Pixel. PIXEL (picture element) indica ciascuno degli elementi puntiformi che compongono la rappresentazione

Dettagli

APPUNTI DI HTML (TERZA LEZIONE)

APPUNTI DI HTML (TERZA LEZIONE) Il web è costituito non da testi ma da ipertesti. APPUNTI DI HTML (TERZA LEZIONE) I link ci permettono di passare da un testo all altro. I link sono formati da due componenti: IL CONTENUTO "nasconde" il

Dettagli

Grafica Online Luca Panella Innovatek scrl - Bari

Grafica Online Luca Panella Innovatek scrl - Bari Grafica Online Luca Panella Innovatek scrl - Bari Sommario Scenario Web Nozioni di grafica on-line Principali programmi di grafica web Realizzazione di banner e layout per il web 2 Risorse online Sito

Dettagli

La codifica delle immagini

La codifica delle immagini Analogamente possiamo codificare le immagini a colori. In questo caso si tratta di individuare un certo numero di sfumature, gradazioni di colore differenti e di codificare ognuna mediante un'opportuna

Dettagli

La codifica delle immagini

La codifica delle immagini Analogamente possiamo codificare le immagini a colori. In questo caso si tratta di individuare un certo numero di sfumature, gradazioni di colore differenti e di codificare ognuna mediante un'opportuna

Dettagli

PDF created with pdffactory trial version www.pdffactory.com

PDF created with pdffactory trial version www.pdffactory.com Codifica di immagini Codifica di immagini o Un immagine è un insieme continuo di informazioni A differenza delle cifre e dei caratteri alfanumerici, per le immagini non esiste un'unità minima di riferimento

Dettagli

USABILITÀ DEL SITO (*)

USABILITÀ DEL SITO (*) USABILITÀ DEL SITO (*) In generale un progetto software tecnicamente perfetto ma difficile da usare è destinato a non essere usato! Pertanto l'usabilità di un'applicazione software rappresenta una delle

Dettagli

Creazione di un ipertesto con Word

Creazione di un ipertesto con Word Creazione di un ipertesto con Word Realizzare un ipertesto per illustrare la storia dell esplorazione dello spazio. Descriviamo le fasi principali per la creazione di un ipertesto: a. all inizio occorre

Dettagli

Introduzione. Le pagine web sono scritte in HTML un semplice linguaggio di scrittura. HTML è la forma abbreviata di HyperText Markup Language

Introduzione. Le pagine web sono scritte in HTML un semplice linguaggio di scrittura. HTML è la forma abbreviata di HyperText Markup Language HTML 05/04/2012 1 Introduzione Le pagine web sono scritte in HTML un semplice linguaggio di scrittura. HTML è la forma abbreviata di HyperText Markup Language L'ipertesto è semplicemente un testo che funziona

Dettagli

Gestione dei contenuti web Ultimi eventi

Gestione dei contenuti web Ultimi eventi Gestione dei contenuti web Ultimi eventi Questo manuale illustra le operazioni più comuni per la manutenzione e aggiornamento del sito web http://terremoti.ingv.it/ultimi eventi/ tramite l interfaccia

Dettagli

Laboratorio di Tecnologie dell Istruzione e dell Apprendimento. Indice

Laboratorio di Tecnologie dell Istruzione e dell Apprendimento. Indice INSEGNAMENTO DI LABORATORIO DI TECNOLOGIE DELL ISTRUZIONE E DELL APPRENDIMENTO LEZIONE II IPERTESTI E WEB ANTOLOGIE CON WORD PROF.SSA ELVIRA VENTRE Indice 1 L ipertesto un modo naturale di elaborare le

Dettagli

Word Processor: WORD. Classificazione

Word Processor: WORD. Classificazione Parte 5 Word Processor: WORD Classificazione Esistono diversi strumenti per la realizzazione di documenti di testuali: Editor di testo (Es: Blocco Note) Word Processor (Es: MS Word, Open Office ) Applicazioni

Dettagli

Realizzazione siti web. Ipertesti e Ipermedia

Realizzazione siti web. Ipertesti e Ipermedia Realizzazione siti web Ipertesti e Ipermedia Ipertesto e Ipermedia Ipertesto e Ipermedia (con riferimento a ipermedia HTML) Progettazione di un ipermedia Valutazione di siti web Esercitazione pratica progettazione

Dettagli

Guida OpenOffice.org Impress

Guida OpenOffice.org Impress Guida OpenOffice.org Impress Introduzione ad Impress IMPRESS è un programma nato per creare presentazioni e lezioni di aspetto professionale. È un programma inserito nella versione standard del pacchetto

Dettagli

Rappresentazione delle Immagini

Rappresentazione delle Immagini Rappresentazione delle Immagini Metodi di rappresentazione Raster: Informazione grafica rappresentata come matrice di pixel Vettoriale: Informazione grafica rappresentata da relazioni matematiche (funzioni

Dettagli

mi ritrovai per una selva oscura Master Catalogazione AA 2009/10 Maria A. Alberti Gestione dell Informazione Testo e grafica a videa Il testo

mi ritrovai per una selva oscura Master Catalogazione AA 2009/10 Maria A. Alberti Gestione dell Informazione Testo e grafica a videa Il testo Il testo Testo ha una doppia natura rappresentazione visiva del linguaggio un segno grafico proprio a video Testo digitale Contenuto del testo i caratteri e le parole Aspetto del testo Master Catagolazione

Dettagli

LEZIONE NO. 1: INTRODUZIONE, ELEMENTI BASE, DI ATTILIO ABBIEZZI

LEZIONE NO. 1: INTRODUZIONE, ELEMENTI BASE, <HEAD> DI ATTILIO ABBIEZZI HTML BASE LEZIONE NO. 1: INTRODUZIONE, ELEMENTI BASE, DI ATTILIO ABBIEZZI FONTI: HTML.IT 1 Breve Introduzione Che cosa significa linguaggio HTML? HTML = HyperText Markup Language Il primo concetto

Dettagli

LEZIONE NO. 4: IMMAGINI E LINK: DI ATTILIO ABBIEZZI

LEZIONE NO. 4: IMMAGINI E LINK: <IMG> <A HREF> DI ATTILIO ABBIEZZI HTML BASE LEZIONE NO. 4: IMMAGINI E LINK: DI ATTILIO ABBIEZZI FONTI: HTML.IT 1 inserire immagini Internet, solo negli ultimi 10 anni affermatasi come media di massa, è stato per lunghi

Dettagli

Publishing & Editing Immagini

Publishing & Editing Immagini Publishing & Editing Immagini Un'immagine digitale è la rappresentazione numerica di una immagine bidimensionale. La rappresentazione può essere di tipo vettoriale oppure raster (altrimenti detta bitmap);

Dettagli

Contenuti per il Web. Guida e buone norme per l utente

Contenuti per il Web. Guida e buone norme per l utente Contenuti per il Web Guida e buone norme per l utente A cura di: Città in Internet v1.1 Luglio 2003 1 INDICE 1. SCRIVERE PER IL WEB...3 1. Controllare sintassi e grammatica...3 2. Rendere il testo "percorribile

Dettagli

Ipertesto, navigazione e cenni HTML. Lezione Informatica I CLAWEB

Ipertesto, navigazione e cenni HTML. Lezione Informatica I CLAWEB Ipertesto, navigazione e cenni HTML Lezione Informatica I CLAWEB 1 Il concetto di Ipertesto (1/2) Definizione: Modello testuale in cui le diverse unità di contenuti non sono articolate secondo un ordine

Dettagli

LA PROFESSIONE DEL WEB DESIGNER

LA PROFESSIONE DEL WEB DESIGNER LA PROFESSIONE DEL WEB DESIGNER Lezione 1 1 Web Design Lafiguracentralenelprogettodiunsitowebèilwebdesigner:eglisioccupadell'aspetto visivo e del coinvolgimento emotivo di siti Web business to business

Dettagli

Modulo 8. Strumenti di produzione Strumenti. Gli strumenti più utilizzati per produrre pagine Web sono essenzialmente due:

Modulo 8. Strumenti di produzione Strumenti. Gli strumenti più utilizzati per produrre pagine Web sono essenzialmente due: Pagina 1 di 6 Strumenti di produzione Strumenti Gli strumenti più utilizzati per produrre pagine Web sono essenzialmente due: 1. Netscape Composer, gratuito e scaricabile da netscape.org assieme al browser

Dettagli

MANUALE D USO Stazione editoriale MIR cms

MANUALE D USO Stazione editoriale MIR cms MANUALE D USO Stazione editoriale MIR cms Come si accede: Per entrare alla parte amministrativa del sito è sufficiente digitare nella barra dell url l indirizzo del sito seguito da: /admin/ nome del sito

Dettagli

IV CAP IMPORTAZIONE ED ELABORAZIONE DI IMMAGINI

IV CAP IMPORTAZIONE ED ELABORAZIONE DI IMMAGINI IV CAP IMPORTAZIONE ED ELABORAZIONE DI IMMAGINI IV.1 Importazione di immagini vettoriali. Con Flash è possibile realizzare grafica vettoriale, oppure è possibile elaborare sia grafica vettoriale creata

Dettagli

LO STRUMENTO PRINCIPALE: IL SITO WEB

LO STRUMENTO PRINCIPALE: IL SITO WEB LO STRUMENTO PRINCIPALE: IL SITO WEB 1 Content Management System (CMS) Software (web based) dedicati alla gestione di un sito web: portali, siti aziendali, intranet, blog, Wiki L obiettivo è consentire

Dettagli

Word Processor: WORD (livello base) Classificazione

Word Processor: WORD (livello base) Classificazione Parte 5 Word Processor: WORD (livello base) Elementi di Informatica - AA 2008/2009 - MS Word 1 di 60 Classificazione Esistono diversi strumenti per la realizzazione di documenti testuali: Editor di testo

Dettagli

PRINCIPI DI PROGETTAZIONE DI UN SITO WEB

PRINCIPI DI PROGETTAZIONE DI UN SITO WEB PRINCIPI DI PROGETTAZIONE DI UN SITO WEB Area di specializzazione Esperto in DTP e Web graphic design Anno scolastico 2006/2007 Prof. ALDO GORLA PRINCIPI DI PROGETTAZIONE DI UN SITO WEB Progettare in base

Dettagli

Rich Media Communication Using Flash CS5

Rich Media Communication Using Flash CS5 Rich Media Communication Using Flash CS5 Dominio 1.0 Impostare i requisiti del progetto 1.1 Individuare lo scopo, i destinatari e le loro esigenze per i contenuti multimediali. 1.2 dentificare i contenuti

Dettagli

WWW.ICTIME.ORG. NVU Manuale d uso. Cimini Simonelli Testa

WWW.ICTIME.ORG. NVU Manuale d uso. Cimini Simonelli Testa WWW.ICTIME.ORG NVU Manuale d uso Cimini Simonelli Testa Cecilia Cimini Angelo Simonelli Francesco Testa NVU Manuale d uso EDIZIONE Gennaio 2008 Questo manuale utilizza la Creative Commons License www.ictime.org

Dettagli

XnView. Visualizzatore/Convertitore di formato per immagini. Guida di riferimento alle funzionalità principali

XnView. Visualizzatore/Convertitore di formato per immagini. Guida di riferimento alle funzionalità principali XnView Visualizzatore/Convertitore di formato per immagini Guida di riferimento alle funzionalità principali Questa guida è stata realizzata dall'aiuto in linea di XnView ed ha lo scopo di essere un riferimento

Dettagli

GLI STRUMENTI DELLA SMART BOARD

GLI STRUMENTI DELLA SMART BOARD GLI STRUMENTI DELLA SMART BOARD La struttura tecnologica è formata da: Lavagna interattiva:può essere di varie misure (da 48 a94 ) e formati (4/3 o 16/9) Proiettore: può essere sia grandangolare (con molti

Dettagli

8 Word seconda lezione 1

8 Word seconda lezione 1 8 Word seconda lezione 1 Word incominciamo a digitare! È il momento di iniziare a scrivere, posizionandosi con il cursore all inizio o in mezzo al documento. Talvolta però può capitare di fare degli sbagli.

Dettagli

PROGETTARE UNA PAGINA WEB

PROGETTARE UNA PAGINA WEB PROGETTARE UNA PAGINA WEB Che differenza c è tra una grafica cartacea e una grafica per web? Nella maggior parte dei casi, quando parliamo di grafica cartacea parliamo di cartellonistica volantini, manifesti

Dettagli

La codifica delle immagini

La codifica delle immagini La codifica delle immagini La digitalizzazione La digitalizzazione di oggetti legati a fenomeni di tipo analogico, avviene attraverso due parametri fondamentali: 1. Il numero dei campionamenti o di misurazioni

Dettagli

Origine delle immagini. Elaborazione delle immagini. Immagini vettoriali VS bitmap 2. Immagini vettoriali VS bitmap.

Origine delle immagini. Elaborazione delle immagini. Immagini vettoriali VS bitmap 2. Immagini vettoriali VS bitmap. Origine delle immagini Elaborazione delle immagini Adobe Photoshop I programmi per l elaborazione di immagini e la grafica permettono in genere di: Creare immagini ex novo (con gli strumenti di disegno)

Dettagli

CORSO DI WEB DESIGN 40 ORE

CORSO DI WEB DESIGN 40 ORE CORSO DI WEB DESIGN 40 ORE Adobe Photoshop CS5 Unità didattica 1: Grafica bitmap ed introduzione all utilizzo di photoshop Concetti fondamentali di Photoshop Immagini bitmap e grafica vettoriale Dimensioni

Dettagli

I formati dei file immagine

I formati dei file immagine I formati dei file immagine Le immagini vettoriali Le immagini vettoriali sono caratterizzate da linee e curve definite da entità matematiche chiamate vettori I vettori sono segmenti definti da un punto

Dettagli

eascom MANUALE per UTENTI A cura di eascom 2012 www.eascom.it

eascom MANUALE per UTENTI A cura di eascom 2012 www.eascom.it MANUALE per UTENTI A cura di eascom 2012 www.eascom.it Indice Introduzione... 3 Perchè Wordpress... 3 Pagina di accesso all amministrazione... 3 Bacheca... 4 Home... 4 Aggiornamenti... 5 Articoli... 6

Dettagli

Realizzazione siti web. Le immagini

Realizzazione siti web. Le immagini Realizzazione siti web Le immagini Rappresentqazione digitale delle immagini (immagini bitmapped Si sovrappone all'immagine analogica (ad esempio una fotografia) una griglia fittissima di minuscole cellette.

Dettagli

Manuali.net. Nevio Martini

Manuali.net. Nevio Martini Manuali.net Corso base per la gestione di Siti Web Nevio Martini 2009 Il Linguaggio HTML 1 parte Introduzione Internet è un fenomeno in continua espansione e non accenna a rallentare, anzi è in permanente

Dettagli

AZIENDE. Destinatari Utenti che devono utilizzare a livello base o avanzato applicazioni di office automation.

AZIENDE. Destinatari Utenti che devono utilizzare a livello base o avanzato applicazioni di office automation. AZIENDE 1) Information Technology 1.1 Open Office Il mondo Open Source rappresenta per l'azienda una determinante opportunità di contenimento dei costi pur mantenendo assoluta qualità dei prodotti. La

Dettagli

I link e l'ipertestualità

I link e l'ipertestualità I link e l'ipertestualità I link sono "il ponte" che consente di passare da un documento all altro. In quanto tali, i link sono formati da due componenti: il contenuto che "nasconde" il collegamento (può

Dettagli

Introduzione a PowerPoint

Introduzione a PowerPoint Office automation - Dispensa su PowerPoint Pagina 1 di 11 Introduzione a PowerPoint Premessa Uno strumento di presentazione abbastanza noto è la lavagna luminosa. Questo strumento, piuttosto semplice,

Dettagli

GNred Ver1.5 Manuale utenti

GNred Ver1.5 Manuale utenti GNred Ver1.5 Manuale utenti [ultima modifica 09.06.06] 1 Introduzione... 2 1.1 Cos è un CMS?... 2 1.2 Il CMS GNred... 2 1.2.1 Concetti di base del CMS GNred... 3 1.2.2 Workflow... 3 1.2.3 Moduli di base...

Dettagli

Tecniche per un blog accessibile e usabile

Tecniche per un blog accessibile e usabile DIODATI.ORG Accessibilità e traduzioni dal W3C Tecniche per un blog accessibile e usabile Roma, 3 novembre 2005 Presentazione di Michele Diodati michele@diodati.org http://www.diodati.org http://pesanervi.diodati.org

Dettagli

Sito internet del Progetto ALPTER Guida all uso

Sito internet del Progetto ALPTER Guida all uso Sito internet del Progetto ALPTER Guida all uso Sito internet del Progetto ALPTER Guida all uso... 1 Introduzione: siti statici e dinamici... 2 Inserimento dei file e dei contenuti nel sito... 4 Rubriche...

Dettagli

Il linguaggio HTML - Nozioni di base

Il linguaggio HTML - Nozioni di base Corso IFTS Informatica, Modulo 3 Progettazione pagine web statiche (50 ore) Il linguaggio HTML - Nozioni di base Dott. Chiara Braghin braghin@dti.unimi.it What is HTML? HTML (HyperText Markup Language)

Dettagli

Immagini Digitali Immagini digitali

Immagini Digitali Immagini digitali Immagini digitali Processi e metodi per la codifica e il trattamento dei formati raster e vettoriali Immagini raster Fondamenti Le immagini raster, chiamate anche pittoriche o bitmap, sono immagini in

Dettagli

Valutare l efficacia e l usabilità dei siti web

Valutare l efficacia e l usabilità dei siti web Valutare l efficacia e l usabilità dei siti web CONTENUTI OBIETTIVI DELLA LEZIONE 1. Chiarire cosa si intende per efficacia e usabilità dei siti Web 2. Descrivere alcune tecniche per misurare tali caratteristiche

Dettagli

Creare e formattare i documenti

Creare e formattare i documenti Università di L Aquila Facoltà di Biotecnologie Esame di INFORMATICA Elaborazione di testi Creare e formattare i documenti 1 IL WORD PROCESSOR I programmi per l elaborazione di testi ( detti anche di videoscrittura

Dettagli

3. LA RISOLUZIONE Misura della risoluzione Modifica della risoluzione

3. LA RISOLUZIONE Misura della risoluzione Modifica della risoluzione 3. LA RISOLUZIONE La risoluzione di un immagine indica il grado di qualità di un immagine. Generalmente si usa questo termine parlando di immagini digitali, ma anche una qualunque fotografia classica ha

Dettagli

12 famiglie e tipi di file (estensioni più comuni)

12 famiglie e tipi di file (estensioni più comuni) 12 famiglie e tipi di file (estensioni più comuni) Ogni file è caratterizzato da un proprio nome e da una estensione, in genere tre lettere precedute da un punto; ad esempio:.est Vi sono tuttavia anche

Dettagli

Dichiarazione di Accessibilità

Dichiarazione di Accessibilità Dichiarazione di Accessibilità Requisito n. 1 : Realizzare le pagine e gli oggetti al loro interno utilizzando tecnologie definite da grammatiche formali pubblicate nelle versioni più recenti disponibili

Dettagli

Informatica. Classe Prima

Informatica. Classe Prima Informatica Classe Prima Obiettivo formativo Conoscenze Abilità Conoscere e utilizzare il computer per semplici attività didattiche Conoscere i componenti principali del computer. o Distinguere le parti

Dettagli

Istruzioni generali per l'amministrazione di siti creati in EzPublish

Istruzioni generali per l'amministrazione di siti creati in EzPublish Istruzioni generali per l'amministrazione di siti creati in EzPublish EzPublish è un Content Management System (CMS) web-oriented: la pubblicazione di contenuti, documenti, file, elementi multimediali

Dettagli

Maria Grazia Ottaviani. informatica, comunicazione e multimedialità

Maria Grazia Ottaviani. informatica, comunicazione e multimedialità Maria Grazia Ottaviani informatica, comunicazione e multimedialità Unità digitale 1 Ambiente HTML Introduzione Oltre ai linguaggi di programmazione esistono anche linguaggi detti markup. Sono linguaggi

Dettagli

Accessibilità del sito web del Comune di Triggiano

Accessibilità del sito web del Comune di Triggiano Accessibilità del sito web del Comune di Triggiano Il Comune di Triggiano, già attento nella precedente versione del suo sito web al tema dell'accessibilità delle informazioni, ha riprogrammato tutte le

Dettagli

Esercitazione n. 10: HTML e primo sito web

Esercitazione n. 10: HTML e primo sito web + Strumenti digitali per la comunicazione A.A 0/4 Esercitazione n. 0: HTML e primo sito web Scopo: Creare un semplice sito web con Kompozer. Il sito web è composto da una home page, e da altre due pagine

Dettagli

Il Word Processor (Word per Windows) Ottobre 2001 Dott. Paolo PAVAN

Il Word Processor (Word per Windows) Ottobre 2001 Dott. Paolo PAVAN Il Word Processor (Word per Windows) Ottobre 2001 Dott. Paolo PAVAN Il Word Processor Un Word Processor (WP), è un programma di elaborazione testi Esso quindi permette di scrivere, memorizzare e stampare

Dettagli

Creazione di un elemento grafico SmartArt Crea una nuova diapositiva con layout Titolo e contenuto.

Creazione di un elemento grafico SmartArt Crea una nuova diapositiva con layout Titolo e contenuto. G. Pettarin ECDL Modulo 6: Strumenti di presentazione 98 6. Gli Smartart Con gli elementi grafici SmartArt si può rappresentare visivamente le informazioni e i concetti che si vuole illustrare. È possibile

Dettagli

Foto di CoffeeGeek, Flickr. Slide e dintorni. materiale didattico sul corso di Impress a cura di Sonia Montegiove. 1 di 21

Foto di CoffeeGeek, Flickr. Slide e dintorni. materiale didattico sul corso di Impress a cura di Sonia Montegiove. 1 di 21 Foto di CoffeeGeek, Flickr Slide e dintorni materiale didattico sul corso di Impress a cura di Sonia Montegiove 1 di 21 10 regole da rispettare per fare una presentazione Non usare caratteri piccoli e

Dettagli

La rappresentazione delle informazioni

La rappresentazione delle informazioni La rappresentazione delle informazioni In queste pagine cercheremo di capire come sia possibile rappresentare mediante numeri e memorizzare in un file testi, immagini, video, suoni Il computer per lavorare

Dettagli

Capitolo3. Si apre la seguente finestra. Figura 29. Proprietà immagine di sfondo. - Università degli Studi della Repubblica di San Marino -

Capitolo3. Si apre la seguente finestra. Figura 29. Proprietà immagine di sfondo. - Università degli Studi della Repubblica di San Marino - Capitolo3 LAVORARE CON LE IMMAGINI E certo che l impatto visivo in un sito internet è molto importante ma è bene tenere presente che immagini e fotografie, pur arricchendo la struttura grafica di un web,

Dettagli

Come realizzare una buona presentazione (traduzione libera a cura della redazione di EpiCentro)

Come realizzare una buona presentazione (traduzione libera a cura della redazione di EpiCentro) Come realizzare una buona presentazione (traduzione libera a cura della redazione di EpiCentro) Quando si realizzano dei documenti visivi per illustrare dati e informazioni chiave, bisogna sforzarsi di

Dettagli

A cura dell insegnante Elena Serventi Funzione strumentale TIC (Tecnologie dell Informazione e della Comunicazione) del circolo didattico di Pavone

A cura dell insegnante Elena Serventi Funzione strumentale TIC (Tecnologie dell Informazione e della Comunicazione) del circolo didattico di Pavone A cura dell insegnante Elena Serventi Funzione strumentale TIC (Tecnologie dell Informazione e della Comunicazione) del circolo didattico di Pavone Canavese Febbraio 2011 Cos'è una LIM? LIM è l'acronimo

Dettagli

ITS Lab/ IS G.Minzoni INTRODUZIONE AL WEB DESIGNER

ITS Lab/ IS G.Minzoni INTRODUZIONE AL WEB DESIGNER ITS Lab/ IS G.Minzoni INTRODUZIONE AL WEB DESIGNER Il Web DESIGNER è l'arte di creare template e layout per siti o per singole pagine Web che abbiano le caratteristiche di: essere comunicative; essere

Dettagli

Dal connubio Streamit e Salsamania Radio Television Entertainment Inc nasce Cubamania Television

Dal connubio Streamit e Salsamania Radio Television Entertainment Inc nasce Cubamania Television Streamit, la Web Tv che fa ascolti da 'grande'.streamit è una delle realtà più interessanti nel panorama delle Web Tv. Graficamente e funzionalmente strepitoso, il software per la visualizzazione dello

Dettagli

PowerPoint 2007 Le funzioni

PowerPoint 2007 Le funzioni PowerPoint 2007 Le funzioni Introduzione Cos è un ipertesto L' ipertesto è un testo organizzato in link, o collegamenti ad altre parti del testo e/o altri testi, in modo da consentire all utente di scegliere

Dettagli

L essenziale da sapere per rendere usabile un sito web

L essenziale da sapere per rendere usabile un sito web L essenziale da sapere per rendere usabile un sito web I principi base dell usabilità 5 8 linee guida per scrivere per il web 7 10 linee guida per l e-commerce 10 Pagina 2 I PRINCIPI BASE DELL USABILITÀ

Dettagli

Esercitazioni di Informatica Grafica A.A. 2009-2010

Esercitazioni di Informatica Grafica A.A. 2009-2010 Esercitazioni di Informatica Grafica A.A. 2009-2010 Ing. Simone Garagnani simone.garagnani@unibo.it UNIVERSITA DI BOLOGNA Simone Garagnani - Esercitazioni di Informatica Grafica PARTE II Gli strumenti

Dettagli

L interfaccia di P.P.07

L interfaccia di P.P.07 1 L interfaccia di P.P.07 Barra Multifunzione Anteprima delle slide Corpo della Slide Qui sotto vediamo la barra multifunzione della scheda Home. Ogni barra è divisa in sezioni: la barra Home ha le sezioni

Dettagli

Implementare ipermedia

Implementare ipermedia Implementare ipermedia Presentazione Alla fase di progettazione e di sviluppo di un ipermedia segue quella della sua implementazione ossia della sua realizzazione in qualcosa di fruibile online o comunque

Dettagli