Corso di Informatica
ECDL
Ivan Renesto
[email protected]
+393477224641
Ivan Renesto
[email protected]
1
Libri di Testo

Patente Europea del Computer




VOLUME 1
VOLUME 2
Autori: Dameri, Foresti
Jackson Libri
Ivan Renesto
[email protected]
2
Modulo 7
Reti Informatiche


Volume II
Studiare: da pag 192 a pag 273





Per iniziare …………………………………
Navigazione nel Web …………………..
Ricerca nel Web ………………………….
Segnalibri …………………………………..
Posta elettronica: Per iniziare ……….
Ivan Renesto
[email protected]
193
211
218
229
233
3
Modulo 7
Reti Informatiche

Volume II




Messaggi ………………………………… 241
Indirizzi …………………………………… 261
Gestione dei messaggi ……………… 268
Volume I

Reti Informatiche …………………….
Ivan Renesto
[email protected]
33
4
Indice Argomenti







Reti Locali
La rete delle reti
File Transfer Protocol
Navigare in Internet
La Posta
Outlook
HTML: introduzione al linguaggio
Ivan Renesto
[email protected]
5
Reti Locali (LAN)
LAN: Local Area Network
Una rete locale si sviluppa
all’interno
di spazi limitati
“Un insieme di computer tra loro connessi”
Ivan Renesto
[email protected]
Mezzo trasmissivo utilizzato
per interconnettere gli elaboratori
6
Reti Locali a Bus
Ogni computer, per mezzo del proprio hardware
(es.: scheda di rete), si connetterà al mezzo trasmissivo
Mezzo trasmissivo condiviso
(cavo coassiale)
Ivan Renesto
Terminatore
(assorbe i segnali)
[email protected]
7
Comunicazione
Scambio di “pacchetti”
creazione
da1
Indirizzo
Computer mittente
a2
da1
da1
Indirizzo
Computer destinatario
Messaggio a destinazione!
1
x
Mitt.
Dest.
2
da1
a2
a2
assorbimento
da1
a2
3
da1
a2
da1
a2
x
a 2 “scartato”
Il messaggio viene
dal computer 3, perché non destinato
assorbimento
ad
esso!
Il segnale si propaga
in entrambe le direzioni
Ivan Renesto
[email protected]
8
Comunicazione: protocolli
Protocollo: insieme di regole
Tra i più usati nelle reti troviamo i protocolli TCP/IP
1
2
3
TCP/IP: astrattamente, consistono
Collisione di due pacchetti di dati
Ivan Renesto
in un insieme di regole che consentono a più
computer di portare a termine, in modo completo
e corretto, uno o più scambi di informazioni
[email protected]
9
Suite di protocolli TCP/IP
Protocollo trasferimento Hyper Testi
Suddivisione per livelli:
- ogni livello tratterà i pacchetti secondo il proprio protocollo
- ogni livello sarà in grado di comunicare con altri livelli di
pari entità
HTTP
Pagina web
LIVELLO SOFTWARE
Transport Control Protocol
TCP
TCP
Pagina web
IP
TCP
Pagina web
IP
TCP
Pagina web
LIVELLO SOFTWARE
Internet Protocol
IP
LIVELLO SOFTWARE
Ethernet
LIVELLO HARDWARE
Ivan Renesto
[email protected]
Informazioni aggiunte
da ogni livello
10
Reti Locali a Stella
Il mezzo trasmissivo non è più
condiviso
Il mezzo trasmissivo non è più il cavo
coassiale, bensì il DOPPINO
TELEFONICO
Esiste un dispositivo che sarà il
centro nevralgico della rete, e potrà
presentarsi in due modi differenti:
1)
2)
Ivan Renesto
[email protected]
HUB
SWITCH
11
Comunicazione
E così via, ogni pacchetto, che l’hub riceve
da un computer,
ritrasmesso
Il computer
1 inizia un viene
trasferimento
su tutti i collegamenti verso gli altri computer
di file con il computer 3
1
2
6
X
Il messaggio viene
scartato
X
HUB
3
Il messaggio viene
Il messaggio giunge ascartato
destinazione!
Il messaggio viene
scartato
5
X
4
X
Il messaggio viene
scartato
1
Ivan Renesto
[email protected]
12
Comunicazione
1
2
6
b
SWITCH
f
Lo switch, più intelligentemente,
controllerà la destinazione del
pacchetto e, grazie alla sua tabella di
routing, lo smisterà unicamente sul
link opportuno
Ivan Renesto
a
b
c
d
e
f
c
a
3
Link
d
5
e
Computer
2
1
6
5
4
3
4
[email protected]
13
La rete delle reti
I dati viaggiano
rete sotto
forma
pacchetti.
Internet:sulla
in modo
astratto
puòdiessere
Consente a due o più
remoti
Essi saranno
da: computer
visto caratterizzati
come un insieme
di collegamenti
di mettersi in comunicazione
1. indirizzo
e nodicomputer mittente
2. indirizzo computer destinazione
I nodi della rete
Router
ISP (Internet
Service Provider)
Internet
si appoggia
molto sulla rete telefonica
Ivan Renesto
[email protected]
14
Commutazione di pacchetto
ISP
congestione
Router
Router
ISP
Ivan Renesto
Router
[email protected]
15
Indirizzi IP


Ogni computer, per poter comunicare
nella rete, necessita di un indirizzo
L’indirizzo ad un computer può essere:



Statico
Dinamico
Tale indirizzo è detto:

