La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

30/04/2014Corso di Informatica1/19 Progettazione di un sito Web Docente Ing. Maria Mirto Ing. Passante Marco.

Presentazioni simili


Presentazione sul tema: "30/04/2014Corso di Informatica1/19 Progettazione di un sito Web Docente Ing. Maria Mirto Ing. Passante Marco."— Transcript della presentazione:

1 30/04/2014Corso di Informatica1/19 Progettazione di un sito Web Docente Ing. Maria Mirto Ing. Passante Marco

2 30/04/2014Corso di Informatica2/19 Cosè un sito Web? Sito Web: un insieme coordinato di pagine, relative ad uno stesso tema, che risiedono tipicamente su uno stesso server Esistono diversi tipi di siti Web: completamente liberi: in cui ogni pagina è diversa dalle altre con una struttura regolare nella presentazione delle informazioni, in cui esistono cioè pagine con la stessa struttura e quindi riconoscibili come una serie dove l'informazione è piuttosto statica dove l'informazione è altamente dinamica e quindi una preoccupazione importante deve essere la frequenza di aggiornamento e la manutenzione.

3 30/04/2014Corso di Informatica3/19 Siti statici vs siti dinamici Dal punto di vista della struttura e della tecnologia utilizzata: siti statici siti dinamici I siti web statici presentano contenuti di sola ed esclusiva lettura. Solitamente vengono aggiornati con una bassa frequenza e sono mantenuti da una o più persone che agiscono direttamente sul codice della pagina (tramite appositi editor web). Si tratta storicamente della prima generazione di siti web. I siti web dinamici presentano invece contenuti redatti dinamicamente (in genere grazie al collegamento con un database) e forniscono contenuti che possono variare in base a più fattori. I siti web dinamici sono caratterizzati da un'alta interazione fra sito e utente;

4 30/04/2014Corso di Informatica4/19 Tipologie di siti I siti web vengono poi comunemente divisi in categorie per inquadrarne il settore di operatività o i servizi offerti: Siti a carattere educativo, didattici incoraggiare l'esplorazione del sito secondo un filo logico piuttosto che lasciare la più assoluta libertà nella navigazione. Siti a carattere informativo È importante la natura delle informazioni che si vogliono fornire, se sono relativamente stabili o se cambiano spesso; E importante che siano aggiornate tempestivamente; Le informazioni possono essere riconducibili a delle strutture ricorrenti. Se l'informazione è abbastanza strutturata bisognerà allora prendere in considerazione la possibilità di mantenere le informazioni in una base di dati e prevedere meccanismi per la generazione automatica delle pagine. Esempi di siti informativi: –cataloghi –un sito di un dipartimento universitario che pubblica la lista dei corsi offerti.

5 30/04/2014Corso di Informatica5/19 Tipologie di siti Siti di immagine (brochurware) e personali fornire un'immagine ad una organizzazione o ad una persona, e allora la domanda da porsi è qual è l'immagine che si vuole comunicare. Siti commerciali lo scopo principale del sito è attrarre clienti e quindi bisogna progettarlo nell'ottica di attrarre visitatori nella fascia di mercato in cui il prodotto si colloca. Siti che offrono servizi ad esempio un motore di ricerca o un servizio gratuito di posta elettronica, la struttura del sito può essere relativamente semplice ma la complessità risiede nell'applicazione sottostante che realizza il servizio. Portali Siti di intrattenimento Siti di comunità Siti artistici...

6 30/04/2014Corso di Informatica6/19 Analisi È importante capire di quale tipo di sito si tratta facendo un'analisi prima di intraprendere il progetto. Avere in mente l'obiettivo per cui il sito viene costruito, e le caratteristiche del contenuto informativo può aiutare a capire le caratteristiche che il sito stesso deve avere e fare le scelte giuste nella fase di realizzazione.

7 30/04/2014Corso di Informatica7/19 Caratteristiche non funzionali di un sito Web Fattori di qualità Navigabilità Accessibilità Usabilità Leggibilità Affidabilità Manutenibilità Sicurezza

8 30/04/2014Corso di Informatica8/19 I linguaggi Il linguaggio più diffuso con cui i siti web sono costruiti è lHTML (Hyper Text Markup Language) e suoi derivati. L'HTML viene interpretato da particolari software chiamati web browser Es: Firefox e Internet Explorer. Alcuni plugin per i browser permettono la visualizzazione di contenuti animati, come Flash, Shockwave o applet Java. Alcuni contenuti possono essere generati dinamicamente sul browser dell'utente, ad esempio tramite JavaScript o Dynamic HTML, tecnologie supportate per impostazione predefinita da tutti i browser recenti. Per la costruzione di siti web dinamici in grado di estrapolare dati da database, inviare , gestire informazioni, ecc., i linguaggi di scripting più diffusi sono PHP e ASP.NET Per la creazione di siti internet molti webmaster utilizzano comunemente strumenti automatizzati, chiamati web editor, grazie ai quali redigere il codice anche senza averne un'approfondita conoscenza.

