La presentazione è in caricamento. Aspetta per favore

La presentazione è in caricamento. Aspetta per favore

Sviluppo servizi su rete, banche datiCorso di formazione2002 1 Strumenti via WEB per la gestione dinamica dei siti.

Presentazioni simili


Presentazione sul tema: "Sviluppo servizi su rete, banche datiCorso di formazione2002 1 Strumenti via WEB per la gestione dinamica dei siti."— Transcript della presentazione:

1 Sviluppo servizi su rete, banche datiCorso di formazione Strumenti via WEB per la gestione dinamica dei siti

2 Sviluppo servizi su rete, banche datiCorso di formazione La direzione scelta Esigenze espresse dalla Provincia di Torino: 1) Utilizzare Internet come canale strategico di comunicazione e di interazione con il cittadino - utente 2) Gestire in modo diretto i contenuti del sito, delegando ad altri la gestione del supporto informatico (compresa la formazione tecnica delle redazioni)

3 Sviluppo servizi su rete, banche datiCorso di formazione Contenuti: informazioni relative alla materia specifica Redazione: gruppo di esperti di dominio che si occupano della gestione del sito, attraverso un meccanismo di flusso di pubblicazione delle pagine Sito gestibile autonomamente: possibilità di pubblicare direttamente contenuti sul sito della Provincia, nelle sezioni di propria competenza Strumento di gestione dinamica di un sito: ArsDigita Community System di ArsDigita Strumenti di collaborazione: strumenti che assicurano un contatto immediato tra PA e cittadino (Forum, NewsLetter, News, ecc.) Dinamicizzazione: realizzazione del sito con uno strumento che consente la gestione dinamica dei contenuti da parte di una redazione esperta di dominio Glossario

4 Sviluppo servizi su rete, banche datiCorso di formazione Scopi del corso Formazione per luso di: strumenti via WEB per la gestione dinamica dei siti Conoscenze base del linguaggio HTML: autonomia nella redazione di contenuti Nozioni elementari di Internet: funzionamento siti Internet utilizzo strumenti via WEB Fornire gli strumenti per rendere le redazioni del sito indipendenti nella gestione dei contenuti Conoscere e imparare a usare: il CMS (Content Management System) gli altri strumenti di collaborazione Cosè ACS

5 Sviluppo servizi su rete, banche datiCorso di formazione Organizzazione del corso èLunedì mattina: progettazione e gestione siti Internet èLunedì pomeriggio: HTML, teoria èMartedì: HTML, teoria ed esercitazioni pratiche èGiovedì mattina: ACS, CMS e gli strumenti di collaborazione èGiovedì pomeriggio: presentazione manuali èVenerdì: Ulterioni esercitazioni con il CMS

6 Sviluppo servizi su rete, banche datiCorso di formazione Lunedì mattina: AGENDA Cosa vuol dire essere in rete Struttura generale di una rete Browser, HTML, URL ….. Chi sono costoro? I siti: pagine statiche e dinamiche Accessibilità e usabilità

7 Sviluppo servizi su rete, banche datiCorso di formazione Cosa vuol dire essere in rete Sistema che permette la comunicazione fra diverse componenti. Fra tali componenti ci sono: Client Server Data base Definizione semplice di rete Il collegamento fra le diverse componenti può avvenire via: Modem Linea ISDN (collegamento digitale, migliori prestazioni) Linea ADSL (collegamento a fibre ottiche)

8 Sviluppo servizi su rete, banche datiCorso di formazione Cosa vuol dire essere in rete Client Il client Componente di una rete che usufruisce dei servizi messi a disposizione dagli altri componenti della rete

9 Sviluppo servizi su rete, banche datiCorso di formazione Cosa vuol dire essere in rete Possono esserci: > file server > data server -> Server che ospita i Data Base > application server -> Server che ospita le applicazioni > printer server Il server Componente di una rete che mette a disposizione dati, servizi, applicazioni...

10 Sviluppo servizi su rete, banche datiCorso di formazione Cosa vuol dire essere in rete Nuovi strumenti Compatibilità con ORACLE Il Data Base (o DB) Sistema per immagazzinare dati: > Dati semplici (numeri, parole..) > File interi DB utilizzato nel sistema informativo della Provincia di Torino: ORACLE

