6. Introduzione al web

Edizione 2011-12

Università degli Studi di Milano BicoccaDipartimento di Informatica, Sistemistica e Comunicazione

Corso di Strumenti e applicazioni del Web

6. Introduzione al WebRoberto Polillo

Riassunto lezione precedente

Il Web non è Internet Internet è una rete di reti Il protocollo TCP/IP suddivide il data stream in

pacchetti che seguono strade diverse I computer sono individuati da un indirizzo IP Il DNS associa indirizzi IP a nomi mnemonici

strutturati attraverso server distribuiti XML è un metalinguaggio per definire la struttura

dei messaggi fra sistemi diversi

R.Polillo - Ottobre 2011

3

ICANN

Internet Corporation for Assigned Names and Numbers: http://www.icann.org/

Organizzazione non-profit che gestisce lo spazio dei nomi di Internet: indirizzi IP, nomi dei protocolli, top-level domains

Dal 2012 sarà possibile definire nuovi top-level domainshttp://www.voanews.com/english/news/science-technology/New-Internet-Name-Rule-Opens-Door-to-Huge-Changes-124180874.html


4

LINK

NODO

Ipertesto

stack

card

area sensibile(bottone invisibile)

script

clic

Ipertesti off-line: Hypercard (1987)

Hypercard: esempi

http://www.youtube.com/watch?v=mlzBe5dV5e4


7

Che cos’è il Web

Un sistema di tecnologie correlate, evolutesi con continuità a partire dai primi anni ’90:


8

Concetto di ipertesto (es.Hypercard, 1987)

Protocolli internet:- TCP/IP (primi anni 70) - DNS (primi anni 80)

HTTPHTMLURIBROWSER(da1990-91)

+ WWW

=

Il World Wide Web9

Tim Berners-Lee (1995)

"I just had to take the hypertext idea and connect it to the TCP Protocol and Domain Name System ideas and – Ta-da! – the World Wide Web!”


Il world wide web

Una particolare applicazione di internet L’idea base:

archiviare pagine di ipertesto su computer in Internet, permettendo di linkarle fra loro, (indipendendentemente

dalla loro collocazione) e permettendone l’accesso da qualunque computer in

Internet specificandone soltanto un nome simbolico, detto URL

(Uniform Resource Locator)


10

Il world wide web

INTERNET

Pagina (file) Link


11

Il protocollo HTTP

“HyperText Transfer Protocol”: le regole che governano il trasferimento di pagine web dal computer che le archivia (“server”) al computer che le richiede (“client”)


12

Il world wide web: sintesi

Internet

Client

Serverweb server

File (HTML)

browser

il protocollo: HTTP

Get(URL)

Put


13

Naming: URI, URL, URN14

URI Uniform Resource Identifier

URN Uniform Resource Name

Specifica il nome della risorsa

Esempio:(International Standard Book Number)


URL Uniform Resource Locator

Specifica l'indirizzo della risorsa

Struttura di un file system16

Directory (folder)

Root /

A B

Cx y

z y

x

/B/C/y


HTTP: Privacy

Internet

Client

Serverweb server

File (HTML)

browser

il protocollo: HTTP

Get(URL)

Put


17

Info inviate dal browser al server:•Indirizzo IP•Referrer•Browser name•Screen resolution•OS•…

Log file Cookies

Il problema della varietà dei device di accesso

Client 1

Server

File (HTML)


18

browser 1

Internet

browser 2

Client 2Client 3

browser 3

Esempio: screen resolution


19

http://gs.statcounter.com/#resolution-ww-quarterly-200901-201104 (embeddable widget)

Il linguaggio HTML

→ distinguere contenuto, struttura logica e modalità di presentazione delle pagine

ogni pagina contiene, oltre al suo contenuto informativo, anche “meta-informazioni” che specificano struttura e presentazione

Queste sono scritte in un linguaggio denominato “HyperText Markup Language” (HTML) (e sue evoluzioni)

La presentazione è gestita localmente, sulla base delle caratteristiche del client


20

Esempio


21

1.Titolo2. 1.1 Sottotitolo Lorem ipsum dolor sit

amet, consectetuer adipiscing

Nonummy nibh euismod

tincidunt ut laoreet dolore magna aliquam erat volutpat.

1.2 Sottotitolo Ut wisi enim ad minim

veniam, quis nostrud exerci tation ullamcorper suscipit

Struttura

Heading 1

Heading 2

paragrafo

Verdana, bold, 24

Verdana, bold, 18

Verdana, corsivo, 12

Presentazione

HTML: esempio


22

HTML: immagini


23

HTML: link


24

Testo attivo

Immagine attiva

Bottone Tab

I link possono assumere diverse forme


Scripts (client side)


26

Script eseguito dal

browser

Scripts (server side)


27

Script eseguito dal

server

<html><body>

<?php echo "ciao"?>

</body></html>

<html><body>

ciao

</body></html>

ciao

Widgets


28

Widget embedding


29

<html><body>

embed code

</body></html>

Embedding: esempio


30

<iframe width="560" height="315" src="http://www.youtube.com/embed/qrO4YZeyl0I" frameborder="0" allowfullscreen></iframe>

In sintesi…


31

link

CLIENT

Virtualizzazione dei servizi

INTERNET


32

HTML e CSS: evoluzione


33

http://www.jasonspeaking.com/index.php/2010/04/the-evolution-of-html-css/

W3C: World Wide Web Consortium

Fondato nel 1994 da Tim Berners-Lee "The W3C mission is to lead the World Wide Web to its full

potential by developing protocols and guidelines that ensure the long-term growth of the Web"

Emette delle Recommendations, che sono considerate gli standard del Web

Guardate http://www.w3.org


34

User

Site Access Provider

User Access Provider

Web Server

Internet

Prestazioni

Banda verso UAP

Caratteristiche dell’UAP

Congestione della rete

Caratteristiche del SAP

Banda verso SAP

Caratteristiche del server

Caratteristiche del file


35

Quanta banda oggi?

Da uno studio recente dei downloads (2010): Media worldwide: 580 kbps Media USA: 616 Kbps Media Italia: 336 Kbps Best : South Corea: 2020 Kbps Worst : Congo: 13 Kbps

http://www.pandonetworks.com/Pando-Networks-Releases-Global-Internet-Speed-Study


36

Digital divide (banda)

http://chartsbin.com/view/2484 (widget embeddable)R.Polillo - Ottobre 2011

37

Lavoro individuale

Incominciate a scrivere il wikibook Guardate le pagine dell'anno scorso (erano

individuali), in http://wikicorso.wiki-site.com/index.php/Learning_journals_2010


38

Education

6. Introduzione al web