Sei sulla pagina 1di 27

Introduzione

dell’evoluzione delle applicazioni



1) LEGACY (fino agli anni ’70): sist. informatici nati in società di intermediazione finanziaria
(es.banche)



Un server con terminali

collegati in maniera diretta





I terminali (calcolatori) sono di tipologia a carattere

2) CLIENT-SERVER (anni ’70-anni ’80): per far funzionare tale sist. occorre installare sul proprio
pc il software “client” à bisogna avere la possibilità di installare “fisicamente” il software



P




Rete aziendale interna

3) WEB APPLICATION (anni ’90): il browser contiene la web application senza la necessità di
installare applicativi nei terminali
BROWSER: google, mozilla


B
HTTP



4) MOBILE APPLICATION (anni 2000): concetto molto simile al CLIENT-SERVER poiché è
necessario installare un software “client” (es. si va sullo store e si scarica l’app. che si
necessita)


HTTP o altro





1
All’evoluzione delle applicazioni corrisponde l’evoluzione della rete:

ARPANET (1970) INTERNET + RETI INTERNET VIA ADSL + RETE
PROPRIETARIE (1980) PROVIDER (1990) CELLULARE (2000)
Per l’università USA e Limitata alle grandi Disponibile nelle case
attività militari USA aziende e per le piccole
(DARPA) (multinazionali) imprese


Reti di calcolatori à insieme di calcolatori, dispositivi di calcolo (es. smartphone, centralina, router,
elettrodomestici...) e altri dispositivi di rete connessi tra loro per mezzo di collegamenti

Grazie a questi collegamenti, i calcolatori Es. cavi o onde elettromagnetiche
possono comunicare tra loro

Principali ragioni per cui queste reti vengono costruite:
1. Scambio di informazioni (es. e-mail, blog, social network...)
2. Condivisione ed accesso remoto alle risorse (es. cloud service)
3. Accesso remoto a servizi software (es. google maps)
4. Elaborazione distribuita (es. calcolo di un bitcoin)
5. Aumento della tolleranza ai guasti (cosiddetta “fault tollerance”) à al fine di offrire un
servizio continuo (“business continuity”)

Tali reti possono essere classificate in base alla loro estensione:
1. PAN (Personal Area Network) à pensate per uso personale e pertanto di piccole dimensioni
2. LAN (Local Area Network) à collegano due o + pc in un’area circoscritta (collegamento
avviene tramite cavo ethernet o wireless)
3. MAN (Metropolitan Area Network) à come le LAN ma ad estensione più ampia à
collegano un’area metropolitana
4. WAN (Wide Area Network) à non hanno limiti di confine (es. Internet)

Sia Internet che internet sono Internet è considerata “rete di reti” ed
caratterizzate da una tecnologia TCP/IP pertanto una rete globale
che permette l’interconnessione fra reti ≠
di elaboratori internet è una qualsiasi rete privata


Com’è fatta Internet fisicamente?
1) NUCLEO à costituito da una serie di
nodi esterni





2) PERIFERIA à punti terminali, cioè
end-point (es. pc, smartphone, switch,
hub...)

2
All’utente finale NON è dato conoscere i processi interni della rete Internet à egli infatti ne ha una
visione logica astratta costituita da processi applicativi residenti su host che comunicano tra loro.

La comunicazione tra host avviene tramite scambio di messaggi: meccanismo detto “a
commutazione di pacchetto” (per un massimo di 1500 byte):
• presso il mittente: i messaggi + grandi vengono spezzati in “blocchetti” + piccoli (max 1500
byte)
• ogni “blocchetto” viene impacchettato
• i “pacchetti” vengono inoltrati verso la destinazione a partire dai collegamenti degli end-
point ai router
• i router reindirizzano i “pacchetti” in base all’indirizzo del destinatario finale presente sull’
“header”
• presso il destinatario: i messaggi vengono estratti dai “pacchetti” e ricostituiti

Può capitare che NON tutti i “pacchetti” arrivino in tempi ottimali e in ordine di invio à infatti tale
rete di comunicazione è definita best effort: NON dà alcuna garanzia di efficienza dei risultati, quindi
NON garantisce che il messaggio arrivi effettivamente al destinatario così come lo si era
preventivamente inviato

Perché il protocollo TCP/IP NON garantisce la QOS = quality of service à ma cerca
di limitare l’errore ritrasmettendo per un certo periodo di tempo i “pacchetti”



PRINCIPALI ELEMENTI FISICI DI INTERNET

1) ROUTER: principale elemento del nucleo di Internet à ogni router ha il compito di
instradare il “pacchetto” alla rete a cui è destinato. Il nucleo della rete è semplice, mentre
la complessità di quest’ultima risiede nella periferia, in quanto vi è una moltitudine
eterogenea di tecnologie connesse


I router creano una rete esterna



2) SWITCH: hanno lo stesso compito dei ROUTER = cioè instradare i “pacchetti” verso la
destinazione à ma creano una rete interna e sono instradatori di secondo livello. Gli
switch possono servire per estendere una determinata LAN interconnettendo i suoi
spezzoni di rete (sono assimilabili a una ciabatta da 16 o 32 porte)

3) END-POINT: possono essere:
a. HOST: work station, pc, server, smartphone, elettrodomestici...
b. “THINGS”

4) HUB: sono dei ripetitori à ritrasmettono ogni singolo bit in ingresso su tutti i collegamenti
in uscita. Nel far ciò, scompone i messaggi in bit = 1/1000 byte à x tale motivo gli HUB
sono più performanti degli SWITCH

3
5) ACCESS POINT: elementi di giunzione fra la parte wireless e la parte cablata in rete
6) RETE TELEFONICA CLASSICA (rete di telefonia fissa, cablata e analogica): NON è parte di
Internet ma viene utilizzata spesso nella connessione tra end-point e Internet

Il modem ha funzione di convertitore:
MODEM
converte il segnale da digitale ad analogico
m
e da analogico a digitale

I modem che vengono venduti ad
oggi hanno funzione di:
• Router
• Switch
• Access point

7) MODEM ADSL (Asymmetric Digital Subscriber Line): consentono l’uso della stessa linea
telefonica sia per le telefonate che peri dati verso Internet
8) SPLITTER: ha il compito di dividere il traffico telefonico dal traffico dati
9) DSLAM (Digital Subscriber Line Access Multiplexer): permette di avere sia connessione
telefonica che connessione Internet




MODEM ADSLM

ADSL


SPLITTER



DSLAM




10) DISPOSITIVI PER LA CONVERSIONE SEGNALE ELETTRICO-OTTICO: x accesso Internet
tramite fibra ottica
11) CONNESSIONI: collegano tra loro i dispositivi:
a. DOPPINI à costituiti da coppie di cavi in rame intrecciati. Utilizzati nella rete
telefonica, l’informazione viene trasmessa tramite segnali elettrici (usati
soprattutto nelle LAN)
b. CAVI COASSIALI à costituiti da 2 mezzi conduttori elettrici. Es. cavo antenna TV.
L’informazione viene trasmessa tramite segnali elettrici
c. FIBRE OTTICHE à l’informazione viene trasmessa per mezzo di segnali luminosi
(molto veloci). Immuni da inferenze elettromagnetiche
d. ONDE ELETTROMAGNETICHE à cosiddette connessioni wireless (sono tipicamente
onde radio con varie distanze di propagazione)
4
INTERNET SERVICE PROVIDER (ISP)
Gli ISP sono organizzazioni, enti, istituzioni o imprese commerciali che forniscono l’accesso Internet
e servizi Internet (es. posta elettronica)
à sono organizzati in livelli:
1) ISP locali = fornivano l’accesso e altri servizi agli utenti finali
2) ISP locali a loro volta si rifornivano da ISP di livello superiore x ottenere l’accesso Internet