11 Sviluppo servizi su rete, banche datiCorso di formazione Struttura generale di una rete: Internet - LAN e WWW Internet e' il nome con cui si designa un grande insieme di reti di calcolatori collegate fra loro. Cellula fondamentale e' la LAN (Local Area Network) che ha le dimensioni di un edificio o poco di piu' L'insieme di pagine HTML, immagini, suoni, filmati (iperoggetti) collegati fra di loro costituisce il World Wide Web (WWW). Un iperoggetto e' un documento che al suo interno contiene i rimandi verso altri iperoggetti (link).

12 Sviluppo servizi su rete, banche datiCorso di formazione Struttura generale di una rete: Reti locali (LAN) WAN Client Server Printer Server Printer Router

13 Sviluppo servizi su rete, banche datiCorso di formazione Struttura generale di una rete Rete esterna/Rete aziendale Firewall: protezione della rete locale dal resto del mondo In generale i client interni alla rete locale possono accedere ad un numero di servizi maggiore rispetto ai client sulla rete esterna Es: Internet/Intranet

14 Sviluppo servizi su rete, banche datiCorso di formazione Protocollo = Insieme di regole per comunicare Struttura generale di una rete Come si comunica? I protocolli Protocollo HTTP E il protocollo di comunicazione utilizzato per trasferire sulla rete gli ipertesti. FTP (File Transfer Process) E il protocollo di comunicazione studiato per il trasferimento di file fra due computer collegati alla rete.

15 Sviluppo servizi su rete, banche datiCorso di formazione Il Browser Puntare ad oggetti Internet: E in grado di accedere ad un indirizzo internet Puntare ad oggetti Internet: E in grado di accedere ad un indirizzo internet Formattare e visualizzare i dati: Interpreta i documenti Web redatti in HTML Unisce eventuali file separati (immagini, alcuni Javascript, applet Java…) Formattare e visualizzare i dati: Interpreta i documenti Web redatti in HTML Unisce eventuali file separati (immagini, alcuni Javascript, applet Java…) Browser, HTML, URL ….. Chi sono costoro? Il browser è il software che permette la navigazione in Internet. Svolge due funzioni principali:

16 Sviluppo servizi su rete, banche datiCorso di formazione Il browser può permettere: la navigazione linvio e la ricezione della posta elettronica lo scaricamento (download) di file e programmi le teleconferenze lintegrazione con software esterni il supporto di plug-in leditor visuale codice HTML I Browser I browser più diffusi sono: Internet Explorer Netscape I browser più diffusi sono: Internet Explorer Netscape Applicazione che amplia le funzionalità del browser stesso Browser, HTML, URL ….. Chi sono costoro?

17 Sviluppo servizi su rete, banche datiCorso di formazione I Browser Explorer Attualmente il più diffuso al mondo Netscape Browser, HTML, URL ….. Chi sono costoro?

18 Sviluppo servizi su rete, banche datiCorso di formazione I Browser ATTENZIONE !!!!! Ci possono essere piccole differenze nellinterpretazione dellHTML da parte di diversi browser E quindi opportuno verificare la corretta visualizzazione delle pagine WEB create da parte dei browser più diffusi Browser, HTML, URL ….. Chi sono costoro?

19 Sviluppo servizi su rete, banche datiCorso di formazione E costituito da che delimitano il tipo di informazione HTML HTML - HyperText Markup Language - è un linguaggio per creare documenti per il Web HTML non è un linguaggio di programmazione HTML descrive tutti gli elementi presenti in un ipertesto Browser, HTML, URL ….. Chi sono costoro?

20 Sviluppo servizi su rete, banche datiCorso di formazione Alcuni esempi di TAG : In generale: Informazioni HTML Formattazione: paragrafi, tabelle, colori, font Inserimento di: link, immagini (caratteristiche del documento) Titolo della pagina Contenuto del file html Browser, HTML, URL ….. Chi sono costoro?

21 Sviluppo servizi su rete, banche datiCorso di formazione Esempio di pagina HTML: Link Tabella Colonna 2 Riga 2 Riga 2 Colonna 2 Browser, HTML, URL ….. Chi sono costoro?

22 Sviluppo servizi su rete, banche datiCorso di formazione URL Uniform Resurce Locator E lindirizzo di una specifica pagina Web Esempio: Browser, HTML, URL ….. Chi sono costoro? Il prefisso http: indica il tipo di protocollo // Indirizzo Internet

