Basi di dati e sistemi informativi su World Wide Web (WWW) Lucidi di B. Pernici, S. Castano, S. Paraboschi

Introduzione l Sistemi informativi in rete: »Basati su web –Tipologie –Qualita di un sistema informativo basato su Web –Introduzione alla tecnologia Web –Progettazione l Aspetti generali l Metodologia di progettazione l Progettazione della struttura

WORLD WIDE WEB l BREVE STORIA DI WWW l PAGINE IN WWW l ASPETTI TECNICI

DEFINIZIONE DI WWW WORLD WIDE WEB (Web - WWW) Sviluppato presso il CERN (1990, T. Berners-Lee) per permettere a collaboratori presso siti diversi di condividere idee e tutti gli aspetti di un progetto comune »sistema ipermediale molteplici media + interconnessioni + accesso prevalentemente navigazionale » basato su Internet

BREVE STORIA DI WWW l marzo 1989proposta iniziale presso il CERN l maggio 1991general release su macchine centrali del CERN l giugno 1991seminario su WWW al CERN l febbr. 1993NCSA Mosaic l maggio 1994prima conferenza WWW l luglio 1994annuncio creazione W3 Organization l dicembre 1994stimate pagine Web l dicembre a Conferenza WWW (Boston) l maggio a Conferenza WWW (Parigi) l a Conferenza WWW (Los Angeles) - annuale

BREVE STORIA DI WWW l Rapidissima crescita iniziale l Siti registrati aprile aprile maggio (3000 tot) luglio tot l Non si parla piu di registrazione »Cfr: Google indicizza milioni di pagine (2002)

Internet e Web l Internet: federazione di reti che comunicano mediante protocolli della famiglia TCP/IP (Transmission Control Protocol/Internet Protocol) » ciascun nodo (calcolatore) ha un indirizzo numerico (indirizzo IP) unico nella rete mondiale di 32 bit rappresentato come 4 interi separati da punti (es., ). A ciascun calcolatore e associato anche un nome simbolico (es., gauss.inf.uniboh.it) usato nelle applicazioni per fare riferimento allindirizzo. » domain name server (DNS): calcolatore che conosce le corrispondenze tra nomi e indirizzi IP numerici. » si puo fare riferimento a qualunque nodo di cui si conosca lindirizzo numerico direttamente, oppure attraverso un name server.

World Wide Web l Basato sul concetto di ipertesto: documento con struttura non sequenziale, costituito da varie porzioni collegate per favorire la consultazione a seconda delle esigenze (no rigidita di una struttura sequenziale) Prefazione Cap. 1 Cap. 2 Cap. 3 par. 1.1 par. 1.2 par. 2.1 par. 2.2 par. 3.1 par. 3.2

World Wide Web l WWW: ipertesto multimediale che collega documenti di vario genere distribuiti su tutta la rete Internet » Collegamenti tra documenti diversi prediposti da persone diverse in momenti diversi » Legami allinterno di un documento e tra documenti diversi sono analoghi » Documenti non solo testuali ma anche multimediali (ipermedia) » I documenti si trovano in generale su nodi diversi della rete

Testo G Testo X Testo W Nodo A Nodo C Nodo B Documenti su Web Testo Y Immagine Z Testo K Testo U

Uniform Resource Locator (URL) l E una stringa strutturata, ad esempio: l Protocollo: http, ma anche ftp e gopher l Indirizzo della macchina: »simbolico: »numerico (IP): »puo includere il numero di porta (es. :8080) l Path: sequenza di direttori l Nome risorsa: identificativo di un file »se la risorsa e un file html, puo includere un indirizzo interno, es. fraterna.html#curriculum

Integrazione tecnologie l Elaborazione e trasmissione dati l telefonia l TV Internet come elemento di integrazione

Tecnologie dellintegrazione l Reti informatiche: Internet »servizi di rete: HTTP (ipertesti), (messaggi), DNS (name server) l Terminali daccesso (dispositivi) »Personal computer »Personal Digital Assistant (wireless) l Telefono: SMS (messaggi), WAP (ipertesti), telefoni intelligenti l TV: web TV (set top box per collegare apparecchio televisivo a Internet via servizio telefonico) Accesso multicanale

Servizi dellinformazione contenuto distribuzione utenti Catena del valore