Indirizzo IP
Ivan Renesto
[email protected]
16
Indirizzi IP
Livello di rete
(IP: Internet Protocol)
IP
Ivan Renesto
Si occupa di trasmettere pacchetti
dalla sorgente alla destinazione
[email protected]
17
Indirizzi IP
Indirizzo IP
destinazione
Indirizzo IP
sorgente
Internet
Sorgente
Ivan Renesto
Destinazione
[email protected]
18
Indirizzi IP
193.68.211.5
A.B.C.D
Numero tra 0 e 255
Ivan Renesto
[email protected]
19
Indirizzi IP
Un indirizzo IP è un numero a 32 bit
8 bit
8 bit
8 bit
8 bit
Può essere scomposto in 4 numeri da 8 bit
8
2 = 256
Ognuno di questi numeri potrà assumere
256 valori: da 0 a 255
Ivan Renesto
[email protected]
20
Indirizzi IP
127.0.0.1
127.0.0.1
253.13.62.9
modem
192.168.0.3
192.168.0.4
Internet
Non tutti gli indirizzi IP possibili sono utilizzabili:
-alcuni sono privati
-10.*.*.*
-172.16.*.*
-192.168.0.*
(rete di classe A)
(rete di classe B)
(rete di classe C)
-0.0.0.0
-255.255.255.255
-…
(default)
(broadcast)
-Alcuni sono riservati ad uso speciale
Ivan Renesto
[email protected]
Un computer può avere più indirizzi IP.
Uno per ogni interfaccia di rete:
-loopback
(127.0.0.0)
-Rete Locale
(192.168.0.0)
-Point to Point
(…)
21
Nomi Simbolici
Gli indirizzi
Adnumerici
ogni indirizzo
sono numerico
pratici da gestire in
modo automatico,
può essere associato
ma non loun
sono
nome
dal punto
di vista della simbolico
memorizzazione umana
http://www.lastampa.it/redazione/default.asp
Protocollo di comunicazione
Identifica
un documento
computer
in rete
Nome
del
web
da
Identifica
un percorso,
espresso
invisualizzare
termini
assoluti, intendendo come radice del percorso
una cartella condivisa del computer identificato
dal nome precedente
Ivan Renesto
[email protected]
22
Nomi Simbolici: URL
http://www.lastampa.it
URL
Ivan Renesto
Tipo di servizio:
Dominio
www
(World Wide Web)
Estensione
[email protected]
23
Protocolli


Un protocollo costituisce un insieme di regole
I protocolli di rete sono un insieme di regole atti a
garantire:





Ivan Renesto
Il trasferimento di informazioni da un computer a un altro
(IP)
Il trasferimento senza errori delle informazioni, con controllo
sul flusso (TCP)
Il trasferimento di informazioni via web (HTTP)
Il trasferimento sicuro di informazioni via web (HTTPS)
…
[email protected]
24
Protocolli di comunicazione
La suite di protocolli TCP/IP è definita
“Paritetica”
LVL 3
LVL 3
HTTP, FTP, …
LVL 2
TCP
LVL 1
HTTP, FTP, …
Insieme di protocolli,
tra i più usati nelle reti.
LVL 0
Ivan Renesto
TCP
LVL 1
IP
Ethernet
LVL 2
IP
LVL 0
LAN, MAN,
Internet, …
[email protected]
Ethernet
25
Protocolli di comunicazione






IP: Internet Protocol
TCP: Transport Control Protocol
HTTP: Hyper-Text Transfer Protocol
FTP: File Transfer Protocol
SMTP: Simple Mail Transfer Protocol
POP3: Post Office Protocol
Ivan Renesto
[email protected]
26
FTP
File Transfer Protocol
Ivan Renesto
[email protected]
27
FTP: File Transfer Protocol


FTP è un protocollo di trasferimento file,
che ci consente di effettuare passaggio
di informazione tra due computer che
non possono comunicare in altro modo
FTP può essere usato mediante:


Interfaccia a comandi
GUI (Graphical User Interface)
Ivan Renesto
[email protected]
28
FTP: Uso

Due sono gli applicativi software
necessari all’uso pratico di questo
protocollo:


FTP Server
FTP Client
Ivan Renesto
[email protected]
29
FTP: funzionamento
192.168.0.1
FTP
Client
192.168.0.2
Passo 3
2
1:
4
192.168.0.2
Il computer 192.168.0.1
che
deve
deve
possedere
possedere
a poter
sua
un
vuole
trasferire
file
da/a
(Client),
prima
di
client
volta
un
FTP,
FTP
testuale
Server
il computer
192.168.0.2
prelevare/inviare
fileo con
interfaccia
attivo,
per
poter tenta di
da/verso
il grafica,
computer
collegarsi
accettare
connessioni
al computer
dasi
192.168.0.2
(Server),
un qualsiasi
192.168.0.2
Client
dovrà
prima FTP
identificare
mediante autenticazione
FTP
Server
Internet, LAN,
…
(una rete qualsiasi)
Ivan Renesto
[email protected]
30
FTP: comandi

Tra i comandi a disposizione, i più semplici ed
utili sono:

bin


cd


Per prelevare un oggetto
put


Per cambiare directory
get


Per impostare un trasferimento di tipo “binario”
Per trasferire un oggetto
dir

Ivan Renesto
Per visualizzare il contenuto della directory
[email protected]
31
help: listato dei comandi disponibili
FTP: Interfaccia testuale
help <comando>: descrizione del comando
Ivan Renesto
[email protected]
32
FTP: GUI
Una interfaccia grafica per effettuare
FTP è costituita da Microsoft Explorer
Nella barra Indirizzo occorrerà specificare di voler usare
il protocollo FTP: scrivendo ftp://
dopodichè occorrerà indicare il nome dell’utente ed il
computer sul quale operare con la seguente sintassi:
<nome_utente>@<indirizzo computer>
Ivan Renesto
[email protected]
33
FTP: GUI
L’indirizzo del computer sul quale accedere,
che fornisce il servizio FTP, può anche essere scritto
usando il relativo nome simbolico al posto dell’indirizzo IP.
Nell’esempio: al computer 192.168.0.100 è fatto
corrispondere il nome simbolico grifo.olimpo
Ivan Renesto
[email protected]
34
FTP: autenticazione
Per completare l’autenticazione dell’utente a cui
sta per essere dato l’accesso al servizio FTP con determinati
privilegi, occorre inserire la password
Ivan Renesto
[email protected]
35
FTP: finestra client
Ora è possibile trasferire file
o cartelle in modo analogo a
quando si opera con una normale
finestra d’accesso ad una risorsa
Ivan Renesto
[email protected]
36
Web Browsing
Navigare in Internet
Ivan Renesto
[email protected]
37
Navigare in Internet

