World Wide Web Cazzaniga Paolo · 2015-11-25 · 2 Il World Wide Web Dott. ... le parti sono in connessione tramitecollegamenti o link seguendo unastruttura reticolare la struttura

Ipertestualità e multimedialitàIl World Wide Web

Fondamenti di InformaticaWorld Wide Web

Cazzaniga Paolo

Dip. di Scienze Umane e [email protected]

Dott. Cazzaniga Paolo Fondamenti di Informatica


Outline

1 Ipertestualità e multimedialitàIpertestualitàMultimedialità

2 Il World Wide Web



IpertestualitàMultimedialità

Outline


2 Il World Wide Web




Ipertesti

Parti di testo collegate tra loro logicamenteI collegamenti permettono all’utente di passare da una parte deltesto all’altraIl documento ha una struttura reticolareL’utente può navigare o effettuare una scansione non lineare deltestoIn generale l’ipertesto è un documento sviluppato conimplementazioni informatiche

L’ipertesto (in una forma che vedremo successivamente) si è diffusoenormemente negli anni ’90 con la nascita del World Wide Web




Ipertesti

Diamo una definizione formale:è un testo digitaleè composto da più parti (blocchi di testo) detti nodi o topicsle parti sono in connessione tramite collegamenti o linkseguendo una struttura reticolarela struttura dell’ipertesto determina la modalità di navigazionela struttura è legata ad un autorela struttura è aperta, nel senso che è possibile passare da unipertesto all’altro




La struttura di un ipertestoI nodi

unità minimali di informazioneautonomicompleti

I collegamenti sono logici o definiti tra tematiche affiniI collegamenti vengono definiti su parole attive o hotwords

Forma di un ipertesto




La struttura di un ipertesto

Gli archi possono essere orientati o non orientatiDefinizione di stella uscente da un nodo e stella entrantePresenza di loop o self-loop




I collegamenti di un ipertesto

Possiamo distinguere i collegamenti (o link) a seconda della lorofunzione:

interni al nodoesterni

collegamenti ad altri nodi dello stesso ipertestocollegamenti ad altri ipertesti

link di navigazionelink di attivazione

Qual è la differenza tra gli ultimi due tipi di collegamento?link procedurali (es. pulsante back del browser)link testuali (collegamenti testuali)link associativi (stretta affinità - collegamenti testuali)link strutturali (collegamenti a sezioni dell’ipertesto)link sitografici (collegamenti ad altri “siti”)


















Qual è la differenza tra gli ultimi due tipi di collegamento?

link procedurali (es. pulsante back del browser)link testuali (collegamenti testuali)link associativi (stretta affinità - collegamenti testuali)link strutturali (collegamenti a sezioni dell’ipertesto)link sitografici (collegamenti ad altri “siti”)













Multimedialità

Documento multimediale: opera in cui è presente una molteplicità dimezzi di comunicazione:

testograficaanimazionesuono

Anche la multisensorialità è richiesta (es. vista e udito)




Multimedialità

Diversi tipi di multimedialitàdebole (questa lezione)intrinseca (fumetti)additiva (il cinema muto con sottotitoli)nativa (il cinema)

Per il web la multimedialità deve avere codifica digitale su supportielettronici:

Multimedialità ristretta (coesistenza di una pluralità di linguaggi)Multimedialità interattiva Cos’è?




Multimedialità

Diversi tipi di multimedialitàdebole (questa lezione)intrinseca (fumetti)additiva (il cinema muto con sottotitoli)nativa (il cinema)

Per il web la multimedialità deve avere codifica digitale su supportielettronici:

Multimedialità ristretta (coesistenza di una pluralità di linguaggi)Multimedialità interattiva Cos’è?



Outline


2 Il World Wide Web



Ipertestualità e Multimedialità

Ipertestualità −→ struttura del documentoMultimedialità −→ contenuto del documento

Dall’incontro tra ipertestualità e multimedialità nasce la ipermedialità

World Wide Web←→ ipermedialitànasce al CERN di Ginevra alla fine degli anni ’80sistema di comunicazione via Internet (tra ricercatori)tecnologia (web) resa pubblica nel 1993