Ad oggi NON è più cosi poiché i fornitori di connettività Internet sono i grandi operatori telefonici
(es. canone modem TIM)

Affinché 2 processi software possano comunicare è necessario che rispettino dei protocolli di
comunicazione à cioè un insieme di regole che stabiliscono:
A. Come dev’essere strutturato il messaggio
B. Quali azioni debba compiere il mittente x inviare i messaggi
C. Quali azioni debba compiere il ricevente quando riceve il messaggio


Vi è una moltitudine di protocolli, i quali sono organizzati in una

gerarchia à da cui ne deriva il seguente vantaggio: se si

paragonasse il protocollo di comunicazione ad un servizio, i

protocolli collocati più in alto a livello gerarchico potrebbero definire

i propri “servizi” avvalendosi dei “servizi” definiti dai protocolli

collocati più in bassa gerarchicamente



Ricorrendo al concetto di “gerarchia dei servizi” si ottiene la seguente struttura:

Ogni livello si affida al livello sottostante


SERVIZI CLIENTI

senza “preoccuparsi di quanto verrà in


RECAPITO PACCHI E LETTERE seguito (ai livelli ancora sottostanti)

TRASPORTO MERCI

GESTIONE INFRASTRUTTURE

INTERVENTI FISICI SU INFRASTRUTTURE DI TRASPORTO

5
I cinque livelli della gerarchia dei protocolli sono (DAL BASSO VERSO L’ALTO)

nome indirizzi Livello gerarchico Tipo di protocollo Funzione
URL APPLICATIVO HTTP, SMTP...
PORTE TRASPORTO TCP FAR COMUNICARE
DUE PC END-TO-
END
IP RETE IP INSTRADAMENTO
DEI “PACCHETTI”
MAC COLLEGAMENTO TRASFERIMENTO
DEI FRAME
FISICO

Cioè le componenti fisiche

Router: operano a Switch: operano a Hub: considerati come degli


livello di rete à quindi livello di collegamento switch più semplici, operano
implementano i livelli: à quindi solo a livello fisicoà quindi
• Rete implementano i livelli: implementano solo il livello:
• Link • Link • Fisico
• Fisico • Fisico


N.B: tutti gli elementi di rete che comunicano fra di loro devono implementare il livello fisico à x
comunicare possono farlo:
• tramite mezzo fisico:
o cavo ethernet
o doppino
• tramite onde elettromagnetiche (wi-fi)


















6
1) LIVELLO FISICO:
La comunicazione reale avviene solo a livello fisico à tramite onde luminose o apparecchiature che
riescono a trasmettere questo segnale

2) LIVELLO DI COLLEGAMENTO:
Il servizio principale svolto in questo livello consiste nel trasferimento dei pacchetti (frame)
attraverso un singolo collegamento diretto fra i due nodi

Funzionamento tipico del livello di collegamento:

Header del livello link: parte
che viene letta dallo switch in Datagramma del livello rete
modo da poter instradare il
Implementa tutti i frame nella giusta direzione Implementa tutti i
livelli (1-5) livelli (1-5)

SWITCH (livelli 1-2)

FRAME


H D

Tale funzionamento può essere scomposto in due fasi:
• L’entità a livello collegamento del nodo mittente riceve un datagramma dall’entità a livello
di rete à vi oppone un proprio header incapsulando il datagramma in un frame. Dopodiché
“chiama” i servizi del livello fisico per il trasferimento fisico del frame attraverso la
connessione
• L’entità a livello collegamento del nodo ricevente riceve il frame attraverso il livello fisico
sottostante ed esegue eventuali controlli. Superati i controlli, viene estratto dal frame il
datagramma che verrà inviato all’entità di livello di rete

Nel caso vi siano + nodi connessi tra di loro, l’entità a livello di collegamento specifica in un frame il
destinatario e il mittente dello stesso à diventa necessario che ogni interfaccia di rete di un nodo
(punto fisico di connessione tra un noto e la rete) sia associata a degli indirizzi MAC (Media Access
Control) à i quali identificano univocamente l’interfaccia (poiché l’obiettivo è evitare la
duplicazione)

Non esistono due interfacce di rete con lo stesso indirizzo MAC: un indirizzo
MAC è costituito da una sequenza di valori lunga di solito 48 bit = 6 byte

Sequenza di 48 bit che costituiscono l’header


Lo HUB riceve il FRAME e lo inoltra a tutte le interfacce a A,b,c,d... D
cui è connesso (tranne quella da cui l’ha ricevuto.
L’interfaccia a cui è destinato lo riconosce e lo elabora, le
altre interfacce NON lo riconoscono e NON lo elaborano FRAME

7
Es. Rete Wi-Fi in aula a cui tutti possono accedere: tutti gli smartphone ricevono gli stessi FRAME
che ogni smartphone invia all’altro à ma solo lo smartphone a cui è destinato il messaggio lo
riconosce e pertanto lo elabora, mentre gli altri smartphone NON riconoscendolo NON lo elaborano

3) LIVELLO DI RETE:
All’interno di questo livello è presente il protocollo IP (uno dei principali protocolli di Internet):
• Definisce un servizio di comunicazione di “pacchetti” host-to-host
• Definito protocollo di inter-networking = connessione fra reti di calcolatori
Nell’attuazione di questo protocollo, oltre agli host, hanno run ruolo fondamentale anche i router

Funzionamento di questo protocollo può essere scomposto in 3 fasi:
A. Sull’host mittente: l’entità che realizza IP riceve dall’entità di trasporto il segmento con
l’indicazione di mittente e destinatario. Successivamente incapsula tale segmento in un
datagramma IP il cui header contiente indicazioni su destinatario e mittente. Infine utilizza il
servizio di collegamento per passare il datagramma al router
B. L’entità che realizza IP nel router controlla che il datagramma NON sia in circolazione da
troppo tempo (in caso contrario lo distrugge) à successivamente, se il destinatario
appartiene a una rete direttamente collegata, inoltra il datagramma IP direttamente ad esso,
altrimenti (in caso contrario) inoltra il datagramma ad un router successivo nella speranza
che faccia fare al “pacchetto” un salto (Hop) nella direzione giusta
C. Sull’host destinatario: l’entità che realizza IP estrae il segmento dal datagramma e lo passa
all’entità situata a livello di trasporto

Gli indirizzi IP permettono l’identificazione dei nodi a livello di rete. Normalmente ad ogni PC
corrisponde uno ed un solo indirizzo IP à pertanto l’IP è un protocollo che garantisce univocità