23 Sviluppo servizi su rete, banche datiCorso di formazione I siti: pagine statiche e dinamiche Cosa vuol dire pagina statica ? Collegandosi ad una certa URL, viene restituito sempre lo stesso file HTML Linformazione HTML è fissa Client Server URL del Server: richiesta di un file Viene trovato il file HTML richiesto

24 Sviluppo servizi su rete, banche datiCorso di formazione I siti: pagine statiche e dinamiche Come viene generata una pagina dinamica ? Nel server viene attivato un programma che elabora i dati e crea la pagina HTML Client Server Attivazione programma URL del Server: richiamato file di programma Creazione dinamica della pagina HTML Restituzione pagina Web dinamica

25 Sviluppo servizi su rete, banche datiCorso di formazione I siti: pagine statiche e dinamiche CGI (Common Gateway Interface) programmi per generare la pagina HTML dinamica, componendo le informazioni elaborate Compatibilità con sistemi UNIX o LINUX (scelti dalla Provincia di Torino) ASP (Active Server Pages) PHP (Php Hypertext Preprocessor) Soluzioni tecniche per generare pagine dinamiche:

26 Sviluppo servizi su rete, banche datiCorso di formazione I siti: pagine statiche e dinamiche Non confondere le pagine dinamiche con gli strumenti dinamici per la gestione del sito!! Redazione della pagina HTML semplificata: Template predefiniti da associare, Contenuto da scrivere (in HTML) Versioning Publishing Creazione istantanea e automatica della pagina HTML tramite apposito programma Richiesta della pagina

27 Sviluppo servizi su rete, banche datiCorso di formazione I siti: pagine statiche e dinamiche Non confondere le pagine dinamiche con gli strumenti dinamici per la gestione del sito!! Gli strumenti dinamici per la gestione di siti utilizzano pagine dinamiche Non è vero il contrario: ci sono pagine dinamiche non costruite con strumenti dinamici per la gestione dei siti

28 Sviluppo servizi su rete, banche datiCorso di formazione Accessibilità e usabilità Un qualunque sito Web deve essere facilmente accessibile: Tempi di attesa ridotti Compatibilità con diverse versioni di browser Non richiedere continui aggiornamenti software per il corretto funzionamento Nellambito della Pubblica Amministrazione: Il sito Web deve essere accessibile a tutti (anche con problemi fisici o cognitivi): Effetti grafici semplici Facile navigabilità

29 Sviluppo servizi su rete, banche datiCorso di formazione Accessibilità e usabilità Un qualunque sito Web deve essere facilmente usabile: Facile da navigare: Menu semplici Interfacce chiare No pop-up inopportune (pubblicità,...) No bottoni strani, immagini animate, musichette,... Nellambito della Pubblica Amministrazione: Regole imposte dallAIPA sullusabilità dei siti La distribuzione dellinformazione devessere rivolta a tutti

30 Sviluppo servizi su rete, banche datiCorso di formazione Lunedì pomeriggio: HTML, TEORIA Le regole doro per pubblicare su internet Le basi dellHTML; i tag fondamentali I font I paragrafi Le liste I link Le immagini Le tabelle I form I fogli di stile Agenda

31 Sviluppo servizi su rete, banche datiCorso di formazione pianificare il messaggio 2 preferire la semplicità e la chiarezza 3 scegliere la brevità 4 incuriosire la visita 5 agevolare la navigazione 6 riportare le informazioni indispensabili 7 utilizzare materiali esistenti 8 aggiornare continuamente le pagine 9 mantenere le promesse 10 promuovere il proprio sito web Pubblicare su Internet 10 Regole doro

32 Sviluppo servizi su rete, banche datiCorso di formazione HTML HTML - Hypertext Markup Language - è un linguaggio per creare documenti per il Web HTML non è un linguaggio di programmazione HTML descrive la posizione di tutti gli elementi presenti in un documento

33 Sviluppo servizi su rete, banche datiCorso di formazione Il server contiene le pagine web (file scritti in html) e le immagini CSI Piemonte Il browser interpreta le istruzioni html e visualizza la pagina Pagine statiche

34 Sviluppo servizi su rete, banche datiCorso di formazione informazioni Un documento HTML inizia sempre con il tag e termina sempre con il Tag TAG = istruzioni che identificano la posizione e la funzione degli elementi Sintassi del linguaggio HTML Tag Fondamentali