9 30/04/2014Corso di Informatica9/19 HTML L HTML (HyperText Markup Language) è il linguaggio utilizzato dai documenti Web. Grazie al loro specifico formato, i documenti presenti su Web sono veri e propri ipertesti. Un ipertesto è un documento nel quale alcuni elementi (parole attive sottolineate) rappresentano dei legami con altri documenti. La struttura viene definita interattiva in quanto è possibile selezionare gli elementi attivi per avviare immediatamente il collegamento al documento di interesse ad esso riferito.

10 30/04/2014Corso di Informatica10/19 HTML LHTML è un linguaggio molto semplice ma nello stesso tempo molto potente, creato per realizzare pagine ipertestuali da pubblicare sulla rete Internet, grazie al servizio WWW (World Wide Web). Un documento HTML è composto da un testo intervallato da alcuni elementi (o tag) che ne indicano la funzione logica oppure inseriscono dei comandi di formattazione. Il linguaggio HTML è caratterizzato da una serie di elementi ed attributi che sono di riferimento quando viene esaminato il codice delle pagine realizzate.

11 30/04/2014Corso di Informatica11/19 HTML Tali elementi definiscono le due sezioni di un documento HTML: lintestazione il corpo Definiscono anche gli elementi specifici del documento (es. titolo, commenti,...) ELEMENTI PRINCIPALI: definiscono i paragrafi e le intestazioni del documento, creando la struttura principale della pagina CARATTERISTICHE DEL TESTO: modificano il ruolo e laspetto estetico del testo contenuto tra linizio e la fine LISTE (Elenchi) COLLEGAMENTI: creano i collegamenti ipertestuali e la specificazione dei puntamenti IMMAGINI TABELLE: consentono di formattare i dati e di organizzare in modo complesso la struttura della pagina MODULI (Forms): per la creazione di questionari interattivi

12 30/04/2014Corso di Informatica12/19 HTML: Comandi principali Definiscono i paragrafi e le intestazioni del documento, creando la struttura principale della pagina: Segnala al browser il linguaggio in cui è redatto il documento Raccoglie le informazioni relative al documento Assegna un titolo al documento Delimita il contenuto di una pagina HTML

13 30/04/2014Corso di Informatica13/19 HTML: Formattazione del testo Modificano il ruolo e laspetto estetico del testo contenuto tra linizio e la fine: Inizia un nuovo paragrafo Inserisce un ritorno a capo Trasforma il testo delimitato in carattere neretto (logico) Inserisce una citazione rientrate nel testo

14 30/04/2014Corso di Informatica14/19 HTML: Liste di elenchi Inizio di una lista non numerata Inizio di una lista numerata Indica linizio di una voce di lista Inizio di una lista di tipo a menu

15 30/04/2014Corso di Informatica15/19 HTML: Collegamenti Creano i collegamenti ipertestuali e la specificazione dei puntamenti indica un collegamento ad unaltra pagina. Alcuni URL possibili sono: –Puntamento ad una pagina esterna (la pagina risiede su un web server esterno) file://c:\sito\pagina.htm –Puntamento ad una pagina interna (la pagina risiede sul web server interno) –Per spedire una mail al destinatario indica un riferimento allinterno di una stessa pagina

16 30/04/2014Corso di Informatica16/19 HTML: Immagini Inserisce limmagine nella pagina Permette di visualizzare del testo alternativo allimmagine per utenti che utilizzano un browser solo testo Indica lallineamento dellimmagine rispetto alla riga di testo (alto/centro/basso)

17 30/04/2014Corso di Informatica17/19 HTML: Tabelle Consentono di formattare i dati e di organizzare in modo complesso la struttura della pagina: Inserisce una tabella Indica una nuova riga di tabella Indica una singola cella allinterno di una riga di tabella Inserisce un titolo per la tabella Inserisce una riga per i titoli dei campi della tabella

18 30/04/2014Corso di Informatica18/19 Figure professionali Attività complessa che coinvolge più persone e professionalità il webmaster, che progetta il sito e ne è il responsabile l'esperto di architettura dellinformazione (information architect), che è responsabile dell'organizzazione dell'intero sito e della struttura di navigazione il content manager, che è responsabile della redazione del contenuto e della struttura logica il webdesigner, che è responsabile dell'aspetto grafico (layout) il programmatore o sviluppatore, che è responsabile del comportamento delle pagine lesperto di webmarketing, che si occupa della promozione del sito nel web il responsabile SEO (search engine optimization), che si occupa del posizionamento del sito all'interno degli indici dei motori di ricerca il sistemista, che gestisce la rete, lhardware e il software di base del web server in cui è ospitato il sito.