Composto da una sequenza di 32 bit, ed essendo molto
difficile da ricordare si usa la dot notation



"#
IPv4 può specificare quindi 2 1. Si dividono i 32 bit in 4 gruppi da 8
indirizzi IP. Questa limitatezza ha 2. Per ogni blocco si considera il
portato allo sviluppo di IPv6 che è corrispondente numero decimale
composto da 128 bit, quindi 3. Si scrivono i numeri decimali separandoli con
specifica 2$#% indirizzi IP diversi à un punto
nonostante ciò, la sua struttura Es. 11010001100010000100111100100010
risulta semplificata rispetto alla 11010001 10001000 01001111 00100010
versione precedente 209 136 79 34
à 209.136.79.34


Es.
Rete locale della SAA

130.192.103.203

Indirizzo di host

8
La differenza principale con gli indirizzi MAC sta nel fatto che l’indirizzo IP è strutturato al proprio
interno. Infatti la prima parte rappresenta una sottorete, mentre la seconda parte a destra
rappresenta l’interfaccia di rete di un nodo all’interno della sottorete

Come fa il router a sapere dove inoltrare il datagramma?
Il router sceglie una delle sue interfacce basandosi sull’indirizzo IP del destinatario. Il problema
risulta quando il router non è connesso direttamente à in tal caso il router utilizza la propria
“tabella di inoltro” à queste tabelle vengono prodotte dal router grazie all’esecuzione di algoritmi
di routing e vengono continuamente aggiornate à poiché Internet è un sist. dinamico in cui nuove
reti vengono connesse, altre vengono cancellate ecc...

Risultano importanti sia gli indirizzi MAC che gli indirizzi IP poiché:
• Indirizzi MAC à identificano una singola interfaccia di rete indipendentemente dalla rete a
cui è connessa


• Indirizzi IP à permettono di associare ad un’interfaccia di rete un identificativo che dipenda
dalla rete a cui essa è connessa

4) LIVELLO DI TRASPORTO:
Garantisce il recupero dei “pacchetti” persi:
“apertura” che mette in
i. Compito di associare “pacchetti” e applicazioni
contatto su un singolo host
+ un processo applicativo con
ii. Compito di garantire affidabilità il livello di trasporto

Funzionamento del livello di trasporto può esser scomposto in due fasi:
• Sull’host mittente: l’entità che realizza il protocollo di trasporto riceve attraverso il socket
del processo applicativo P1 il messaggio M avente l’indicazione del destinatario P4 e
mittente P1. Eventualmente, spezza M in blocchi + piccoli ed incapsula M o ogni suo blocco
in un segmento di trasporto S (il cui header contiene dati identificativi dei socket di P1 e P2)
• Sull’host destinatario: l’entità che realizza il protocollo di trasporto riceve S, individua il
socket opportuno x recapitare S, lo recapita e, tramite il socket, i dati applicativi raggiungono
il processo applicativo P4. Il socket corretto viene individuato grazie alle informazioni
contenute nel segmento

Il più semplice protocollo a livello di trasporto è UDP (User Datagram Protocol) à associa solo
“pacchetti” e applicazioni senza garantire affidabilità

Mentre il più famoso protocollo a livello di trasporto è TCP (Transmission Control Protocol) à
associa “pacchetti” e applicazioni garantendo affidabilità

5) LIVELLO APPLICATIVO:
due principali modelli architetturali x le applicazioni Internet:
• Client-server
• Peer-to-peer

9
Client-server à prevere l’esistenza sull’host di un processo applicativo server sempre attivo e in
attesa di richieste di processi applicativi client

Peer-to-peer à prevede un rapporto di tipo paritario à a tali processi applicativi NON è richiesto
di essere sempre attivi e pronti a rispondere
Solitamente risiedono sull’host degli utenti finali
e NON su potenti server di calcolo

Tale comunicazione è efficace negli scambi di file
multimediali, infatti un esempio di modello peer-to-
peer sono:
• U-torrent
• Skype
• Emule


Il livello applicativo è il più alto nella gerarchia ed è formato da:
• DNS (Domain Name System): normalmente usa l’UDP come servizio di trasporto dati. Il
compito di questo protocollo è di tradurre l’indirizzo simbolico nel suo corrispettivo indirizzo
IP (poiché è l’unico che la rete, in particolare il router, riconosce)
Essendo Internet un sist. diffuso in tutto il mondo, NON è possibile pensare ad un unico spazio di
nomi host à x questo motivo vi è un approccio gerarchico da parte della rete basato sul concetto
di dominio
Pezzo simbolico dell’indirizzo Internet organizzato in diversi livelli

Se il dominio A è inserito nel dominio B à si dice che A è un sotto-dominio di B
La gerarchia dei singoli livelli parte da destra verso sinistra à dove l’ultima parte dell’indirizzo (es.
.it) è un dominio di primo livello

Possono essere di due tipi:


A. Nazionali: standardizzati (NON si possono modificare) x ogni nazione e hanno max
due lettere (es. Italia = .it, Francia = .fr, USA = .us, Inghilterra = .uk)
B. Transnazionali: legati al tipo di attività che le aziende svolgono
a. Enti educativi = .edu
b. Aziende commerciali = .com
c. Aziende di servizi in rete = .net
d. Organizzazioni non commerciali = .org

• SMPT (Simple Mail Transfer Protocol): consente la comunicazione uno-a-unoo uno-a-molti
utenti Internet attraverso l’invio e la ricezione di messaggi di posta elettronica (e-mail)
Tale protocollo è studiato usando il paradigma client-server ed utilizza TCP come servizio di
trasporto

Un messaggio e-mail è composto da:
o Header = contiente informazioni sul messaggio
Entrambi formati da un testo di caratteri ASCII
o Body = contiene il messaggio vero e proprio

10
Com’è possibile mandare allegati eludendo il limite del protocollo SMTP?
Gli allegati vengono modificati e codificati in caratteri ASCII entrando di fatto nel body della mail à
quando il ricevente apre la mail, alcuni programmi specifici traducono la parte del body inerente
all’allegato convertendolo nel formato richiesto e dando la possibilità di poter visualizzare l’allegato:
ciò è possibile grazie allo standard MIME (Multipropose Internet Mail Extension)

Esempio di un trasferimento e-mail:
1. Soggetto A compone l’e-mail usando un’applicazione come Eudora, Microsoft Outlook,
Mozilla Thunderbird, Libero Mail...
2. L’applicazione invia la mail (prendiamo Outlook come esempio) al server SMTP del mittente
(utilizzando il protocollo SMTP)
3. L’e-mail viene mantenuta nell’areadi spool di Outlook.it
4. Il server SMTP su Outlook.it interroga il DNS x ottenere l’indirizzo IP del server SMTP nel
dominio del destinatario (es. Libero.it)
5. Il server SMTP su Outlook.it stabilisce una connessione TCP/IP con il server SMTP di Libero.it
6. L’e-mail viene trasferita a destinazione
7. Il server SMTP su Libero.it deposita l’e-mail nella mail box del Se qualcosa andasse
destinatario storto, l’e-mail NON viene
8. La connessione TCP/IP viene chiusa eliminata dall’area di
9. Il server SMTP su Outlook.it elimina l’e-mail dalla propria area di spool e il server SMTP su
spool outlook.it continua a
tentare l’invio per 3 giorni
circa à se durante questo
periodo di tempo nessun
tentativo va a buon fine, il
server SMTP notifica il
fallimento al mittente