World Wide Web −→ ipertesto multimediale distribuito su Internet
























World Wide Web

Struttura −→ pagine webCollegamenti −→ link unidirezionaliLe pagine sono distribuite su Server web o Server httpL’utente naviga usando client detti browser

Quale dei seguenti NON è un browser?1 Firefox2 Chrome3 Safari4 Thunderbird5 Opera



World Wide Web





World Wide Web





Pagine web

Testo superficiale - ciò che appare all’utentetesto, audio, grafica, immagini, filmatii browser, di default, riconoscono formati standard (es. file jpg,gif, png)per visualizzare altri formati è necessario installare plug-in

Acrobat ReaderQuickTimeFlashPlayer



Pagine web

Organizzazione interna delle pagine:spazio dei contenuti

parti di ipertestooggetti multimedialilink associativi

cornice ipertestualestrutture di navigazione (menu di navigazione primaria esecondaria)strutture di identificazione (intestazione, logo, banner, contatti)

Alcune pagine hanno il link alla homepage nel logo, una sorta difusione delle strutture di navigazione e contatto



Sito web

E’ un insieme di pagine web:autorialità (singolo emittente)argomento di comunicazione (tema)strategia argomentativa (layout)destinatario (chi è l’obiettivo del sito)collocazione fisica (server web)collocazione virtuale (l’indirizzo web)



Sito web

Un po’ di domande...

Cos’è la homepage?Cos’è una splash page?Cos’è un portale?Cos’è un servizio web?

motore di ricerca (Google, Yahoo!, Bing)aste online (eBay)vendita online (Amazon, Chl, Pixmania)intermediazione commerciale (PayPal)posta elettronica (Gmail, Hotmail, Yahoo!)



Sito web

Un po’ di domande...Cos’è la homepage?

Cos’è una splash page?Cos’è un portale?Cos’è un servizio web?




Sito web

Un po’ di domande...Cos’è la homepage?Cos’è una splash page?

Cos’è un portale?Cos’è un servizio web?




Sito web

Un po’ di domande...Cos’è la homepage?Cos’è una splash page?Cos’è un portale?

Cos’è un servizio web?motore di ricerca (Google, Yahoo!, Bing)aste online (eBay)vendita online (Amazon, Chl, Pixmania)intermediazione commerciale (PayPal)posta elettronica (Gmail, Hotmail, Yahoo!)



Sito web

Un po’ di domande...Cos’è la homepage?Cos’è una splash page?Cos’è un portale?Cos’è un servizio web?




Sito web

Un po’ di domande...Cos’è la homepage?Cos’è una splash page?Cos’è un portale?Cos’è un servizio web?




Sito web

Esistono diverse tipologie di sito web:siti aziendali (business to consumer b2c e business to businessb2b)siti istituzionali (enti pubblici, università, ecc.)siti personali (...anche i blog)

e diversi modelli di comunicazione e funzione:informativaconativa (o persuasiva)emotiva (o espressiva)

ogni sito può appartenere a più di una categoria!



Sito web

I siti web possono essere statici o dinamicipagine statiche

HTML

pagine dinamiche (generate on the fly)elementi dinamici (script)CMS (Content Management Systems)file temporanei (cosa sono?)

In teoria, dal nome della pagina si dovrebbe capire se è statica (.htmo html) o dinamica (che comprende una serie di parametri)

Recentemente sono stati introdotti nomi search engine friendly per lepagine dinamiche (per ottimizzare le ricerche)



I protocolli di Internet: HTTP

Esistono tre standard principali per il web (gestiti dal W3C):HTTP (HyperText Transfer Protocol) - protocollo di rete per loscambio di messaggi con architettura client/server

un utente specifica un link o utilizza un motore di ricerca e ilbrowser invia la richiesta ad un serverla richiesta viene gestita tramite DNS e grazie all’infrastruttura direte (TCP/IP)quando il server risponde, il browser formatta la pagina,ricostruisce l’ipertesto (link) e gestisce i contenuti multimedialiil browser può quindi richiedere nuovi dati per visualizzare lapagina o invocare programmi (JavaScript, ecc.)