19 30/04/2014Corso di Informatica19/19 Struttura di un sito Web Home Page Punto di ingresso nel sito Posto migliore per inserire un menù di collegamenti o un sommario del sito Non soggetta a grosse variazioni Pagine Differenti per lunghezza e contenuti

20 30/04/2014Corso di Informatica20/19 Accesso alle pagine web Le pagine di un sito web sono accessibili tramite una radice comune (detta nome di dominio", per esempio "www.google.it"), seguita da una serie opzionale di "sotto cartelle" e dal nome della pagina. Il nome completo di ogni pagina è detto "indirizzo web" o, più tecnicamente, URI (o URL). Per esempio, nell'indirizzo è la radice, o nome di dominio Consortium/Offices/ sono le sottocartelle, separate dal simbolo "/" role.html è il nome della pagina Lhome page di un sito è la prima pagina che si ottiene digitando il solo nome di dominio.

21 30/04/2014Corso di Informatica21/19 Come creare un sito web Usufruire dei moltissimi servizi gratuiti su internet GOOGLE SITES WEEBLY BLOGGER ALTERVISTA.ORG NETSONS Vantaggio Creare pagine web con pochi clic, senza installare nulla nel proprio computer e senza conoscere nessun linguaggio di programmazione. Svantaggio Forniscono un nome di dominio di terzo livello Ovvero, del tipo "miosito.sitospite.it"

22 30/04/2014Corso di Informatica22/19 Come creare un sito web Svantaggio Forniscono un nome di dominio di terzo livello Ovvero, del tipo "miosito.sitospite.it –Ad esempio, se scegli come nome del sito informatica", su uno spazio gratuito, l'indirizzo del sito sarà: informatica.altervista.org, oppure web.tiscali.it/informatica, oppure sites.google.com/site/informatica, oppure informatica.weebly.com oppure informatica.blogspot.com, e così via. leggere bene le clausole per capire i limiti della pubblicazione Ad esempio molti servizi gratuiti chiedono che venga usato lo spazio messo a disposizione, per fini personali e non aziendali o commerciali

23 30/04/2014Corso di Informatica23/19 Come creare un sito web Per ottenere un dominio di secondo livello, del tipo pcdazero.it o cocacola.com, occorre acquistarlo. Quanto costa un dominio? Pochissimo! Circa 10 euro all'anno. Acquistare solo il nome del dominio non basta per creare un sito. Occorre uno spazio dove ospitarlo (servizio di Hosting). Es: Netsons Cosa me ne faccio di un dominio senza spazio ? E possibile registrare solo il nome del dominio affinchè non venga registrato da qualcun altro. Successivamente dopo 1 mese, 1 anno o più, potrai acquistare lo spazio. Si potrebbe anche non acquistare lo spazio ed ospitare il sito direttamente sul proprio computer di casa o ufficio. Ma la cosa diventerebbe troppo complicata da gestire.

24 30/04/2014Corso di Informatica24/19 Come creare un sito web Si può scegliere di: Creare direttamente online le tue pagine web. puoi creare direttamente online le tue pagine web usando un semplice Editor HTML potrai usufruire di un potente strumento, che ti permette con pochi clic di installare un CMS Creare e salvare le tue pagine web sul tuo PC ed in seguito caricarle sul sito online. Puoi creare un intero sito web dal tuo PC usufruendo di programmi che non richiedono conoscenze di programmazione –FrontPage, Dreamweaver Impari a conoscere i linguaggi di programmazione (HTML, CSS, PHP, etc.) per creare "mattone su mattone", il tuo sito web

25 30/04/2014Corso di Informatica25/19 CMS CMS è un acronimo, e sta per "Content management system", ovvero "Sistema di gestione dei contenuti". è una categoria di software che serve a organizzare e facilitare la creazione collaborativa di siti Internet. Installando un CMS sul tuo spazio web, potrai creare pagine web, direttamente online. È formato da unapplicazione e da un database Un CMS non richiede la conoscenza di linguaggi di programmazione, ed inoltre offre la possibilità di creare un sito web altamente professionale e graficamente eccellente. Esempi: Joomla, Magento, WordPress (per i blog), ecc…


Scaricare ppt "30/04/2014Corso di Informatica1/19 Progettazione di un sito Web Docente Ing. Maria Mirto Ing. Passante Marco."

Presentazioni simili


Annunci Google