• POP (Post Office Protocol) e IMAP (Internet Message Protocol): due protocolli utilizzati a
livello applicativo:
o si usa il protocollo POP3 à consente di scaricare le mail in locale (e-mail disponibili
anche quando l’utente NON è connesso in rete) ma vi è una possibile dispersione
delle mail se si usano + device per leggerle
o si usa il protocollo IMAP4 à consente di mantenere i messaggi presso il server
evitando la dispersione delle mail, ma queste sono disponibili solo quando l’utente è
connesso. Permette inoltre di leggere la mail da diversi device

• HTTP (HyperText Transfer Protocol): protocollo + utilzzato ad oggi poiché molto semplice in
quanto si basa su meccanismo richiesta-risposta:

HTTP request


HTTP response
Browser (HTTP client)
“Server web” (HTTP server)

Protocollo richiesta-risposta: il client fa una richiesta al server e quest’ultimo risponde à tali
richieste e risposte viaggiano su “pacchetti” IP con protocollo TCP (che ne garantisce l’affidabilità)

11
Ogni messaggio HTTP è formato da un header (intestazione) e un body (contenuto) à è pertanto
un messaggio testuale

Formato dei messaggi HTTP request:
Metodo URL versione Contiene l’indicazione dell’azione richiesta, sono possibili vari valori,
ma due sono i più frequenti:
• “GET” à esprime richiesta di una risorsa. Con questo valore il
body è vuoto poiché è sufficiente solo l’header
Header

• “POST” à il client fornisce al server anche dei contenuti. Il


suo uso tipico è inviare al server i dati inseriti dall’utente in un
modulo online
Nome campo: valore Specificano il valore per vari parametri
...
Nome campo: valore
Body


Formato messaggi HTTP response:

Versione Versione del protocollo HTTP usato

Codice_Di_Stato Frase Esprime se la richiesta sia stata servita in modo corretto o NON
corretto tramite determinati cod.:
Header

• 1xx à informazione (richiesta ricevuta, elaborazione in


corso)
• 2xx à successo (es. cod. 200 = successo pieno)
• 3xx à reindirizzamento
• 4xx à errore del client (es. cod. 404 = “not fund”)

• 5xx à errore del server (server NON è stato in grado di
soddisfare una richiesta apparentemente valida)
Nome campo: valore Specificano il valore per vari parametri
...
Nome campo: valore
Body Contiene la risorsa inviata. Es. quando il body contiene una
pagina web








12
URL (Uniform Resource Locator): stringhe di testo (parti presenti nella barra di ricerca nella parte
superiore del browser) che identificano delle risorse (es. pagine web, file audio, video, ecc...).
Possono contenere anche degli indirizzi IP

Struttura generale di un URL:


Es. 8040, se la porta NON Percorso che individua la
è specificata si intende risorsa nel sist. di cartelle del
implicitamente la porta 80 server: es.
attività/progetti.html



http://<host>:<porta>/<percorso>?<richiesta>#<frammento>

Es. www.unito.it Query string à serie di info che web
può utilizzare (qualora presenti)



COOKIES
Sono delle informazioni di tipo testuale create dal server e memorizzate dal client. Quando un client
richiede delle info ad un server (es. sito di e-commerce), quest’ultimo crea un cod. identificativo per
quel client (segnando ad esempio i prodotti visualizzati) à questo cod. cookie viene inviato dal
server al client che lo salva nella propria cartella (operazione possibile grazie all’ HTTP response),
quando il client si ricollegherà al server utilizzerà i cookies x farsi riconoscere e ricominciare la
sessione con alcun dati salvati (es. compilazione automatica di alcuni dati x form). Per poter
utilizzare i cookies il client deve accettare l’invio ed inoltre possono essere cancellati dall’utente in
ogni momento

Due categorie di cookies:
• cookies di prime parti à provengono direttamente dal sito che si sta visitando, sono i
domain quando si accede tramite i browser (siti salvati nella barra degli indirizzi)
• cookies di terze parti à tracciano l’utente a fini pubblicitari tenendo conto della cronologia
di navigazione. Infatti, nel caso in cui selezionassimo da una pagina un determinato
prodotto, esso ci ricomparirà su un altro sito sotto forma di banner pubblicitario

È una serie di richieste HTTP correlate logicamente ed effettuate da uno
stesso client in un arco di tempo determinato

All’inizio della sessione il web server crea un identificatore di sessione univoco (creato x ogni
client che si connette al sito). La fine di una sessione avviene quando:
• La sessione scade (timeout)
• Quando avviene un logout volontario da parte del client (es. logout da un sito)
• Quando il browser viene chiuso

13
Come fa un server a tenere la “memoria” della sessione in corso?
La “memoria” viene mantenuta attraverso due meccanismi:
i. Cookies --> all’apertura della sessione viene creato un id cookie e poi distrutto alla chiusura
ii. URL rewriting


Proxy server
I browser NON contattano direttamente il server principale della pagina richiesta à contattano
dei server intermediari che contengono già una serie di risposte pronte da inviare al client: i proxy
server. Nel caso in cui questi ultimi NON contengano la richiesta del client, allora contatteranno il
server principale x chiederle l’informazione e successivamente la memorizzeranno (caching) in
modo da essere immediatamente disponibile per una successiva ricerca.
Ne consegue che l’impiego dei proxy server renda il processo di acquisizione dell’inofrmazione più
snello e veloce, nonché un traffico Internet minore

Hp1: proxy server dispone della risorsa richiesta:


HTTP request


HTTP response
Browser (HTTP client)
Proxy server


Hp2: proxy server NON dispone della risorsa richiesta:


HTTP request1 HTTP request2


HTTP response2 HTTP response1
Browser (HTTP client)
Proxy server “Server ultimo”

• È un’interfaccia che collega l’utente al web


• Esibisce le funzionalità di HTTP client
• Gestisce le risorse ricevute dal server (es. interpreta i linguaggi coe HTML e JPEG)
• Contiene dei software plugin che permettono la lettura dei dati del web
• Effettua il caching = memorizza i percorsi e le risorse caricate x rendere la comunicazione futura
+ veloce

“pezzi” di software che vengono aggiunti al browser x la
visualizzazione di contenuti video e riproduzione di determinati
formati audio

14
Step per la navigazione sul web
1. Browser analizza l’URL
2. Server DNS trova l’indirizzo IP corrispondente
3. Viene effettuata una connessione TCP al server dell’IP ricevuto
4. Viene inviata una richiesta per la risorsa dell’URL
5. Server risponde mandando una richiesta
6. Browser interpreta la risorsa ricevuta visualizzandola