Concetti fondamentali:






Navigare
Sito
Pagina Web
Portale
Server HTTP
Client HTTP: Browser
Ivan Renesto
[email protected]
38
Navigare: concetti




Navigare è il termine con il quale si indica
l’esplorazione dei documenti presenti nella
rete globale
La rete globale è Internet
La navigazione è possibile mediante appositi
applicativi: browser
Esempi di browser:




Microsoft Explorer
Opera
Mozilla
…
Ivan Renesto
[email protected]
39
Un sito web è una
collezione di
documenti web
Un sito Internet
Tutti i documenti
Una pagina
è
web web
del sito
unpossono
documento
essere tra
consultabile
in
loro collegati,
internetmediante
tramite
un
Un
portale
è un sito
link
browser
che offre un punto
d’accesso
per molti
I link sono
collegamenti
,
svariati
servizi
impostati edal
creatore
della
pagina web, cliccando sui
quali è possibile navigare
La prima pagina di ogni
sito, per convenzione,
dovrebbe chiamarsi:
-index.htm
.jsp
-index.html
.php
verso un successivo
documento web
Ivan Renesto
[email protected]
40
Volendo navigare

Per poter navigare in internet occorre:




Un computer
Una linea telefonica
Un modem e i cavi di connessione al computer e
alla linea telefonica
Specifico software per la navigazione




Software di accesso remoto
Browser (programma di navigazione)
Mail User Agent (programma di gestione della posta)
Un account presso un ISP


Ivan Renesto
Credenziali: login e password
Numero di telefono dell’ISP
[email protected]
41
HTTP Server
Connettersi
Il tempo della telefonata
equivalesarà
a fare
una
equivalente
al tempo
telefonata all’ISP
di connessione
Router
Cosa succede
…Stabilisce una
Se l’Internet Service Provider si
connessione
col
L’utente
vorrebbe
trova ad Aberdeen (Scozia) la
suo ISP …
navigare
in
chiamata sarà internazionale!!!
Scambio…di informazioni:
internet
Il ISP
risparmio si trova nella scelta
-MTU
dell’ISP più vicino
-Login
-Password
-…
Ivan Renesto
[email protected]
42
Cosa succede: navigando
Messaggio di richiesta di
visualizzazione del sito:
http://www.meteo.it
http://www.meteo.it
Il messaggio ricevuto viene
GET
scartato,
la pagina web in esso
contenuta
viene passata al
www.meteo.it
browser che provvede a
HTTP
1.1
visualizzarla
Ivan Renesto
Il computer in internet, che
ospita il sito web richiesto e
che risponde al nome
www.meteo.it, prepara la
prima pagina del suo sito e la
spedisce in risposta alla
richiesta ricevuta
[email protected]
43
Problematiche



Navigare richiede la conoscenza precisa dei
nomi dei siti
I motori di ricerca utilizzando parole
chiave ci forniscono indirizzi precisi di siti
La memorizzazione di un indirizzo può
essere difficoltosa. In aiuto viene lo
strumento Preferiti
Ivan Renesto
[email protected]
44
Barra del titolo
Pulsanti di controllo
File
Barra dei
menu
Modifica
Visualizza
Preferiti
Strumenti
Aiuto
Il Browser: Microsoft Explorer
Pagina Web
Rappresentazione grafica di un
documento internet così come il
browser lo visualizza
Barra degli Barra
strumenti:
degli Standard
strumenti: Indirizzo
Cronologia
Vai
Contenente i pulsanti per le funzioni
Nella casella di inserimento in questa
Permette
di
visualizzare
un
elenco degli
più comunemente
usate
nella
barra
potrà
essere
inserito
l’indirizzo
del
Pulsante
che
consente
di
inviare
la
ultimi sitisito
visitati
in ordine cronologico,
navigazione
da
visualizzare
richiestaedidivisualizzazione
sceglierne uno di un sito, il
cui indirizzo è stato scritto nella casella
Premendo
[INVIO] si della
procederà
di inserimento
stessaall’invio
barra
della richiesta
Ivan Renesto
[email protected]
45
Browser: Impostazioni di base

Le possibili impostazioni di base per
Microsoft Explorer riguardano:




Pagina Iniziale
File Temporanei
Cronologia
Per modificare le impostazioni:
Strumenti  Opzioni internet…
 Scheda Generale

Ivan Renesto
[email protected]
46
Impostazioni: Pagina iniziale

E’ possibile impostare quella che si vuole sia la
pagina iniziale visualizzata all’interno del
browser:

Scrivendo nella casella di inserimento della sezione
Pagina iniziale l’URL desiderato


Premendo il pulsante Pagina corrente


per impostare nella casella l’indirizzo della pagina
correntemente visualizzata dal browser
Premendo sul pulsante Pagina predefinita


Es.: http://www.suse.com
per ripristinare la pagina preimpostata dal browser
Premendo sul pulsante Pagina vuota

Ivan Renesto
(about:blank) per non far visualizzare alcuna pagina
all’apertura del browser
[email protected]
47
Impostazioni: Pagina iniziale
Per richiamare, in qualsiasi
momento, la pagina impostata
come iniziale sarà sufficiente
premere su questo pulsante,
sulla barra degli strumenti:
Standard
Ivan Renesto
[email protected]
48
Impostazioni: File temporanei



Durante la navigazione, il nostro browser
memorizza su una parte di disco locale (cache)
informazioni utili ad un suo migliore
funzionamento.
Tali informazioni non sono indispensabili ed
occupano spazio
Possono essere eliminate in qualsiasi momento
con i pulsanti:


Elimina file…
Elimina cookie…
Ivan Renesto
[email protected]
49
Impostazioni: Cronologia



Il browser può tenere traccia dei siti visitati
Esiste una cartella Cronologia in cui
vengono memorizzate tali informazioni
Dalla finestra Opzioni Internet è possibile:


Specificare ogni quanti giorni automaticamente la
Cronologia venga cancellata
Cancellare la Cronologia premendo il pulsante
Cancella Cronologia
Ivan Renesto
[email protected]
50
Cronologia

E’ possibile accedere alla cronologia in
due modi:

Mediante l’apposito pulsante nella barra degli
strumenti: Indirizzo


Determinerà l’apertura di un menu a cascata dal
quale scegliere un URL
Mediante pulsante nella barra degli
strumenti: Standard

Ivan Renesto
Determinerà l’apertura di una sezione laterale
sinistra all’interno della finestra del browser
[email protected]
51
Cronologia: accesso diretto


Si avrà la possibilità, con
semplici click di tasto sinistro
del mouse, di visualizzare in
base a gruppi cronologici i siti
visitati
Anche all’interno di questa
sezione è disponibile una
funzione di ricerca
Ivan Renesto
[email protected]
52
Cronologia: scorrere la lista
Pulsante disattivato

È possibile scorrere
lanon
lista
cronologica
Indica che
è possibile
scorrere la lista
cronologica in avanti: ad esempio quando la
dei siti visitati lista
con
i pulsanti:
è vuota,
non avendo ancora visitato alcun
sito, oppure quando si è in fondo alla lista


Avanti
Indietro
Pulsante attivato
Indica che la lista cronologica dei siti non è
vuota, e che è possibile visionare quali siti
sono stati visitati precedentemente
Ivan Renesto
[email protected]
53
Caching dei siti web

Un browser oltre a memorizzare gli indirizzi
dei siti web visitati durante il suo utilizzo, può
anche mantenere in memoria informazioni
inerenti il contenuto dei siti visitati

Tali informazioni vengono memorizzate in
modo permanente, ma sottoforma di file
temporanei, in una zona del disco locale
chiamata cache
Ivan Renesto
[email protected]
54
Caching: funzionamento
Zona
A.
B.
C.
D.
E.
http://www.manzoni.it
http://www.edes.it
http://www.meteo.it
http://www.virgilio.it
http://www.renesto.it
del disco locale: Cache
A
B
D
C
E
Ivan Renesto
[email protected]
55
Caching: utilizzo dal browser
B
GET
B HTTP 1.1
A
E
Ivan Renesto
Prima
il browser
controlla
se
la
Digitando
Supponiamo
ilCome?
nome
ora
l’utente
del
sitovoglia
nella
Preparando
un
messaggio
casella
Indirizzo
premendo
NO!
pagina
web
richiesta
rivisitare
il esito
Bè e
di richiesta,
inviandolo
[INVIO]
il browser
si adopera
presente
nella
cache
aspettando
di
ricevere
in
per recuperare la pagina web
rispostae la
pagina
A web?
richiesta
per
visualizzarla
B
C
B
D
C
E
D
[email protected]
56
Caching: richiesta di utilizzo

L’utente, utilizzando i pulsanti:




Avanti
Indietro
chiede al browser di rivisualizzare una
pagina precedentemente visitata, quindi
presente in cache.
Il browser la rivisualizzerà senza
inoltrare alcuna richiesta via internet
Ivan Renesto
[email protected]
57
Interrompere una richiesta

È possibile che per visualizzare una pagina
web il browser impieghi molto tempo




a causa di una congestione della rete
a causa del malfunzionamento di un server o di
router
…
A tale scopo è possibile interrompere la
richiesta di visualizzazione mediante il
pulsante
termina
Ivan Renesto
[email protected]
58
Ripetere una richiesta di
visualizzazione


Dopo aver interrotto una richiesta di
visualizzazione col pulsante
termina
è possibile ripeterla semplicemente
premendo il pulsante
aggiorna
Tale pulsante impone al browser di non
controllare ciò che è contenuto nella
cache e di inoltrare una richiesta via
internet della pagina specificata
Ivan Renesto
[email protected]
59
Come stampare una pagina web

Per effettuare una rapida stampa di una
pagina web è possibile utilizzare


Il pulsante
stampa sulla barra degli
strumenti standard
L’apposito comando da menu

Ivan Renesto
File  Stampa…
[email protected]
60
Le Pagine Web

All’interno di una pagina web è possibile
raggruppare ogni oggetto in 3 categorie:




Testo
Immagini
Oggetto multimediale (audio, video, …)
Ognuno di questi oggetti può essere a sua
volta:


un link
un semplice oggetto (non link)
Ivan Renesto
[email protected]
61
Pagine Web: link


Un link è un collegamento
Sopra i link il puntatore del mouse da freccia
diventa una mano con un dito pronto a premere


Ad ogni link è associata una determinata
pagina web
Cliccare su un link equivale a scrivere l’URL della
pagina web associata nella barra indirizzo del
browser, ed avviare la richiesta di visualizzazione
Ivan Renesto
[email protected]
62
Una Pagina Web
Link alla sezione
Link alla sezione
news high tech
sport deldel quotidiano
Link ad una delle
quotidiano
la
la
stampa
Link alla pagina web
novità del giorno:
stampa
relativa alle
Cyberlibri
Cronache
italiane
Ivan Renesto
[email protected]
63
Motori di ricerca



Errare anche di un solo carattere l’URL
di una pagina web comporta
l’impossibilità di visualizzarla
Nessuno conosce gli indirizzi di tutti i siti
esistenti
È impensabile riuscire a ricordare a
distanza di tempo l’indirizzo di un sito
visitato sporadicamente
Ivan Renesto
[email protected]
64
Motori di ricerca