contenuto Tempo libero Video on demand Video game Editori Giornali /Aziende Reti commerciali Cataloghi Pubblicità Conversione Compressione Datawarehouse

distribuzione Centro servizi e gestione di gateway Rete di trasporto fibre e ibride

utenti Rete di accesso Didattica, affari e governo Server LAN Set top Residenziale

World Wide Web l Tecnologia basata su: »Un protocollo di rete (Internet – TCP/IP): –HTTP: HyperText Transfer Protocol »Un linguaggio HTML per scrivere i documenti ipertestuali: presentazione + contenuto –Linguaggio di mark up (con TAG)

Gli attori di HTTP Gli attori di HTTP cliente (browser): genera richieste di risorsecliente (browser): genera richieste di risorse (origin) server: depositario della risorsa richiesta(origin) server: depositario della risorsa richiesta

Formato dei documenti l I documenti risiedono sul server come file e vengono inviati al client usando il campo entity-body della risposta l ES: Ipertesto = file ASCII scritto secondo la sintassi HyperText Markup Language (HTML) l Estensioni tipiche del file: *.html *.htm l Il documento puo contenere inserti multimediali (immagini, audio, video) »il programma client carica e visualizza il testo »poi richiede al server i file corrispondenti agli inserti multimediali

Documenti su Web » La creazione di documenti multimediali collegando tra loro documenti diversi si realizza mediante elementi di HTML che si chiamano ancore. » Il riferimento allelemento puntato da unancora e specificato come URL (Uniform Resource Locator): puo essere un elemento locale (e.g., pagina html) oppure una risorsa di un altro nodo della rete – tizio – questancora richiama con il protocollo HTTP il file tiziohome.html della directory utenti/tizio del server tizio /tizio/tiziohome.html

Documenti su Web l Architettura client-server » I documenti contenenti collegamenti ipertestuali sulla rete risiedono sui server » I documenti HTML possono essere visualizzati per mezzo di opportuni clienti chiamati browser Web (presentano testo formattato secondo i comandi HTML; il testo associato alle ancore è visualizzato in maniera enfatizzata e per accedervi occorre eseguire un clic con il mouse).

Il browser HTTP l Applicazione in grado di: »accedere alla rete secondo il protocollo HTTP »richiedere risorse identificate da un URL a un server »interpretare e rendere a video la risposta del server

Il browser HTTP l I diversi prodotti differenziano per: »La versione di HTML trattata »La capacita di trattare estensioni non standard di HTML (ad es. JavaScript, VBscript) »La capacita di eseguire programmi (es. Java)

Il browser HTTP l Le capacita possono essere ampliate con laggiunta di applicazioni esterne (plug-in): »per trattare audio, video, animazioni »per visualizzare interfacce 3D (ed es. VRML) »per eseguire applicazioni gestionali

Il server HTTP l Funzioni base: »accesso alla rete secondo il protocollo HTTP »invio di risorse identificate da un URL a un client »controllo degli accessi »lancio di programmi in risposta a richieste »registrazione degli accessi (logging) l Funzioni avanzate: »monitoraggio e amministrazione »connessione a basi di dati »esecuzione efficiente di applicazioni esterne

Protocollo HTTP l I browser e i server comunicano attraverso il protocollo HTTP (HyperText Transfer Protocol) che realizza lo scambio di informazioni (utilizzando TCP a livello sottostante) nelle seguenti 4 fasi: » apertura della connessione: il browser (client) contatta il server con lindirizzo specificato nella URL verificando correttezza e disponibilità » richiesta: il client invia un messaggio al server HTTP con la richiesta di un servizio, i dettagli delle risorsa ed eventuali parametri; » risposta: il server comunica al client lesito della richiesta e i risultati in caso positivo, preceduti da informazioni sugli stessi » chiusura della connessione: la connessione termina senza che il server tenga memoria alcuna delle operazioni svolte (si dice il protocollo HTTP è stateless, ovvero senza memoria)

Gli attori di HTTP Gli attori di HTTP cliente (browser): genera richieste di risorsecliente (browser): genera richieste di risorse (origin) server: depositario della risorsa richiesta(origin) server: depositario della risorsa richiesta Richiesta connessione connectedRichiesta documento documento