Le pagine web
1) Pagine statiche: quando l’URL corrisponde ad una pagina specifica, creata e salvata su un
file del server à queste pagine NON vengono calcolate al momento ma create a priori
(scritte a mano in HTML)
2) Pagine dinamiche: quando l’URL fa riferimento ad una pagina il cui contenuto viene
generato totalmente o parzialmente al momento della richiesta à vengono calcolate al
momento sulla base delle indicazioni fornite dall’utente (scritte in ASP, PHP o JSP). Queste
pagine possono inoltre reagire agli eventi prodotti dal client (elemento di interattività)



Tecnologie client-side: permettono l’elaborazione e l’esecuzione dei programmi da parte del
client (attraverso il browser)
elaborazione

visualizzazione

HTTP response
Web server
server client
HTTP request


Tecnologie server-side: l’elaborazione dei programmi avviene sul server

elaborazione
visualizzazione
HTTP response
Web server client
server HTTP request








15
Linguaggi di mark-up (HTLM, XML...): servono a descrivere dei documenti strutturati espressi
tramite tag e attributi
Questi linguaggi permettono di annotare dei documenti (spesso testuali), cioè etichettare dei
documenti specificando quali siano le meta-informazioni ( = contenuto vero e proprio del
documento). Quindi questi linguaggi servono per avere dei contenuti etichettati opportunamente,
ma permettono solo di dare informazioni su un testo
Es. TAG: <nomeTag>...</nomeTag>
Es. ATTRIBUTI: ‘nomeAttributo’ = “valoreAttributo”

1) Uno dei linguaggi di mark-up più famosi è HTML (HyperText Markup Language) à produce
pagine web statiche sfruttando una tecnologia client-side, permettendo di etichettare file,
canzoni, video...
Uno dei principali limiti di questo linguaggio: in una pagina HTML è possibile mescolare contenuto
e aspetto à mentre tali connotati DEVONO essere mantenuti il più possibile separati


Per ovviare a questo limite del linguaggio HTML, viene utilizzato il CSS (Cascading Style Sheets):
sono fogli di stile che contengono essenzialmente delle informazioni di tipo grafico (es. colore, stile
di scrittura, layout grafico...). tramite i CSS si creano dei doc separati dalla pagina web che
contengono delle info relative all’aspetto della pagina à ciò permette di risparmiare tempo e di
avere una maggiore praticità nella gestione del sito (NON si modifica l’aspetto grafico pagina per
pagina à ma si modifica solo più il CSS)
Si possono inoltre associare più file .css alternativi ad uno stesso contenuto al fine di avere più
opzioni x la presentazione dello stesso in base al device utilizzato

Principali vantaggi dei CSS:
• Risparmio di tempo nella costruzione del sito
• Facilitazione nel mantenimento del sito
• Riduzione del consumo di banda
• Possibilità di realizzare + presentazioni di uno stesso contenuto
• Facilitazione nell’uso di tecnologie complementari

Limiti dei CSS:
• NON tutti i browser supportano i CSS allo stesso modo


HTML5 à specifica di HTML che introduce nuove funzionalità (es. supporto alla multimedialità:
include in una pagina sia elementi audio che elem. video senza uso di plugin esterni

Permette di gestire delle componenti interattive semplicemente con dei tag HTML


Ogni elemento del linguaggio HTML5 si può integrare con Javascript à estendendo il suo utilizzo
alle pagine dinamiche oltre che statiche



16
Aspetti innovativi di HTML5:
A. Evoluzione del modello di mark-up:
a. sancisce definitivamente la fine di una serie di tag e attributi mantenendo però la
retrocompatibilità
b. introduce nuovi tag:
i. Nav à per raggruppare gli elementi di navigazione
ii. Article à per definire sezioni di contenuto autonome
iii. Section à per suddividere la pagina in sezioni generiche
iv. Aside à per definire o raggruppare info correlate ai contenuti principali
v. Footer à per inserire info sulla sezione che lo contiene
vi. Time à per definire date/ore
vii. Mark à per evidenziare sequenze di parole importanti nella pagina
viii. Meter à per definire misure scalari
ix. Progress à per rappresentare lo stato di avanzamento di un compito
x. Hgroup à per raggruppare elementi introduttivi
B. Estensione delle funzionalità JavaScript:
i. funzione drag and drop: trascinare dal desktop un file e caricarlo
automaticamente nel contenuto della mail senza dover passare tramite
l’opzione attachment
ii. funzionalità per l’offline: consente di creare applicazioni web funzionanti
anche offline
iii. funzionalità di geolocalizzazione


2) Nei linguaggi di mark-up gioca un ruolo fondamentale il complesso di tecnologie XML
(eXtensible Markup Language): queste tecnologie consentono la definizione di una famiglia
di linguaggi di mark-up nonché la scrittura, la lettura e la manipolazione via software di doc
specificati in linguaggi XML

Tramite questi linguaggi si possono costruire doc strutturati il cui contenuto è arricchito
con meta-informazioni espresse x mezzo di tag, attributi e valori per gli attributi

Ogni linguaggio XML deve rispettare determinate regole:
• ogni doc DEVE avere una struttura gerarchica
• i tag DEVONO esserr bilanciati à ogni tag aperto dev’essere poi chiuso
• l’apertura e la chiusura dei tag DEVE seguire le regole analoghe alle regole per le parentesi
algebriche
• i tag sono case-sensitive à un carattere maiuscolo è considerato diverso dal medesimo
carattere minuscolo

analogie differenze
HTML Linguaggio di • è un linguaggio di mark-up
mark-up • serve a specificare pagine web
XML Linguaggio di • è un insieme di tecnologie che consentono la definizione di molteplici
mark-up linguaggi di mark-up
• trovano applicazioni in molteplici ambiti (es. doc aziendali)

17
Per la creazione di pagine web dinamiche invece si possono usare:


A. Tecnologie client-side (JavaScript, Java Applet, Adobe Flash)
B. Tecnologie server-side (Java Servlet, Python, Ruby)
C. Tecnologie ibride (AJAX, JQuery)

Tutte e 3 le tipologie sono linguaggi di programmazione o linguaggi di scripting


servono a scrivere programmi che servono per descrivere degli script
producono degli effetti (piccole porzioni di programmi)



Tecnologie client-side
1) JavaScript: linguaggio di scripting molto utilizzato per dare interattività alle pagine web (es.
al click del mouse corrisponde un roll-over). Questa tecnologia si basa su due concetti
principali:
o DOM (Document Object Model): insieme di oggetti che si riferiscono alla pagina web
oppure al browser à indica su quali porzioni della pagina queste determinate attività
interattive debbano essere aggiunte
Il DOM è definito dal browser, pertanto possono insorgere delle incompatibilità qualora si apra la
pagina con un browser diverso da quello definito
o Gli eventi à i JavaScript sono event-driven, cioè sono “guidati” dagli eventi compiuti
dall’utente

2) APPLETJAVA: piccolo programma scritto in Java che viene scaricato automaticamente
insieme ad una pagina web ed eseguito sul client dal browser. Le applet appaiono
visivamente all’interno della pagina web e hanno il compito di creare funzioni interattive
Caratteristiche principali di APPLETJAVA:
• Programma scritto in Java
• Serve a scrivere pagine dinamiche
• È interpretato ed eseguito sul client (è client-side)
• È una tecnologia quasi in disuso poiché molto pesante à infatti può appesantire la pagina
web
• Può far incorrere in problemi di compatibilità tra browser