Per risolvere le problematiche appena viste
sono stati creati i motori di ricerca
Sono siti aventi la funzione di:




Accettare in input criteri di ricerca
Ricercare pagine web che soddisfino tali
criteri
Esporre un elenco delle pagine web trovate
Consentire rapido accesso ad ognuna di esse
Ivan Renesto
[email protected]
65
Motori di ricerca: esempi

Esistono diversi motori di ricerca


http://www.google.it
http://www.altavista.it


ora diventato http://it.altavista.com
http://www.virgilio.it

Ivan Renesto
Più precisamente
http://www.virgilio.it/home/index.html
[email protected]
66
www.google.it
Casella di inserimento dei criteri
Pulsante di ricerca
Ogni motore di ricerca ne possiede una, ed
al suo interno è possibile specificare una o
Sempre
più parole che determinino un criterio
di presente, serve per avviare
la ricerca sul web
ricerca per le pagine web
Ivan Renesto
[email protected]
67
Criteri di ricerca

Specificando come criterio di ricerca:

una parola singola


il motore di ricerca troverà tutte le pagine web
che contengono tale parola
più parole



Ivan Renesto
il motore di ricerca troverà inizialmente tutte le
pagine web che contengono tutte le parole
poi troverà quelle che ne contengono solo
alcune
non si terrà conto dell’ordine delle parole
specificato nel criterio di ricerca
[email protected]
68
Criteri di ricerca

Specificando come criterio di ricerca:

più parole racchiuse tra doppi apici


Verranno trovate solo le pagine web che
contengono tutte le parole specificate,
esattamente nell’ordine in cui sono state
inserite
È possibile usare operatori logici per
ottenere criteri di ricerca complessi
Ivan Renesto
[email protected]
69
Criteri di ricerca: operatori


Usando gli operatori + e –, è possibile
specificare quali parole devono far parte
del risultato di una ricerca e quali no.
Esempio:

Ristorante + Piemonte – Asti

Ivan Renesto
Verranno trovate tutte le pagine web in cui si
parla di un ristorante, in Piemonte, ma non
ad Asti
[email protected]
70
Criteri di ricerca: attenzione





Non tutti i motori di ricerca supportano gli
stessi operatori
Inserendo caratteri minuscoli il motore di
ricerca estenderà il criterio anche ai maiuscoli
Inserendo caratteri maiuscoli non verranno
considerati i caratteri minuscoli
È possibile utilizzare il carattere jolly: *
Alcuni caratteri speciali: virgole, trattini, slash,
ecc… spesso non vengono considerati dai
motori di ricerca
Ivan Renesto
[email protected]
71
Criteri di ricerca: esempio 1

A B

Vengono trovate tutte le pagine web che
contengono:




Ivan Renesto
A, B
B, A
A
B
[email protected]
72
Criteri di ricerca: esempio 2

A+B

Vengono trovate tutte le pagine web che
contengono:



A, B
B, A
Può essere trovata anche una pagina web
che contiene solo A, o solo B?

Ivan Renesto
No! L’operatore + indica che le parole da esso
legate debbano essere presenti entrambe
all’interno di una pagina web
[email protected]
73
Criteri di ricerca: esempio 3

A+B+C

Il motore di ricerca visualizzerà il link di
pagine che contengono:

A, B


B, A, C


Si! Perché l’ordine non conta
C, A, B, D, F, Z

Ivan Renesto
No! Perché manca C
Si! Perché l’importante è che siano presenti le parole
specificate nel criterio di ricerca
[email protected]
74
Criteri di ricerca: esempio 4

A B+C

Verranno trovate tutte le pagine web che
contengono:




Ivan Renesto
A, B, C
A, C
B, C
C
in un qualsiasi ordine
in un qualsiasi ordine
in un qualsiasi ordine
[email protected]
75
Criteri di ricerca: esempio 5

“A B” + C D

Verranno trovate tutte le pagine web che
contengono:





Ivan Renesto
A B, C, D
A B, C
C, A B, D
C, D, A B
D, C, A B
[email protected]
76
Criteri di ricerca: esercizio

Scrivere un criterio di ricerca affinché:


Vengano trovati siti che trattano di
ristoranti italiani a New York, in cui
però non si cucini pesce
Soluzione:


ristorant* + italian* + “New York” – pesce
Ristorante + italiano + “New York” AND
NOT pesce
Ivan Renesto
[email protected]
77
Operatori Logici

OR


AND


La ricerca avviene su almeno una delle parole
indicate
La ricerca avviene su tutte le parole indicate
AND NOT

La ricerca avviene includendo la prima parola ed
escludendo la seconda
Ivan Renesto
[email protected]
78
Risultato di una ricerca
Criterio
Breve descrizione del
utilizzato
Risultati
della
Indirizzo
precisocontenuto
della pagina
del sito
trovato:
nellatrovata,
ricerca con
Link
per accedere
ricerca
web
leindicazione
parole
chiave
del criterio
Primo
direttamente
al sito
delevidenziate
vengono
rispetto
risultatodella dimensione
documento
le altre
Secondo
risultato
Terzo
risultato
Ivan Renesto
[email protected]
79
Strumento Preferiti



Tale strumento permette di creare
segnalibri
Un segnalibro (o bookmark) consiste in
un sistema per memorizzare l’indirizzo
di una pagina web
Generalmente è utile fissare in
bookmark gli esiti più interessanti delle
nostre ricerche o delle navigazioni
Ivan Renesto
[email protected]
80
Preferiti

È possibile accedere a questo strumento
mediante:


il menu Preferiti, dalla barra dei menu
il pulsante Preferiti
dalla barra degli
strumenti standard
Ivan Renesto
[email protected]
81
Preferiti: il menu

Il menu Preferiti si può
suddividere in due parti:

Aggiungi a Preferiti…
parte superiore