HyperText Markup Language Linguaggio di descrizione di testi secondo lo schema SGML (Standard General Markup Language)Linguaggio di descrizione di testi secondo lo schema SGML (Standard General Markup Language) Marcatura:Marcatura: + marcatura <HTML><Head><Title></Title></Head><Body></Body></HTML> contenuto Home Page di Piero Fraternali Fraternali titolo

IL LINGUAGGIO HTML l HTML: un linguaggio di mark-up l basato su SGML - Standard Generalized Markup Language (standard ISO8879, 1986) l linguaggio logico piu' che fisico l la pagina potra' assumere aspetti diversi su browser diversi l tag, ancore, link

tabelle avanzate, font, allineamento del testo, sub/superscript, testo attorno a immagini la versione originale: comandi di formattazione, liste, riferimenti ipertestuali, immagini level 1 Evoluzione di HTML tabelle, form di inserimento dati, frame, mappe client-side level 2 level 3 cascading style sheets (controllo posizione e oggetti grafici sovrapponibili), simboli matematici level 4

Concetti generali di HTML La marcatura prevede luso di etichette, dette TAGS La marcatura prevede luso di etichette, dette TAGS I tag viaggiano (quasi) sempre in coppia I tag viaggiano (quasi) sempre in coppia testo testo Il significato di un tag puo essere modificato tramite attributi Il significato di un tag puo essere modificato tramite attributi testo testo Es:Es:

Struttura del documento File ASCII, struttura generale: intestazione + corpo File ASCII, struttura generale: intestazione + corpo Intestazione:.. contiene informazioni sul documento: Intestazione:.. contiene informazioni sul documento: titolo.. titolo.. Corpo:.. Corpo:.. contiene il testo del documento e i tag per la resa visivacontiene il testo del documento e i tag per la resa visiva

Formattazione del testo grassetto prova grassetto prova corsivo prova corsivo prova sottolineato prova sottolineato prova Prova prova

Formattazione del testo Dimensioni: prova prova Dimensioni: prova prova Colore RGBColore RGB (rosso): prova (rosso): prova Colore background (bianco): Colore background (bianco):

Titoli titolo 1 Titolo livello 1 titolo 1 Titolo livello 1 titolo 2 Titolo livello 2 titolo 2 Titolo livello 2 titolo 3 Titolo livello 3 titolo 3 Titolo livello 3 Titolo di livello1 Titolo di livello2 Titolo di livello 3

Paragrafi, allineamenti : testo vai a capo paragrafi: testo vai a capo testo vai a capo prova testo formattato: prova prova

Liste uno due uno due uno due NB: per liste numerate si usa si usa

Collegamenti ipertestuali Esempio di collegamento : Visita la pagina di Piero Esempio di collegamento : Visita la pagina di Piero Visita la pagina di Piero

Collegamenti ipertestuali Uso della posta: Scrivi a Piero Fraternali Uso della posta: Scrivi a Piero Fraternali Scrivi a Piero Fraternali

Immagini Ecco la mia foto: Ecco la mia foto: Ecco la mia foto Foto di Piero

GIF formato GIF (Graphics Interchange Format) sviluppato da Compuserve per trasferire immagini su linee telefoniche colore 8 bit, compressione da 1,5:1 a 2:1

Immagine+collegamento Clicca sulla foto per scrivermi: Clicca sulla foto per scrivermi: Clicca sulla foto per scrivermi Foto di Piero

Altri comandi break (a capo semplice) <!--inizio commento - fino a -->il testo non viene interpretato inserisce una riga orizzontale continua

Tabelle cella 1 cella 2 cella 3 cella 4

Tabelle cella 1cella 2 cella 3cella 4

Frame l Divisione dello schemo in sottopagine menu destra

Come creare un sito con pagine statiche l Editare le pagine con editor di testo (salvare come testo) o con Netscape composer, Dreamweaver, Frontpage, … l Collegare le pagine tramite ancore (URL relative alla posizione corrente oppure con indirizzi completi) l Caricarle sul file system, in posizione accessibile da un server web (spazio web)

STANDARD l ISO International Organization of Standardization l IETF Internet Engineering Task Force draft -> proposed (con decisioni via ) l de facto standard l WWW - W3C vicino a standard IETF (indirizzi + protocolli + linguaggio markup)

PAGINE IN WWW World Wide Web Consortium (MIT + INRIA; progetto Commissione Europea Webcore)