differenze
JavaScript Ha cod. sorgente contenuto nella pagina HTML
APPLETJAVA Ha cod. sorgente contenuto in un file separato che viene compilato dal
programmatore e NON è quindi accessibile dall’utente

3) ADOBE FLASH: ambiente software x la creazione e distribuzione di contenuti multimediali
ed interattivi à è orientato alla multimedialità e comprende il linguaggio di scripting
(ActionScript). È interpretato da un apposito plugin: Adobe Flash Player
Le applicazioni Flash ad oggi sono quasi in disuso poiché NON più supportate dal browser

18
Tecnologie server-side
N.B: queste tecnologie NON sostituiscono le tecnologie client-side ma le affiancano, infatti è
possibile usarle contemporaneamente

1) Scripting

XHTML (eXtensible HyperTest Markup Language) à linguaggio di marcatura che
associa alcune proprietà dell’XML con le caratteristiche dell’HTML: un file XHTML è una
pagina HTML scritta in conformità con gli standard XML
Questo linguaggio si può definire come un sottoinsieme di HTML


Le principali tecnologie di scripting sono:
a. PHP
b. JSP
c. Python
d. Ruby

Scripting server-side: es. con scripting PHP:
1. Un utente richiede al web server di AzimutBenetti la pagina per l’autenticazione
dell’amministratore del sito aziendale
2. Il server invia al client la risorsa richiesta
3. Il client richiede al server il CSS
4. Il server invia al client il CSS (una pagina AzimutBenetti.css)
5. Il browser visualizza la pagina applicando il CSS
6. L’utente compila il form online e clicca invio
7. Il client richiede al server la risorsa controlloCredenziali.PHP e, nella stessa HTTP request,
invia al server i dati inseriti dall’utente (cioè login e password)
8. L’interprete PHP che risiede sul server esegue lo script e produce come risultato una pagina
HTML
9. Il server invia al client la pagina risultato dell’esecuzione dello script PHP
10. La pagina controlloCredenziali.php fa riferimento al CSS (siccome il browser aveva già chiesto
e ottenuto il CSS, questo sarà verosimilmente memorizzato nella cache del browser, quindi
NON viene più richiesto al server)
11. Il browser visualizza la pagina applicando il CSS alla pagina controlloCredenziali.php


JSP: tipo di tecnologia appartenente a Java che permette di associare le funzioni Java a tag HTML
permettendo di eseguire programmi lato server.
Caratteristiche delle JSP:
• Rappresentano un mix tra linguaggio di markup e linguaggio di programmazione
• Servono a scrivere pagine dinamiche
• Sono eseguiti server-side




19
Nuove tecnologie:
1. Web 2.0: caratteristica chiave è il fatto che gli utenti NON sono più semplici lettori ma diventano
autori di contenuti. Questo tipo di web è caratterizzato da un mark-up più semantico rispetto
alla versione precedente perché utilizza i linguaggi XML. Con il web 2.0 i siti diventano più
interattivi e viene introdotto il concetto di mashup à ossia applicazioni web che riutilizzano
funzionalità e contenuti offerti in rete x creare servizi e contenuti nuovi
Quando i servizi sono messi a disposizione sulla rete (es. google maps) vengono definiti OpenAPI

Aperte = disponibili a tutti


Application Programming Interface (interfaccia di
programmazione di un’applicazione): strumento
per rendere disponibile ad altri programmatori le
funzionalità di un programma


Una delle principali conseguenze dell’introduzione del Web 2.0 à cambiamento del modo di
definire i programmi: NON sono più “prodotti” ma “servizi” offerti secondo il modello SaaS
(software as a service)
Secondo questo modello il software NON
Questo modello è strettamente legato necessita di essere installato sul client, ma viene
all’approccio Cloud Computing: i dati e i reso disponibile come servizio tramite
programmi NON risiedono sul computer un’applicazione web che gli utenti possono
dell’utente ma “in the cloud” à l’utente vi utilizzare attraverso il browser
ci accede e interagisce tramite un web
browser o un’app da smartphone o tablet


Cloud Computing è normalmente diviso in
3 livelli:
1. Infrastructure as a service (IaaS)
2. Platform as a service (PaaS)
3. Sofware as a service (SaaS)

Un esempio di tecnologia per il Web 2.0 sono i Feed RSS à un formato per la
pubblicazione/distribuzione sul web di contenuti ad alta frequenza di aggiornamento (es. notizie,
post su blog...). RSS fa uso di markup semantico (utilizza XML) e permette il mashup di contenuti di
fonti differenti. Lo standard RSS definisce la struttura di una notizia articolata in vari campi (es.
autore, titolo, categoria...) à questo permette ad un sito di pubblicare i propri contenuti in formato
RSS, affinché altri siti possano leggerli automaticamente

Simbolo Feed RSS



I Feed possono avere un ruolo anche nell’ambito dell’e-commerce

20
Un altro esempio di tecnologia per il Web 2.0 è il Social Tagging à sistema che permette agli utenti
di assegnare dei tag a pagine web o porzioni del loro contenuto

È un’etichetta formata da uno o più parole e può
essere considerato come un metadato (dato sui dati)

L’insieme dei tag assegnati dagli utenti ai contenuti di un sito rappresenta una categorizzazione
sociale che esprime il punto di vista degli utenti (come gli utenti classificano quei contenuti)

2. Tecnologie ibride: AJAX à tale termine indica una nuova etichetta x riassumere l’utilizzo
congiunto delle tecnologie client-side e server-side. Differenza principale tra le applicazioni Ajax
e le applicazioni dinamiche tradizionali risiede nel loro funzionamento:

funzionamento applicazioni dinamiche tradizionali à per ogni interazione con l’utente viene inviata
una richiesta x una nuova pagina contenente la risposta del server

funzionamento applicazioni AJAX à consentono di inviare al web server richieste asincrone (mentre
l’utente può continuare ad interagisce con la pagina) e parziali (relative solo ai dati necessari)

Es. del funzionamento AJAX:


• utente deve compilare un form inserendo città, via, numero e cap
• quando l’utente inserisce la città automaticamente il sistema inserisce anche il cap
nell’apposito box
• nel contempo l’utente può continuare ad interagire con a pagina senza soffermarsi
sul box “cap”

Ciò avviene perché mentre viene compilato il campo “città”, uno script client-side se ne
accorge e invia una richiesta asincrona al server nella quale si chiede il cap associato.
Quando il server ha trovato il cap, lo invia allo script client-side che lo inserisce nella pagina




APPLICAZIONI BASATE SULLE TECNOLOGIE WEB
Le tecnologie web di cui abbiamo parlato finora possono essere utilizzate direttamente o
indirettamente x costruire un sito dinamico. Esempi di ciò:
• Sistemi per la costruzione e gestione di blog, community online e siti di social tagging
• Content Management System (CMS)

Un CMS è un software che supporta e facilita la creazione e la gestione collaborativa di un sito web.
Tramite i CMS è possibile costruire e aggiornare il proprio sito web anche di grandi dimensioni, senza
necessariamente conoscere il linguaggio HTML o altri linguaggi di programmazione web