Sezione superiore del
menu Preferiti
ove gestire la creazione, la
cancellazione
e laPreferiti…
strutturazione
Organizza
dei bookmark
parte inferiore

ove accedere direttamente ai
siti relativi ai link memorizzati
Sezione inferiore del
menu Preferiti
Ivan Renesto
[email protected]
82
Preferiti: pulsante
Preferiti


Il pulsante Preferiti
attiverà il riquadro
Aggiungi…
Preferiti a sinistra
all’interno della finestra.
Le funzionalità del
riquadro Preferiti sono
lo stesse di quelle offerte
dal menu omonimo
Ivan Renesto
[email protected]
Organizza…
83
La Posta
Funzionamento del meccanismo
postale via Internet e gestione
della posta
Ivan Renesto
[email protected]
84
La posta: invio
Invio di una mail
5 MB
Casella di
posta
Steve Red
[email protected]
X
Mail box
2,5 MB
[email protected]
Ivan Renesto
[email protected]
Luigi Bianchi
85
La posta: ricezione
Ricezione delle mail
5 MB
Casella di
posta
Steve Red
[email protected]
Richiesta all’ISP presso il quale
Possediamo una casella di posta
Mail box
2,5 MB
[email protected]
La posta viene trasferita dalla casella
postale (mail box) remota al disco locale
dell’elaboratore
Ivan Renesto
[email protected]
Luigi Bianchi
86
Creare un nuovo messaggio
OutlookPosta ricevuta
Ivan Renesto
[email protected]
87
Nuovo messaggio
Indirizzo del destinatario
Indirizzo di ulteriori destinatari
Oggetto del messaggio
(identificherà la mail insieme al destinatario)
Accoderà il messaggio in attesa
di invio
Barra di Formattazione
del testo del messaggio
Corpo del messaggio
Ivan Renesto
[email protected]
88
Allegati
Consente di allegare un file
alla mail, come utilizzando
il menù Inserisci  Allegato…
Ivan Renesto
[email protected]
89
Allegati
Selezione del file da allegare
Ivan Renesto
Allega il file selezionato
[email protected]
90
Allegati
Elenco dei file allegati
Ivan Renesto
[email protected]
91
Allegati
La mail scritta viene temporaneamente depositata
nella cartella “Posta in uscita”, in attesa di essere
effettivamente inviata, e depositata in “Posta inviata”,
dove risiederà una copia di ogni mail inviata.
Per inviare effettivamente una mail premere il
pulsante “Invia/Ricevi”
Ivan Renesto
[email protected]
92
Leggere e-mail
Per leggere una e-mail ricevuta occorre
eseguire un doppio click sulla e-mail
Ivan Renesto
[email protected]
93
HTML
Introduzione al linguaggio
Ivan Renesto
[email protected]
94
Corso base di HTML

Testi e Riferimenti

Manuali on-line

HTML 4 for Dummies


Esempi ed esercizi forniti dal
docente



XML: La Guida Completa


Lingua italiana
Autori: Heather Williamson
Ivan Renesto
Lingua inglese
Autori: Ed Tittel, Natanya Pitts
HTML & XHTML: The
Definitive Guide


Lingua inglese
Autori: Chuck Musciano, Bill
Kennedy
[email protected]
95
Creare una pagina Web

Strumenti di lavoro

Browser:





Netscape Navigator
Opera
Microsoft Explorer
…
Editor





Ivan Renesto
(HTML)
NotePad
NoteTab Light
Arachnophilia
Macromedia DreamWeaver
…
[email protected]
96
Creare un Hyper Text

Un Hyper Text è un semplice
documento web, per creare il quale, per
semplicità si potrà utilizzare il NotePad
di Windows


Start > Programmi > Accessori > Blocco Note
Il linguaggio di programmazione che si
utilizzerà sarà: HTML

Hyper Text Mark-up Language
Ivan Renesto
[email protected]
97
Avvio del Blocco Note
Ivan Renesto
[email protected]
98
Salvare Documenti Web
Ivan Renesto
[email protected]
99
Salvare Documenti Web
Ivan Renesto
[email protected]
100
Salvare le modifiche ad un
Documento Web
• Si seleziona il menù File
• Si seleziona il comando Salva
Ivan Renesto
[email protected]
101
Area di Lavoro: Work Space
Ivan Renesto
[email protected]
102
HTML

TAG fondamentali

<html> </html>


<title> </title>


Consentono di delimitare l’inizio e la fine di un
documento web
Ci consentono di dare un titolo ad un documento web
<body> </body>

Ivan Renesto
Al loro interno dovrà essere racchiuso il contenuto della
pagina web
[email protected]
103
HTML: TAG fondamentali
Documento
Codice HTML
Web
associato
visualizzato
ad una
dal
semplice
browser
pagina
Microsoft
web diExplorer
benvenuto
Ivan Renesto
[email protected]
104
HTML: TAG Fondamentali

Ulteriori TAG di fondamentale utilizzo sono
quelli che trattano della formattazione del
testo:

<h1> </h1>


<br/>


Formattazione rapida di titoli
Forza il browser ad andare a capo nella visualizzazione
del testo
<font> </font>

Ivan Renesto
Determina la formattazione dei caratteri
[email protected]
105
TAG: <h1>




Il testo contenuto tra i tag <h1> e </h1>
verrà formattato con le caratteristiche di un
titolo di primo livello
<h2> </h2> sono usati per i titoli di
secondo livello
…
<h6> </h6> sono usati per i titoli di sesto
livello
Ivan Renesto
[email protected]
106
TAG: <br/>

Il tag <br/> serve per dire al browser di
forzare la visualizzazione a capo di una
sequenza di caratteri

Es.:
<h1>Tecnico di Produzione<br/>
grafica per Internet</h1>
Ivan Renesto
[email protected]
107
Proprietà di un TAG

I tag:



Possiedono un nome
Sono racchiusi tra parentesi angolari: < >
Possono avere un rispettivo tag di
chiusura:



<html> … </html>
<br/>
tag con rispettiva chiusura
tag vuoto
Possono possedere delle proprietà
Ivan Renesto
[email protected]
108
Proprietà di un TAG
<nome_tag proprietà=“valore_proprietà”>

Un tag può avere al suo interno una o
più proprietà, con relativo valore
associato, che descrivono caratteristiche
aggiuntive che il contenuto dei tag:
<nome_tag> </nome_tag> dovrà
avere
Ivan Renesto
[email protected]
109
TAG: <font>

<font>




size
color
face
dimensione del font
colore del font
stile del font
</font>
Ivan Renesto
[email protected]
110
Esempi di uso dei TAG
Ivan Renesto
[email protected]
111
TAGs:

<tt>


Italic Text
<b>


Teletype Text
(monospaced text)
<i>


<tt>, <i>, <b>, <big>, <small>

<u>


<big>


Big Text
<small>

Bold Text
Underlined Text
Small Text
<s>

Stroke Text
Ivan Renesto
[email protected]
112
TAGs: Formattazione testo
Ivan Renesto
[email protected]
113
CSS: Fogli di Stile


I fogli di stile (Cascading Style Sheets)
consentono di impostare le proprietà di
formattazione per tutto il documento
web
I fogli di stile possono essere:


Definiti internamente al documento
Definiti esternamente in un apposito file
Ivan Renesto
[email protected]
114
CSS: definizione interna

Avviene mediante il tag <style>

Esempio:
<style type=“text/css”>
…
</style>
Ivan Renesto
[email protected]
115
CSS: definizione esterna

Nella documento web, all’interno del
tag <head> si inserirà il tag <link>

Esempio:
<link rel=“stylesheet” type=“text/css”
href=“styles.css”>
Collegamento ad un
oggetto esterno alla
pagina web
Ivan Renesto
Tipo di oggetto
esterno
Nome del file che
rappresenterà il foglio
di stile
[email protected]
116
CSS: foglio di stile

Istruzione CSS di base:

selettore { proprietà: valore }



Ivan Renesto
selettore: è l’identificatore di uno o più elementi
proprietà: nome di una delle proprietà CSS predefinite
valore: uno dei valori predefiniti per la specifica proprietà
[email protected]
117
CSS: foglio di stile

Sintassi corretta per un blocco di
dichiarazioni:
selettore {
proprietà1: valore;
proprietà2: valore;
…
proprietàn: valore
}
Ivan Renesto
[email protected]
118
CSS: foglio di stile
1. Scrittura pagina web
2. Definizione foglio di stile
Ivan Renesto
[email protected]
119
CSS: foglio di stile

Proprietà di formattazione e
allineamento del testo:






font-family
font-size
font-weight
font-style
text-align
text-indent
Ivan Renesto
[email protected]
120
CSS: font-family

Valori possibili:





“Times New Roman”
“Arial”
“serif”
“fantasy”
…
Ivan Renesto
[email protected]
121
CSS: font-size

Possibili valori
assoluti:








xx-small
x-small
small
medium
large
x-large
xx-large
Ivan Renesto
Possibili valori
relativi:


[email protected]
larger
smaller
122
CSS: font-weight




Normal
Bold
Bolder
lighter









Ivan Renesto
[email protected]
100
200
300
400
500
600
700
800
900
123
CSS: font-style

Possibili valori:



normal
italic
oblique
Ivan Renesto
[email protected]
124
CSS: text-align

Valori possibili:




left
right
center
justify
Ivan Renesto
[email protected]
125
CSS: text-indent

Indentazione del testo esprimibile come
lunghezza:



“.5in”
“15px”
Indentazione esprimibile come
percentuale:

“10%”
Ivan Renesto
[email protected]
126
CSS: esempio

1. Creazione documento web


2. Creazione foglio di stile


css2.htm
css2.css
3. Visualizzazione mediante il browser
Ivan Renesto
[email protected]
127
Ivan Renesto
[email protected]
128
Ivan Renesto
[email protected]
129
Ivan Renesto
[email protected]
130
Tabelle

Una tabella è definita da un apposito
tag:

<table>


… contenuto della tabella …
</table>
Ivan Renesto
[email protected]
131
Tabelle

Una tabella si compone di:



Righe (rows)
Colonne (columns)
I tag che definiscono questi due elementi
sono:

per le righe:


<tr> … </tr>
per le colonne:


Ivan Renesto
<td> … </td>
<th> … </th>
[email protected]
132
Tabelle: <table>


Il tag <table> definisce l’inizio di una tabella
Tale tag può avere degli attributi:



align

Che definisce l’allineamento della tabella nel documento

Che determina la larghezza della tabella
width
bgcolor


border


Consente di applicare un colore di sfondo alla tabella
Permette di applicare un bordo di spessore specificabile alla
tabella
cellspacing/cellpadding

Ivan Renesto
Determinano i margini delle celle
[email protected]
133
<table>: align

I valori possibili di questo tag
(deprecato) sono:

left


right


Allineamento a sinistra
Allineamento a destra
center

Ivan Renesto
Allineamento centrato
[email protected]
134
<table>: width


Esprime la larghezza della tabella
Il valore di questo attributo può essere,
ad esempio, espresso in forma relativa
(rispetto lo spazio disponibile all’interno
della pagina) mediante una
percentuale:

Es.: width=“80%”
Ivan Renesto
[email protected]
135
<table>: bgcolor

Ci consente di esprimere un colore di
sfondo per la tabella:


Es.: bgcolor=“orange”
Es.: bgcolor=“#44F31A”
Ivan Renesto
[email protected]
136
<table>: border

Permette di definire uno specifico
spessore per i bordi delle tabelle:

Es.:




Ivan Renesto
border=“0”
border=“1”
border=“2”
…
(nessun bordo)
[email protected]
137
Tabelle: <tr>, <td>, <th>