35 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Tag Fondamentali caratteristiche del documento titolo della pagina contenuto del file HTML

36 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Dimensioni dei caratteri Il documento inserito nel Body viene visualizzato secondo le direttive di formattazione Il più grande headers Il più piccolo N.B. Non usare gli elementi per ottenere effetti sul testo. segnalano la presenza di titoli.

37 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Istruzione Font Esempio: testo tipo N.B. E buona norma prevedere almeno due font alternative (una simile per stile, una di default visibile su tutti i sistemi)

38 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML La codifica RGB Ogni colore può essere codificato mediante tre numeri compresi tra 0 e 255 che rappresentano la quantità di ROSSO, VERDE e BLU presenti nel colore stesso Ogni numero compreso tra 0 e 255 deve essere trasformato nella rappresentazione esadecimale (base 16) corrispondente Con questa codifica si possono rappresentare più di 16mila colori diversi

39 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Paragrafi

si può omettere mette a capo il testo centra il testo inserisce una linea di separazione nel testo indica la presenza di citazioni N.B. Non usare BLOCKQUOTE per delimitare il rientro del testo

40 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Liste di elementi inizio di una lista non ordinata determina il tipo di punto primo elemento secondo elemento inizio di una lista ordinata determina il tipo di lista numerata o letterale primo elemento secondo elemento N.B. Non è necessario chiudere

41 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Link serve per ancorare il collegamento alla pagina COLLEGAMENTI ESTERNI La pagina del Csi ALTRI COLLEGAMENTI ESTERNI (altri protocolli) ftp del Progetto Gutenberg area news del Politecnico

42 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Link COLLEGAMENTI INTERNI se fai click qui arrivi qui COLLEGAMENTI DI POSTA ELETTRONICA Gruppo Comunicazione URL indirizzi ASSOLUTI: /prova/index.htm indirizzi RELATIVI:.. /.. / index.htm

43 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Immagini/GIF FORMATO GIF (Grafics Interchange Format) supporta al massimo 256 colori (8bit) prevede linterlacciamento, cioè le immagini vengono visualizzate con successive schermate di definizione è utile per la grafica semplice, con grandi superficie di colore uniforme non è adatto con particolari tipi di compressione grafica

44 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Immagini/JPEG FORMATO JPEG (Joint Photografic Experts Format) lestensione dei file è JPG supporta 16 milioni di colori (24bit) prevede una forte compressione, con perdita di qualità, quindi le dimensioni dei file sono molto piccole è ideale per le immagini fotografiche con sfumature non è adatto per immagini con aree di colore omogeneo

45 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Immagini/Attributi testo

46 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Immagini/Mappa consente di costruire immagini sensibili è necessario avere il file dellimmagine e una specifica della mappatura, cioè lindicazione di quali parti sono attive e quali no per preparare limmagine adatta a questo scopo, è necessario usare particolari programmi, come Mapedit oppure programmi WYSIWYG preparata limmagine, con Mapedit è possibile definire aree rettangolari, poligonali e circolari alle quali associare distinti URL

47 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Immagini/Mappa

48 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Tabella/Struttura inizio tabella inizio nuova riga inizio nuova cella Contenuto della cella fine cella fine riga fine tabella

49 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Tabella/Attributi

...

50 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Tabella/Attributi TD


51 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Tabella/Esempio Uno Due aaaaaaaa bbbbbbbb cccccccc ddddddd

52 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Form Pressione del tasto SUBMIT sul form il Server elabora il contenuto del form il SERVER restituisce loutput allutente

53 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Form/Struttura descrizione

...

54 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Form/Campi TextField TextArea ScrollList DropDownList CheckBox RadioButton Bottone I vari campi di un modulo sono sempre dichiarati allinterno del form come

55 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Form/Comandi definisce un campo di input. Ha un attributo obbligatorio TYPE (indica il tipo di elemento da inserire nel form) TYPE = text TYPE = radio TYPE = checkbox definisce inizio e fine di una serie di opzioni definisce una scelta allinterno di definisce un campo di input con più linee

56 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Form/Tipi di INPUT

57 Sviluppo servizi su rete, banche datiCorso di formazione Sintassi del linguaggio HTML Form/TextArea N.B.: Il Radiobutton, usando lattributo VALUE, permette di escludere le altre opzioni, il Checkbox no.