Le tecnologie web sono usate per costruire CMS, che a loro volta sono usati per costruire siti,
servizi e app web

21
Vantaggi del CMS:
• possibilità di costruire, aggiornare un sito, servizio, app web senza conoscere le tecnologie
web
• manutenzione e aggiornamento del sito e servizio facilitati
• netta separazione di codice di programmazione, grafica/layout e contenuti
• includono spesso piccole applicazioni utili per l’arricchimento dell’interattività del sito
• semplicità di configurazione
• gestione multi-utente del sistema e redazione distribuita

Svantaggi del CMS:
• il loro utilizzo NON è mai così semplice
• se un utente volesse personalizzare le impostazioni preesistenti à dovrà modificare
direttamente il cod. sorgente del sistema


Esempi di CMS:
A. Wordpress à nasce come piattaforma per la gestione dei blog, scritto in PHP, risulta essere
molto semplice ed intuitivo da utilizzare. Ha in aggiunta un’ampia scelta di template e
componenti aggiuntivi
B. OpenCMS à basato su tecnologie Java e XML. Comprende un’ampia sezione per la creazione
di template e rende disponibili moduli ufficiali aggiuntivi sia rilasciati dagli stessi sviluppatori
del prodotto sia da terzi sviluppatori
C. Concrete5 à considerato un CMS ideale per chi NON possiede competenze informatiche.
Ha inoltre un’interfaccia user-friendly
D. Google Sites à CMS online molto semplice che permette di costruire siti basati su template
predefiniti più o meno personalizzati. X utilizzarlo è necessario aere un account Google

La scelta di utilizzare un CMS dipende da 3 opzioni: Vantaggio: risponde alle esigenze dell’impresa
• Realizzare da ex novo un CMS su misura
Svantaggio: poco personalizzabile

Vantaggio: è collaudato, ha tempi di sviluppo molto brevi e
• Acquistare un CMS proprietario ha assistenza tecnica

Svantaggio: poco personalizzabile
Vantaggio: ha costi bassi di sviluppo ed
• Scegliere un’applicazione CMS open source è molto personalizzabile
Svantaggio: necessita di competenze tecniche
x la personalizzazione e la manutenzione








22
SEO: SEARCH ENGINE OPTIMIZATION
Insieme di buone prassi nella costituzione e manutenzione di un sito web volte ad assicurare una
buona visibilità a siti e pagine web nei risultati prodotti dai motori di ricerca

I SEO mirano a garantire che ogni volta che un sito contenga delle info rilevanti x una data ricerca
sul web, i link alle opportune pagine del sito compaiano fra le prime opzioni dei risultati di ricerca

3 regole importanti: SERP = Search Engine Result
1. NON tentare di ingannare i motori di ricerca à in quanto Pages (pagine dei risultati della
ormai molto abili nel riconoscere e penalizzare i siti che ricerca)
cercano di frodarli
2. Ricordarsi che il sito DEVE essere fatto per gli utenti in quanto utilizzatori finali à bisogna
soddisfare le esigenze degli utenti in primis
3. NON usare troppe pratiche SEO à in quanto possono risultare sospette x i motori di ricerca
e pertanto il risultato potrebbe essere un blocco del sito

Occorre scegliere accuratamente le parole chiave
È importante individuare le parole chiave con cui si vuole che i contenuti del sito vengano trovati.
Per far ciò, gli sviluppatori fanno in modo che le parole chiave siano quelle che compaiano in vari
tag (es. title, h1, h2...), in alcuni meta-tag (es. description), nel testo dei link e nei nomi dei file

Titolo della pagina web: ideale sarebbe avere un titolo univoco Evitare nomi generici come
(ripetuto in più pagine del sito) ma che NON sia troppo lungo img1.jpg.
È meglio attribuire dei nomi
significativi usando parole
Sempre meglio NON esagerare con le parole chiave, evitare ad chiave separate da un trattino
es. “barattolo-miele-bioologico-castagno-apesusa-vanus-to.jpg


Gli attributi “alt” delle immagini sono un elemento importante in cui inserire le parole chiave à
infatti gli attributi “alt” di un’immagine sono indispensabili ai fini dell’ottimizzazione SEO. Infatti i
motori di ricerca tendono a “captare” la stringa dei tag “alt” come testo alternativo nel caso in cui
l’immagine NON fosse disponibile al momento, questo perché i crawler sono testuali

Software che analizzano i contenuti di una
rete o di un db in modo metodico e
automatizzato x conto di un motore di ricerca

Bisogna curare ogni singola pagina à ciò significa scrivere pagine web pulite:
• Rispettare la sintassi XHTML (nonostante sia meno tollerante agli errori rispetto all’HTML)
• Mantenere separato l’aspetto dal contenuto (usando CSS)
• Usare i tag <h1>, <h2> ecc per ciò x cui sono stati pensati
• NON ripetere il tag <h1>, <h2> nella stessa pagina
• Evitare di riempire ogni pagina con parole chiave
• Evitare collegamenti ipertestuali attivabili tramite immagini
• Evitare collegamenti ipertestuali inutili
• NON inserendo testi nelle immagini à in quando i motori di ricerca NON leggono il testo
codificato come immagine

23
Bisogna curare il sito nel suo complesso:
• Evitare di costruire una complicata ragnatela di collegamenti ipertestuali
• Evitare strutture ipertestuali eccessivamente profonde

Motivo per cui si tende a costruire
strutture ipertestuali profonde risiede nel
fatto che spezzettando il contenuto
l’utente è costretto a cliccare più volte
sulla pagina, aumentando il rating della
stessa. Ciò è sbagliato in termini di SEO


• Consentire una navigazione che vada dai contenuti più generali a quelli più specifici
• Usare le immagini dei formati di file supportati dai browser comuni

Sarebbe meglio scegliere l’URL con il nome dell’azienda ed il più possibile corto, con un dominio di
primo livello che sia attinente all’azienda
N.B: occorre comprare tutti i domini di primo livello che si riferiscono al proprio sito così da evitare
che alcuni competitor li possano usare x sfavorire la riconoscibilità della propria azienda

Il contenuto è il fattore più importante anche x i fini SEO à bisogna offrire un contenuto utile e
originale (evitando quindi di copiare da altri siti ed evitando di duplicare i contenuti più volte
all’interno della propria pagina)
La popolarità e la reputazione della pagina sono altri due fattori molto importanti che influenzano
il posizionamento di una pagina nelle SERP. Questi due fattori tengono conto di 3 aspetti:
A. Il numero e la qualità dei collegamenti che il sito ottiene da pagine di altri siti (backlinks)

Si tratta dei link che una pagina
Tramite i backlinks la pagina riceve una certa (pagina di destinazione) riceve da
quota di valore dalla pagina da cui parte il link una pagina esterna (pagina risorsa)


B. la qualità del sito e dei suoi contenuti
C. la reputazione dei siti verso cui il sito contiene collegamenti ipertestuali

X evitare collegamenti con siti di bassa reputazione si può aggiungere il valore
“nofollow” all’attributo “rel” del link ( si può inserire questa indicazione anche nei
commenti degli utenti in modo che questi NON possano inserire link)