All’interno di una tabella occorrerà sempre
definire:



1. Una riga
2. Una colonna
3. Vuoi definire un’altra colonna?



SI:
NO:
torna al passo 2
prosegui al passo 4
4. Vuoi ridefinire un’altra riga?


Ivan Renesto
SI:
NO:
torna al passo 1
fine definizione del contenuto della tabella
[email protected]
138
Tabelle: <tr>, <td>, <th>

1.1 inizio definizione riga


2.1 inizio definizione colonna


<td>, oppure <th>
3.1 fine definizione colonna


<tr>
</td>, oppure </th>
4.1 fine definizione riga

</tr>
Ivan Renesto
[email protected]
139
Tabelle: <tr>, <td>, <th>

Applicando la sequenza di passi
(algoritmo) descritto in precedenza,
sarà possibile definire il contenuto di
una semplice tabella
Ivan Renesto
[email protected]
140
Tabelle: Esempio di codice HTML
<table>
<tr>
<td> Cella 1 </td>
<!– Prima riga, prima colonna ->
<td> Cella 2 </td>
<!– Prima riga, seconda colonna ->
<td> Cella 3 </td>
<!– Seconda riga, prima colonna ->
<td> Cella 4 </td>
<!– Seconda riga, seconda colonna ->
</tr>
<tr>
</tr>
</table>
Ivan Renesto
[email protected]
141
Tabelle: titolo

E’ possibile dare un titolo ad una tabella
usando il tag: <caption>

Es.:
<table>
<caption><em>My Table</em></caption>
…
</table>
Ivan Renesto
[email protected]
142
Tabelle: span

E’ possibile definire uno “span” su:

righe:

Mediante l’attributo rowspan


Consente ad una riga di spandersi sulla superficie di più
righe
 Es.: <tr rowspan=“2”> … </td>
colonne:

Mediante l’attributo colspan

Ivan Renesto
Consente ad una colonna di spandersi sulla superficie di
più colonne
 Es.: <td colspan=“3”> … </td>
[email protected]
143
Tabelle: esempio
Ivan Renesto
[email protected]
144
LINK





Collegamento Iper-Testuale
Consente di passare da un documento ad un
altro
Un link è associato univocamente all’URL di
una precisa risorsa
Una risorsa può avere più link al proprio URL
La relazione:


Link – Risorsa
è del tipo:

Ivan Renesto
molti - uno
[email protected]
145
LINK

Il tag per creare un link ad una risorsa
è: <a>

Es.:
<a href=“X.htm”>
questo è un link al documento X.htm
</a>
Ivan Renesto
[email protected]
146
LINK: proprietà

Un link ha una proprietà di
fondamentale importanza che è:


href
Tale proprietà permette di specificare il
percorso, locale, o remoto, relativo o
assoluto, ove trovare la specifica risorsa
associata al link
Ivan Renesto
[email protected]
147
LINK: contenuto

Un link può essere rappresentato da:

Testo


Immagini



<a href=“X.htm”> Questo è un link testuale </a>
<a href=“X.htm”> <img src=“immagine.gif”/> </a>
Il corpo del link sarà quindi rappresentato da ciò
che inseriremo all’interno dei tag <a> … </a>
Il corpo del link sarà ciò su cui l’utente dovrà
cliccare per visualizzare il documento associato
(nell’esempio: X.htm)
Ivan Renesto
[email protected]
148
LINK: esempio

Creazione di un documento chiamato:


Creazione di un documento chiamato:


pagina1.htm
pagina2.htm
Creazione dei link che collegano
entrambi i documenti è che permettono
di passare dall’uno all’altro
Ivan Renesto
[email protected]
149
LINK: esempio
Ivan Renesto
[email protected]
150
FRAMES


Parti di documento che rappresentano
documenti indipendenti
Necessitano di duplice definizione:

Nell’insieme, mediante il tag:


<frameset>
Individualmente, mediante il tag:

Ivan Renesto
<frame>
[email protected]
151
FRAMES: frameset


<frameset> è il tag che ci permette di
definire un insieme di frame
Tra le sue proprietà troviamo:

cols:


Permette di definire la suddivisione del documento
principale per colonne
rows:

Ivan Renesto
Permette di definire la suddivisione del documento
principale per righe
[email protected]
152
FRAMES: frameset
<frameset cols=“110,*” …>
Il documento
Dimensione
saràDimensione
diviso
in in
pixel
duedella
tag che indica
le caratteristiche
frame,
larghezza
per COLONNE,
della
variabile
di
colonna
cui la (anche
dei frame,
nell’insieme,
che
prima andrà
dal pixelin0 percentuale)
al pixel
costituiranno
laesprimibile
pagina
110
Ivan Renesto
[email protected]
153
FRAMES: frameset
<frameset rows=“150,*” …>
La pagina viene suddivisa in due
frame orizzontali, per RIGHE, di
cui la prima, in altezza, va dal
pixel 0 al pixel 150
Ivan Renesto
[email protected]
154
FRAMES: frameset
<frameset cols=“110,*” rows=“150,*” …>
110
150
Ivan Renesto
[email protected]
155
FRAMES: frameset

Altre proprietà del tag <frameset>:
 frameborder



border


“YES”
“NO”
Es.: border=“0”
framespacing

Ivan Renesto
Es.: framespacing=“0”
[email protected]
156
FRAMES: frame

Dopo aver definito un frameset,
occorrerà definire i singoli frame e le
loro eventuali proprietà:

<frame>





name
src
scrolling
noresize
</frame>
Ivan Renesto
[email protected]
157
FRAMES: esempio
Ivan Renesto
[email protected]
158
Ivan Renesto
[email protected]
159
Ivan Renesto
[email protected]
160
Ivan Renesto
[email protected]
161
Ivan Renesto
[email protected]
162
Ivan Renesto
[email protected]
163
Ivan Renesto
[email protected]
164