Ogni volta che viene visitata una pagina il client cede delleinformazioni al serverle informazioni vengono memorizzate in file di log e vengonousate per ottimizzare i processi e a fini statisticile statistiche sui siti web sono gestite anche dal W3C: GlobalWeb Stats (http://www.w3counter.com/globalstats.php)




Esistono altri tipi di comunicazione: tecnologie pushfeed RSS (Really Simple Syndication): l’utente fa unabbonamento a un feed RSS e viene aggiornato senza che nefaccia richiesta esplicita (ad es. le news)podcasting usa la stessa tecnologia dei feed RSS ma permettela diffusione di materiale video e audio

feed RSS e podcasting permettono di aggregare le notizie escaricarle automaticamente sul dispositivo connesso a Internet senzadover visitare tutti i siti web (ad es. Repubblica)

Cosa significa downloading? e streaming?


http://www.repubblica.it/static/servizi/rss/index.html



Esistono altri tipi di comunicazione: tecnologie pushfeed RSS (Really Simple Syndication): l’utente fa unabbonamento a un feed RSS e viene aggiornato senza che nefaccia richiesta esplicita (ad es. le news)podcasting usa la stessa tecnologia dei feed RSS ma permettela diffusione di materiale video e audio

feed RSS e podcasting permettono di aggregare le notizie escaricarle automaticamente sul dispositivo connesso a Internet senzadover visitare tutti i siti web (ad es. Repubblica)

Cosa significa downloading? e streaming?


http://www.repubblica.it/static/servizi/rss/index.html


I protocolli di Internet: HTML

Il linguaggio HTML (HyperText Markup Language) - linguaggio dimarcatura per implementare le pagine web

Prevede l’uso di marche (tags) doppie o singoleformattazione (anche se spesso si usano fogli di stile css)struttura del documentolink ipertestualiaggiunta di oggetti multimediali

<HTML><HEAD>

<TITLE>Esempio 1 </TITLE></HEAD><BODY><CENTER><H1>Questo è scritto in stile Heading 1</H1></CENTER>Scritta non indentata<HR WIDTH="100% " ></BODY>

</HTML>



I protocolli di Internet: HTML

Esistono altre tecnologie, che si affiancano all’HTML, per ovviare lasua povertà espressiva:

JavaScript: linguaggio di scripting per scrivere programmi chevengono interpretati ed eseguiti dal browserJava: linguaggio di programmazione, vengono aggiunti allepagine HTML programmi pre-compilati (applet) che possonoessere eseguiti solo se sul client è presente il Java RuntimeEnvironment (JRE)Flash: gestione dei contenuti multimediali (immagini e filmati)XML: eXtensible Markup Language, è più espressivo di HTML eviene solitamente usato per l’archiviazione di testi su web



I protocolli di Internet: URL

URL (Uniform Resource Locator) è un indicatore univoco di unarisorsa web

protocollo://hostname:porta/pathname?query#frammento

protocollo (http, https, ftp)hostname (indirizzo ip o nome indirizzo)porta (opzionale, se omesso viene impostata la porta di defaultdel protocollo)pathname (percorso all’interno del filesystem del server)query (informazioni parametriche per la generazione di paginedinamiche)frammento (indica un punto preciso della pagina)



I protocolli di Internet: URL

Esempi:https://www.facebook.com/

http://www.ed.ac.uk/home

https://www.youtube.com/watch?v=UfNcVZHB13w

http://www.unibg.it/struttura/struttura.asp?id_notizia=54140&cerca=ing_orari-avvisi

Quando gli indirizzi sono troppo lunghi si possono usare:aliasURL shorteners (http://youtu.be/UfNcVZHB13w)

E si l’indirizzo di una pagina cambia?PURLs (Persistent URLs) assicura che una pagina sia sempreraggiungibile dall’esterno anche se il suo URL cambia





Come si accede ad un sito web?

Direttamente: scrivendo l’indirizzo nel browserIndirettamente: seguendo un link presente in un altro sitoTramite un motore di ricerca: seguendo una delle pagineelencate grazie ad una ricerca

La maggior parte degli accessi avviene tramite motore di ricerca

Come funziona un motore di ricerca?cerca in tutti i siti del webcerca nel web tutti i siti che contengono le parole chiavecerca nell’archivio dei siti webdice automaticamente in quali siti è presente la parola chiave(sfruttando altri programmi)

Nessuna di queste è corretta!






Come funziona un motore di ricerca?

cerca in tutti i siti del webcerca nel web tutti i siti che contengono le parole chiavecerca nell’archivio dei siti webdice automaticamente in quali siti è presente la parola chiave(sfruttando altri programmi)


















I motori di ricerca

Ricercainput: lista di parole chiaveoutput: lista di collegamenti

Data una parola chiave, viene effettuata una ricerca testuale

Ricerca avanzata:operatori logici (AND, OR)uso dei doppi apici (“ ”)linguadatetipo di dato (immagini, video, ecc.)



I motori di ricerca

Come funziona in realtà un motore di ricerca?i risultati riguardano solo parte del webla richiesta di un utente viene tradotta in una query ad undatabase dove sono presenti informazioni di un certo numero dipagine web precedentemente catalogatel’interrogazione viene fatta tramite l’attivazione di un programmadi gestione di un archivioquesta ricerca locale garantisce tempi di risposta molto brevi

La pagina generata da un motore di ricerca è statica o dinamica?



I motori di ricerca

Come funziona in realtà un motore di ricerca?i risultati riguardano solo parte del webla richiesta di un utente viene tradotta in una query ad undatabase dove sono presenti informazioni di un certo numero dipagine web precedentemente catalogatel’interrogazione viene fatta tramite l’attivazione di un programmadi gestione di un archivioquesta ricerca locale garantisce tempi di risposta molto brevi

La pagina generata da un motore di ricerca è statica o dinamica?



I motori di ricerca

L’archivio di ricerca viene costruito tramite spider (o crawler, robot,bot):

sfrutta una lista di indirizzi notiesplora, analizza e indicizza le paginedurante la visita vengono identificati i link esterni per lesuccessive esplorazionila fase di indexing serve a identificare le parole chiave (anchegrazie ai tag HTML)l’attività dello spider è continua, asincrona (rispetto alle richieste)e ciclica

Cos’è la copia cache di una pagina web?



I motori di ricerca

L’archivio di ricerca viene costruito tramite spider (o crawler, robot,bot):

sfrutta una lista di indirizzi notiesplora, analizza e indicizza le paginedurante la visita vengono identificati i link esterni per lesuccessive esplorazionila fase di indexing serve a identificare le parole chiave (anchegrazie ai tag HTML)l’attività dello spider è continua, asincrona (rispetto alle richieste)e ciclica

Cos’è la copia cache di una pagina web?



I motori di ricerca

Il ranking:l’ordinamento dei risultati è fondamentaleordinamento tramite page rank

rilevanzapopolarità

sponsored links (a pagamento)

Riassumendo, un motore di ricerca consiste di:un archivioun programma di interrogazioneun programma di scansione e indicizzazione

La qualità di un motore di ricerca è data dall’ampiezza del suoarchivio, dalla pertinenza dei risultati e dall’ordinamento proposto



I motori di ricerca

Il ranking:l’ordinamento dei risultati è fondamentaleordinamento tramite page rank

rilevanzapopolarità

sponsored links (a pagamento)

Riassumendo, un motore di ricerca consiste di:un archivioun programma di interrogazioneun programma di scansione e indicizzazione

La qualità di un motore di ricerca è data dall’ampiezza del suoarchivio, dalla pertinenza dei risultati e dall’ordinamento proposto



I motori di ricerca specializzati

metamotori: fondono le ricerche effettuate con più motori diricerca generalisti (http://www.metacrawler.com/)plurimotori: esecuzione parallela senza fusione dei risultaticlusterizzatori: cercano di individuare cluster nei risultaticercando concetti significativi per la ricerca(http://search.yippy.com)motori specialistici:

Google Books - http://books.google.it/Google Scholar - http://scholar.google.it/ (citazioni e ipertesti, ilconcetto di stella entrante degli ipertesti)



Il Web 2.0

Riguarda i siti web in cui vengono condivise le informazioni e c’èinterazione tra gli utenti (e i siti che vengono visitati)

FacebookTwitterLinkedIn (endorsement)

Come sono costituiti?Profilo personaleRete di contatti

Altre applicazioni:Google Drive, Instagram, FoursquareBlogapplicazioni Wiki (es. Wikipedia)TripAdvisor, Booking, Amazon, eBay (recommender systems)



Domande

Che cosa indichiamo con il termine “servizi di rete”?1 Programmi che consentono di sfruttare i motori di ricerca per

fornire informazioni alle aziende2 Programmi destinati a supportare le attività di configurazione,

gestione e manutenzione dei server di rete3 Programmi che consentono il reperimento, deposito e scambio di

informazioni per una comunità di utenti di rete4 Programmi per la gestione della posta elettronica5 Programmi per la gestione degli indirizzari delle liste di

discussione



Domande

Che cosa indichiamo con il termine “servizi di rete”?1 Programmi che consentono di sfruttare i motori di ricerca per

fornire informazioni alle aziende2 Programmi destinati a supportare le attività di configurazione,

gestione e manutenzione dei server di rete3 Programmi che consentono il reperimento, deposito e scambio di

informazioni per una comunità di utenti di rete4 Programmi per la gestione della posta elettronica5 Programmi per la gestione degli indirizzari delle liste di

discussione



Domande

In una rete un server:1 riceve servizi, sotto forma di elaborazione o di dati2 fornisce servizi, sotto forma di elaborazione o di dati3 acquisisce autonomamente informazioni, che indicizza per

renderle disponibili ai crawlers4 riceve informazioni dai crawlers, che indicizza per renderle

disponibili ai robots5 coordina i servizi, siano essi di elaborazione o di gestione,

fornitigli dai crawlers



Domande

In una rete un server:1 riceve servizi, sotto forma di elaborazione o di dati2 fornisce servizi, sotto forma di elaborazione o di dati3 acquisisce autonomamente informazioni, che indicizza per

renderle disponibili ai crawlers4 riceve informazioni dai crawlers, che indicizza per renderle

disponibili ai robots5 coordina i servizi, siano essi di elaborazione o di gestione,

fornitigli dai crawlers



Domande

In quale dei seguenti casi abbiamo di solito multimedialità interattiva?1 DVD2 Film sottotitolati3 Fumetti4 Videogames5 Cartoni animati digitali



Domande

In quale dei seguenti casi abbiamo di solito multimedialità interattiva?1 DVD2 Film sottotitolati3 Fumetti4 Videogames5 Cartoni animati digitali



Domande

Quale dei seguenti nomi identifica un motore di ricerca?1 Internet Explorer2 Bing3 Filezilla4 Outlook5 Outlook Express



Domande

Quale dei seguenti nomi identifica un motore di ricerca?1 Internet Explorer2 Bing3 Filezilla4 Outlook5 Outlook Express



Domande

Quale unità di misura può essere impiegata per misurare larisoluzione di uno scanner?

1 bit2 pollice3 pixel4 ppi5 A4



Domande

Quale unità di misura può essere impiegata per misurare larisoluzione di uno scanner?

1 bit2 pollice3 pixel4 ppi5 A4



Domande

Come si misura la dimensione dell’immagine visibile su un video?1 lungo la diagonale2 lungo la base3 lungo l’altezza4 sommando base e altezza5 calcolando la media tra base ed altezza



Domande

Come si misura la dimensione dell’immagine visibile su un video?1 lungo la diagonale2 lungo la base3 lungo l’altezza4 sommando base e altezza5 calcolando la media tra base ed altezza



Domande

La richiesta di una pagina web da parte di un browser può generarela spedizione di materiali da parte di più serventi?

1 Sì2 Solo se l’utente deve spedire/scaricare documenti (testi,

immagini, audio, ...)3 Solo se l’utente deve spedire posta elettronica con allegati4 Solo se il sito è dinamico5 No



Domande

La richiesta di una pagina web da parte di un browser può generarela spedizione di materiali da parte di più serventi?

1 Sì2 Solo se l’utente deve spedire/scaricare documenti (testi,

immagini, audio, ...)3 Solo se l’utente deve spedire posta elettronica con allegati4 Solo se il sito è dinamico5 No



Domande

Quali fra i seguenti tipi di sito esercitano sovente una funzioneconativa?

1 Siti aziendali2 Siti personali3 Siti istituzionali4 Siti dinamici5 Siti statici



Domande

Quali fra i seguenti tipi di sito esercitano sovente una funzioneconativa?

1 Siti aziendali2 Siti personali3 Siti istituzionali4 Siti dinamici5 Siti statici



Domande

Quale fra le seguenti è una marca html corretta?1 (hr)2 {hr}3 [hr]4 #hr#5 <hr>



Domande

Quale fra le seguenti è una marca html corretta?1 (hr)2 {hr}3 [hr]4 #hr#5 <hr>



Domande

Quale fra i seguenti url non è sintatticamente ben formato?1 http://www.marcolazzari.net/?p=Progetti2 http://www.birimbo.birambo.it3 http://bit.ly/WYX8v4 http//www.unibg.it5 http://www.birimbobirambo.it/index.htm#proprioqui



Domande

Quale fra i seguenti url non è sintatticamente ben formato?1 http://www.marcolazzari.net/?p=Progetti2 http://www.birimbo.birambo.it3 http://bit.ly/WYX8v4 http//www.unibg.it5 http://www.birimbobirambo.it/index.htm#proprioqui



Domande

Quale fra le seguenti definizioni meglio descrive il World Wide Web?1 Supporto infrastrutturale di Internet2 Programma di gestione / scambio di informazioni su Internet3 Sistema di comunicazione sincrona distribuito su Internet4 Documento in cui coesistono e convergono più linguaggi e

formati digitali5 Ipertesto multimediale distribuito su Internet



Domande

Quale fra le seguenti definizioni meglio descrive il World Wide Web?1 Supporto infrastrutturale di Internet2 Programma di gestione / scambio di informazioni su Internet3 Sistema di comunicazione sincrona distribuito su Internet4 Documento in cui coesistono e convergono più linguaggi e

formati digitali5 Ipertesto multimediale distribuito su Internet



Domande

Nel Web, quando esiste un link da un nodo a un altro, esiste sempreil puntatore di ritorno?

1 Sì2 No3 Solo nel caso di collegamenti procedurali4 Solo nel caso di collegamenti testuali5 Solo quando i due nodi sono tematicamente affini



Domande

Nel Web, quando esiste un link da un nodo a un altro, esiste sempreil puntatore di ritorno?

1 Sì2 No3 Solo nel caso di collegamenti procedurali4 Solo nel caso di collegamenti testuali5 Solo quando i due nodi sono tematicamente affini



Domande

Per quale motivo i sistemi di salvataggio via Internet di solitocomprimono preliminarmente i materiali che devono trasferire?

1 Per impedire che il calcolatore dell’utente venga infettato da virus2 Per tutelare la sicurezza e privacy dell’utente3 Per ridurre il tempo di trasferimento4 Perché il salvataggio è incrementale5 Perché il salvataggio è periodico



Domande

Per quale motivo i sistemi di salvataggio via Internet di solitocomprimono preliminarmente i materiali che devono trasferire?

1 Per impedire che il calcolatore dell’utente venga infettato da virus2 Per tutelare la sicurezza e privacy dell’utente3 Per ridurre il tempo di trasferimento4 Perché il salvataggio è incrementale5 Perché il salvataggio è periodico


Documents

World Wide Web Cazzaniga Paolo · 2015-11-25 · 2 Il World Wide Web Dott. ... le parti sono in connessione tramitecollegamenti o link seguendo unastruttura reticolare la struttura