Si possono comunque costruire delle mappe (sitemap), cioè dei file che contengano l’elenco degli
URL delle principali pagine visitabili dal sito (molto utile x i motori di ricerca)

La Web directory è una directory accessibile via web che contiene l’elenco dei siti web à è
importante inserire il proprio sito nella web directory (la principale web directory è Open Directory
Project (ODP))



24
HTTPS à servizio offerto da Google grazie al quali gli utenti possono accedere a siti sicuri

È un miglioramento dell’HTTP dove la S indica
“secure”: un più alto livello di sicurezza

NON è protocollo, ma una combinazione di protocolli: protocollo HTTP + un protocollo per la
realizzazione di comunicazioni sicure su Internet (sul browser compare il simbolo del lucchetto)

Questo protocollo nasce x realizzare comunicazioni sicure e
viene denominato TLS (Transport Layer Security)



Protocollo basato su crittografiaà grazie a HTTPS i messaggi vengono criptati
prima dell’invio e decriptati in ricezione (vengono criptati header e body)

I maggiori motori di ricerca hanno proposto uno schema.org à sist. di annotazione x pagine web
che consente di aggiungere descrizioni “machine readable”

Le annotazioni NON sono comprensibili agli umani ma
sono lette dalle macchine e comportano una migliore
comprensione delle pagine web
Es. di annotazioni per film:
• Frammento itemtype

• Frammento itemprop=name

• Frammento itemprop=director

• Frammento itemprop=genre

• Frammento itemprop=trailer




USABILITÀ

Secondo Donald Norman i principi fondamentali per il design di oggetti d’uso sono:
1. Fornire visibilitàà fare in modo che i comandi siano individuabili con facilità
2. Fornire un buon mappingà rendere naturale la relazione tra i comandi
Es. buon mapping: casella di posta elettronica ha forma di busta da lettera à permette immediata
associazione dell’app con il concetto di inviare i messaggi
3. Fornire inviti (affordance) e vincoli (constrains) all’uso à es. conformazione della
bottiglietta d’acqua dà suggerimenti cognitivi immediati x impugnarla nel modo più
efficiente
4. Fornire feedback à l’utente deve capire cosa è successo in seguito all’aver azionato un
comando
Es. quando si invia una mail compare l’avviso “messaggio inviato correttamente”
5. Fornire un buon modello concettuale à fare in modo che l’immagine del sist. offra tutte le
informazioni essenziali (capire a colpo d’occhio a cosa serva quella cosa)
Es. segno “+” sul telecomando serve per alzare il volume

25
Secondo la norma ISO 9241-11 l’usabilità è la somma di efficacia, efficienza e soddisfazione con cui
gli utenti raggiungono gli obiettivi che si sono proposti (questi 3 fattori sono collegati fra loro
seppur indipendenti)

L’usabilità dei siti web = facilità di utilizzo dell’interfaccia à il grado di usabilità determina il grado
di successo o insuccesso: es. sist operativo IoS vs sist operativo Window
à a parità di fattori tecnici, il grado di usabilità ha determinato il successo del primo sul secondo

Le difficoltà della navigazione sul web:
• Disorientamento
• Digressioni (es. zapping sul web)
• Overload informativo
• NON possibilità di tenere traccia delle info trovate


Tecnica dei frames: permette di suddividere la finestra principale del sito web in 2 o + finestre,
ognuna delle quali conterrà una pagina HTML che potrà avere impostazioni differenti dalle altre.
N.B: dal punto di vista dell’usabilità è meglio NON usare i frames à in quanto possono presentare
dei problemi nei seguenti casi:
1. Quando salviamo nei segnalibri o nei preferiti siti con i frames
2. Quando vogliamo stampare una pagina
3. Perché non viene visualizzato l’URL
Alternativa ai frames: CSS e box model

Contenuto
La lettura a schermo è del 25% più lenta della lettura su “carta” à x questo bisogna essere il più
concisi possibile usando paragrafi brevi e strutture ipertesto
Gli utenti tendono a NON leggere il testo ma a scorrerlo velocemente con gli occhi à x questo
motivo bisogna tenere conto dei seguenti aspetti:
• Strutturare il testo su 2 o 3 livelli
• Usare titoli significativi
• Evidenziare le parole chiave

Leggibilità del testo: per rendere al meglio la leggibilità bisogna seguire le seguenti accortezze:
o Testo e sfondo con colori contrastanti
o Sfondi a tinta unita
o Font abbastanza grandi x essere letti senza difficoltà
o NON mettere tutto il testo in maiuscolo

Design del sito web à composto da 3 aspetti principali:
1. Navigazione e struttura del sito
2. Motori di ricerca interni ai siti
3. Nomi degli URL



26
Accessibilità (sottocategoria dell’usabilità) à riguarda le modalità relative all’utilizzo
dell’interfaccia x utenti che hanno delle disabilità (es. ipovedenti, parapleggici...)
Esistono diversi tipi di disabilità e per ogni tipo l’accessibilità cerca di colmare le difficoltà che si
vengono a creare nell’uso quotidiano tramite degli istrumenti di input/output


• Mouse con trackball • Browser grafici
• Riconoscimento vocale • Browser testuali
• Tastiera adattiva • Stampanti
• Ecc • Ecc



La legge Italiana li definisce come degli strumenti nati x evitare la diffusione di emarginazione e x
rendere disponibile al maggior numero di persone le pagine web

N.B: le PA, le aziende private concessionarie di servizi pubblici, gli enti di assistenza e el aziende
appaltatrici sono OBBLIGATI a fornire questi strumenti

Vi sono alcune linee guida relative all’accessibilità à WCAG (Web Content Accessbility
Guidelines)

4 principi da cui derivano 12 linee guida:


1) Le informazioni e i componenti dell’interfaccia utente DEVONO essere presentati all’utente
in modo che possano essere percepiti almeno da un senso
a. Fornire alternative testuali
b. Fornire alternative x i tipi di media temporizzati
c. Creare contenuti che possano essere rappresentati in modalità differenti
d. Rendere + semplice agli utenti la visione e l’ascolto dei contenuti, separando i
contenuti in primo piano dallo sfondo
2) I componenti e la navigazione dell’interfaccia utente DEVONO essere utilizzabili
a. Rendere disponibili tutte le funzionalità tramite tastiera
b. Fornire agli utenti tempo sufficiente x leggere ed utilizzare i contenuti
c. NON sviluppare contenuti che possano causare attacchi epilettici
d. Fornire delle funzionalità di supporto all’utente per navigare, trovare contenuti e
determinare la propria posizione
3) Le informazioni e le operazioni dell’interfaccia utente DEVONO essere comprensibili
a. Rendere il testo leggibile e comprensibile
b. Creare pagine web che appaiano e che siano prevedibili
c. Aiutare gli utenti ad evitare gli errori ed agevolarli nella loro correzione
4) Il contenuto DEVE essere abbastanza robusto x essere interpretato in maniera affidabile
mediante una vasta gamma di programmi utente, comprese le tecnologie assistive
a. Garantire la massima compatibilità con i programmi utenti attuali e futuri, comprese
le tecnologie assistive

27

Potrebbero piacerti anche