Corso di Informatica ECDL

Presentazione sul tema: "Corso di Informatica ECDL"— Transcript della presentazione:

1 Corso di Informatica ECDL
Ivan Renesto Ivan Renesto

2 Libri di Testo Patente Europea del Computer Autori: Dameri, Foresti
VOLUME 1 VOLUME 2 Autori: Dameri, Foresti Jackson Libri Ivan Renesto

3 Modulo 7 Reti Informatiche
Volume II Studiare: da pag 192 a pag 273 Per iniziare ………………………………… 193 Navigazione nel Web ………………… Ricerca nel Web …………………………. 218 Segnalibri ………………………………… Posta elettronica: Per iniziare ………. 233 Ivan Renesto

4 Modulo 7 Reti Informatiche
Volume II Messaggi ………………………………… 241 Indirizzi …………………………………… 261 Gestione dei messaggi ……………… 268 Volume I Reti Informatiche …………………… Ivan Renesto

5 Indice Argomenti Reti Locali La rete delle reti File Transfer Protocol
Navigare in Internet La Posta Outlook HTML: introduzione al linguaggio Ivan Renesto

6 Una rete locale si sviluppa
Reti Locali (LAN) LAN: Local Area Network Una rete locale si sviluppa all’interno di spazi limitati “Un insieme di computer tra loro connessi” Mezzo trasmissivo utilizzato per interconnettere gli elaboratori Ivan Renesto

7 Mezzo trasmissivo condiviso
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) Terminatore (assorbe i segnali) Ivan Renesto

8 in entrambe le direzioni
Comunicazione Mitt. Dest. Indirizzo Computer mittente Computer destinatario Scambio di “pacchetti” a 2 da1 creazione a 2 da1 Messaggio a destinazione! 1 2 3 a 2 da1 x assorbimento a 2 da1 x assorbimento a 2 da1 Il segnale si propaga in entrambe le direzioni Il messaggio viene “scartato” dal computer 3, perché non destinato ad esso! Ivan Renesto

9 Comunicazione: protocolli
Protocollo: insieme di regole Tra i più usati nelle reti troviamo i protocolli TCP/IP 1 2 3 TCP/IP: astrattamente, consistono 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 Collisione di due pacchetti di dati Ivan Renesto

10 Suite di protocolli TCP/IP
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à Ethernet IP TCP HTTP Protocollo trasferimento Hyper Testi Transport Control Protocol Internet Protocol LIVELLO SOFTWARE LIVELLO HARDWARE Pagina web Informazioni aggiunte da ogni livello TCP Pagina web IP Pagina web TCP Pagina web TCP IP Ivan Renesto

11 Reti Locali a Stella Ivan Renesto ivan@renesto.it
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: HUB SWITCH Ivan Renesto

12 Comunicazione 1 2 6 X X 3 5 X X 4 HUB 1 Ivan Renesto ivan@renesto.it
E così via, ogni pacchetto, che l’hub riceve da un computer, viene ritrasmesso su tutti i collegamenti verso gli altri computer Il computer 1 inizia un trasferimento di file con il computer 3 2 1 3 4 5 6 X Il messaggio viene scartato X Il messaggio viene scartato HUB X X Il messaggio viene scartato Il messaggio giunge a destinazione! Il messaggio viene scartato 1 Ivan Renesto

13 Comunicazione 1 2 6 3 5 4 2 1 6 5 4 3 SWITCH a b c d e f a b c d e f
Link Computer a b c d e f 2 1 6 5 4 3 Lo switch, più intelligentemente, controllerà la destinazione del pacchetto e, grazie alla sua tabella di routing, lo smisterà unicamente sul link opportuno Ivan Renesto

14 La rete delle reti I nodi della rete
I dati viaggiano sulla rete sotto forma di pacchetti. Essi saranno caratterizzati da: indirizzo computer mittente indirizzo computer destinazione Internet: in modo astratto può essere visto come un insieme di collegamenti e nodi Consente a due o più computer remoti di mettersi in comunicazione I nodi della rete ISP (Internet Service Provider) Router Internet si appoggia molto sulla rete telefonica Ivan Renesto

15 Commutazione di pacchetto
Router ISP congestione Ivan Renesto

16 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

17 Indirizzi IP Livello di rete (IP: Internet Protocol)
Si occupa di trasmettere pacchetti dalla sorgente alla destinazione Ivan Renesto

18 Indirizzi IP Internet Sorgente Destinazione Indirizzo IP Indirizzo IP
Ivan Renesto

19 Indirizzi IP A . B . C . D 193.68.211.5 Numero tra 0 e 255
Ivan Renesto

20 Ognuno di questi numeri potrà assumere
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 2 8 = 256 Ognuno di questi numeri potrà assumere 256 valori: da 0 a 255 Ivan Renesto

21 Indirizzi IP Non tutti gli indirizzi IP possibili sono utilizzabili:
modem Internet Non tutti gli indirizzi IP possibili sono utilizzabili: alcuni sono privati 10.*.*.* (rete di classe A) *.* (rete di classe B) * (rete di classe C) Alcuni sono riservati ad uso speciale (default) (broadcast) … Un computer può avere più indirizzi IP. Uno per ogni interfaccia di rete: loopback ( ) Rete Locale ( ) Point to Point (…) Ivan Renesto

22 Nomi Simbolici http://www.lastampa.it/redazione/default.asp
Gli indirizzi numerici sono pratici da gestire in modo automatico, ma non lo sono dal punto di vista della memorizzazione umana Ad ogni indirizzo numerico può essere associato un nome simbolico Identifica un computer in rete Protocollo di comunicazione Identifica un percorso, espresso in termini assoluti, intendendo come radice del percorso una cartella condivisa del computer identificato dal nome precedente Nome del documento web da visualizzare Ivan Renesto

23 Nomi Simbolici: URL URL http://www.lastampa.it Estensione
Dominio Tipo di servizio: www (World Wide Web) Estensione Ivan Renesto

24 Protocolli Un protocollo costituisce un insieme di regole
I protocolli di rete sono un insieme di regole atti a garantire: 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) … Ivan Renesto

25 Protocolli di comunicazione
La suite di protocolli TCP/IP è definita “Paritetica” LVL 0 LVL 1 LVL 2 LVL 3 Ethernet IP TCP HTTP, FTP, … LAN, MAN, Internet, … Insieme di protocolli, tra i più usati nelle reti. Ivan Renesto

26 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

27 File Transfer Protocol
FTP File Transfer Protocol Ivan Renesto

28 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

29 FTP: Uso Due sono gli applicativi software necessari all’uso pratico di questo protocollo: FTP Server FTP Client Ivan Renesto

30 FTP: funzionamento FTP Client FTP Server Internet, LAN, … Passo 2:
Passo 2: Il computer che deve possedere un client FTP, testuale o con interfaccia grafica, tenta di collegarsi al computer Passo 3: Il computer deve possedere a sua volta un FTP Server attivo, per poter accettare connessioni da un qualsiasi FTP Client FTP Client Passo 4: Il computer (Client), prima di poter prelevare/inviare file da/verso il computer (Server), si dovrà prima identificare mediante autenticazione Passo 1: Il computer vuole trasferire file da/a il computer FTP Server Internet, LAN, … (una rete qualsiasi) Ivan Renesto

31 FTP: comandi Tra i comandi a disposizione, i più semplici ed utili sono: bin Per impostare un trasferimento di tipo “binario” cd Per cambiare directory get Per prelevare un oggetto put Per trasferire un oggetto dir Per visualizzare il contenuto della directory Ivan Renesto

32 FTP: Interfaccia testuale
help: listato dei comandi disponibili FTP: Interfaccia testuale help <comando>: descrizione del comando Ivan Renesto

33 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: computer> Ivan Renesto

34 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 è fatto corrispondere il nome simbolico grifo.olimpo Ivan Renesto

35 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

36 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

37 Web Browsing Navigare in Internet Ivan Renesto

38 Navigare in Internet Concetti fondamentali: Navigare Sito Pagina Web
Portale Server HTTP Client HTTP: Browser Ivan Renesto

39 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

40 Un sito Internet Un sito web è una collezione di documenti web
Tutti i documenti web del sito possono essere tra loro collegati, mediante link Una pagina web è un documento consultabile in internet tramite un browser Un portale è un sito che offre un punto d’accesso per molti e svariati servizi La prima pagina di ogni sito, per convenzione, dovrebbe chiamarsi: index.htm index.html .jsp .php I link sono collegamenti, impostati dal creatore della pagina web, cliccando sui quali è possibile navigare verso un successivo documento web Ivan Renesto

41 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 Credenziali: login e password Numero di telefono dell’ISP Ivan Renesto

42 Cosa succede HTTP Server
Connettersi equivale a fare una telefonata all’ISP Il tempo della telefonata sarà equivalente al tempo di connessione Router …Stabilisce una connessione col suo ISP … Se l’Internet Service Provider si trova ad Aberdeen (Scozia) la chiamata sarà internazionale!!! Il risparmio si trova nella scelta dell’ISP più vicino L’utente vorrebbe navigare in internet … Scambio di informazioni: MTU Login Password … ISP Ivan Renesto

43 Cosa succede: navigando
Messaggio di richiesta di visualizzazione del sito: Il computer in internet, che ospita il sito web richiesto e che risponde al nome prepara la prima pagina del suo sito e la spedisce in risposta alla richiesta ricevuta GET HTTP 1.1 Il messaggio ricevuto viene scartato, la pagina web in esso contenuta viene passata al browser che provvede a visualizzarla Ivan Renesto

44 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

45 Il Browser: Microsoft Explorer
Barra del titolo Il Browser: Microsoft Explorer File Pulsanti di controllo Modifica Visualizza Preferiti Strumenti Aiuto Barra dei menu Pagina Web Rappresentazione grafica di un documento internet così come il browser lo visualizza Barra degli strumenti: Standard Contenente i pulsanti per le funzioni più comunemente usate nella navigazione Barra degli strumenti: Indirizzo Nella casella di inserimento in questa barra potrà essere inserito l’indirizzo del sito da visualizzare Premendo [INVIO] si procederà all’invio della richiesta Cronologia Permette di visualizzare un elenco degli ultimi siti visitati in ordine cronologico, e di sceglierne uno Vai Pulsante che consente di inviare la richiesta di visualizzazione di un sito, il cui indirizzo è stato scritto nella casella di inserimento della stessa barra Ivan Renesto

46 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

47 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 Es.: Premendo il pulsante Pagina corrente per impostare nella casella l’indirizzo della pagina correntemente visualizzata dal browser Premendo sul pulsante Pagina predefinita per ripristinare la pagina preimpostata dal browser Premendo sul pulsante Pagina vuota (about:blank) per non far visualizzare alcuna pagina all’apertura del browser Ivan Renesto

48 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

49 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

50 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

51 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 Determinerà l’apertura di una sezione laterale sinistra all’interno della finestra del browser Ivan Renesto

52 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

53 Cronologia: scorrere la lista
Pulsante disattivato Indica che non è possibile scorrere la lista cronologica in avanti: ad esempio quando la lista è vuota, non avendo ancora visitato alcun sito, oppure quando si è in fondo alla lista È possibile scorrere la lista cronologica dei siti visitati con i pulsanti: 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

54 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

55 Caching: funzionamento
D. E. C. B. A. Zona del disco locale: Cache A B C D E Ivan Renesto

56 Caching: utilizzo dal browser
Digitando il nome del sito nella casella Indirizzo e premendo [INVIO] il browser si adopera per recuperare la pagina web richiesta e per visualizzarla GET B HTTP 1.1 Prima il browser controlla se la pagina web richiesta è presente nella cache Supponiamo ora l’utente voglia rivisitare il sito B Preparando un messaggio di richiesta, inviandolo e aspettando di ricevere in risposta la pagina web? Come? NO! A A B C D B E E D C Ivan Renesto

57 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

58 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

59 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

60 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 File  Stampa… Ivan Renesto

61 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

62 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

63 Una Pagina Web Link alla sezione news high tech del quotidiano
la stampa Link alla sezione sport del quotidiano la stampa Link ad una delle novità del giorno: Cyberlibri Link alla pagina web relativa alle Cronache italiane Ivan Renesto

64 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

65 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

66 Motori di ricerca: esempi
Esistono diversi motori di ricerca ora diventato Più precisamente Ivan Renesto

67 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 più parole che determinino un criterio di ricerca per le pagine web Pulsante di ricerca Sempre presente, serve per avviare la ricerca sul web Ivan Renesto

68 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 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 Ivan Renesto

69 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

70 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 Verranno trovate tutte le pagine web in cui si parla di un ristorante, in Piemonte, ma non ad Asti Ivan Renesto

71 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

72 Criteri di ricerca: esempio 1
A B Vengono trovate tutte le pagine web che contengono: A, B B, A A B Ivan Renesto

73 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? No! L’operatore + indica che le parole da esso legate debbano essere presenti entrambe all’interno di una pagina web Ivan Renesto

74 Criteri di ricerca: esempio 3
A + B + C Il motore di ricerca visualizzerà il link di pagine che contengono: A, B No! Perché manca C B, A, C Si! Perché l’ordine non conta C, A, B, D, F, Z Si! Perché l’importante è che siano presenti le parole specificate nel criterio di ricerca Ivan Renesto

75 Criteri di ricerca: esempio 4
A B + C Verranno trovate tutte le pagine web che contengono: A, B, C in un qualsiasi ordine A, C in un qualsiasi ordine B, C in un qualsiasi ordine C Ivan Renesto

76 Criteri di ricerca: esempio 5
“A B” + C D Verranno trovate tutte le pagine web che contengono: A B, C, D A B, C C, A B, D C, D, A B D, C, A B Ivan Renesto

77 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

78 Operatori Logici OR AND AND NOT
La ricerca avviene su almeno una delle parole indicate AND La ricerca avviene su tutte le parole indicate AND NOT La ricerca avviene includendo la prima parola ed escludendo la seconda Ivan Renesto

79 Risultato di una ricerca
Criterio utilizzato nella ricerca Breve descrizione del contenuto del sito trovato: le parole chiave del criterio vengono evidenziate rispetto le altre Risultati della ricerca Indirizzo preciso della pagina web trovata, con indicazione della dimensione del documento Link per accedere direttamente al sito Primo risultato Secondo risultato Terzo risultato Ivan Renesto

80 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

81 Preferiti È possibile accedere a questo strumento mediante:
il menu Preferiti, dalla barra dei menu il pulsante Preferiti dalla barra degli strumenti standard Ivan Renesto

82 Preferiti: il menu Il menu Preferiti si può suddividere in due parti:
Sezione superiore del menu Preferiti Il menu Preferiti si può suddividere in due parti: parte superiore ove gestire la creazione, la cancellazione e la strutturazione dei bookmark parte inferiore ove accedere direttamente ai siti relativi ai link memorizzati Aggiungi a Preferiti… Organizza Preferiti… Sezione inferiore del menu Preferiti Ivan Renesto

83 Preferiti: pulsante Preferiti Organizza… Aggiungi…
Il pulsante Preferiti attiverà il riquadro Preferiti a sinistra all’interno della finestra. Le funzionalità del riquadro Preferiti sono lo stesse di quelle offerte dal menu omonimo Aggiungi… Ivan Renesto

84 La Posta Funzionamento del meccanismo postale via Internet e gestione della posta Ivan Renesto

85 La posta: invio Invio di una mail Steve Red X Luigi Bianchi 5 MB
2,5 MB 5 MB Steve Red Luigi Bianchi Mail box Casella di posta X Ivan Renesto

86 La posta: ricezione Ricezione delle mail Steve Red Luigi Bianchi 5 MB
2,5 MB 5 MB Steve Red Luigi Bianchi Mail box Casella di posta Richiesta all’ISP presso il quale Possediamo una casella di posta La posta viene trasferita dalla casella postale (mail box) remota al disco locale dell’elaboratore Ivan Renesto

87 Outlook Creare un nuovo messaggio Posta ricevuta Ivan Renesto

88 (identificherà la mail insieme al destinatario)
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

89 Allegati Consente di allegare un file alla mail, come utilizzando
il menù Inserisci  Allegato… Ivan Renesto

90 Allegati Selezione del file da allegare Allega il file selezionato
Ivan Renesto

91 Allegati Elenco dei file allegati Ivan Renesto

92 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

93 Leggere e-mail Per leggere una e-mail ricevuta occorre
eseguire un doppio click sulla Ivan Renesto

94 Introduzione al linguaggio
HTML Introduzione al linguaggio Ivan Renesto

95 Corso base di HTML Testi e Riferimenti Manuali on-line
Esempi ed esercizi forniti dal docente XML: La Guida Completa Lingua italiana Autori: Heather Williamson HTML 4 for Dummies Lingua inglese Autori: Ed Tittel, Natanya Pitts HTML & XHTML: The Definitive Guide Autori: Chuck Musciano, Bill Kennedy Ivan Renesto

96 Creare una pagina Web Strumenti di lavoro Browser: Editor (HTML)
Netscape Navigator Opera Microsoft Explorer … Editor (HTML) NotePad NoteTab Light Arachnophilia Macromedia DreamWeaver Ivan Renesto

97 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

98 Avvio del Blocco Note Ivan Renesto

99 Salvare Documenti Web Ivan Renesto

100 Salvare Documenti Web Ivan Renesto

101 Salvare le modifiche ad un Documento Web
Si seleziona il menù File Si seleziona il comando Salva Ivan Renesto

102 Area di Lavoro: Work Space
Ivan Renesto

103 HTML TAG fondamentali <html> </html>
Consentono di delimitare l’inizio e la fine di un documento web <title> </title> Ci consentono di dare un titolo ad un documento web <body> </body> Al loro interno dovrà essere racchiuso il contenuto della pagina web Ivan Renesto

104 HTML: TAG fondamentali
Codice HTML associato ad una semplice pagina web di benvenuto Documento Web visualizzato dal browser Microsoft Explorer Ivan Renesto

105 HTML: TAG Fondamentali
Ulteriori TAG di fondamentale utilizzo sono quelli che trattano della formattazione del testo: <h1> </h1> Formattazione rapida di titoli <br/> Forza il browser ad andare a capo nella visualizzazione del testo <font> </font> Determina la formattazione dei caratteri Ivan Renesto

106 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

107 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

108 Proprietà di un TAG I tag: Possiedono un nome
Sono racchiusi tra parentesi angolari: < > Possono avere un rispettivo tag di chiusura: <html> … </html> tag con rispettiva chiusura <br/> tag vuoto Possono possedere delle proprietà Ivan Renesto

109 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

110 TAG: <font> <font> </font> size dimensione del font
color colore del font face stile del font </font> Ivan Renesto

111 Esempi di uso dei TAG Ivan Renesto

112 TAGs: <tt>, <i>, <b>, <big>, <small>
Teletype Text (monospaced text) <i> Italic Text <b> Bold Text <s> Stroke Text <u> Underlined Text <big> Big Text <small> Small Text Ivan Renesto

113 TAGs: Formattazione testo
Ivan Renesto

114 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

115 CSS: definizione interna
Avviene mediante il tag <style> Esempio: <style type=“text/css”> … </style> Ivan Renesto

116 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 Tipo di oggetto esterno Nome del file che rappresenterà il foglio di stile Ivan Renesto

117 CSS: foglio di stile Istruzione CSS di base:
selettore { proprietà: valore } 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à Ivan Renesto

118 CSS: foglio di stile Sintassi corretta per un blocco di dichiarazioni:
selettore { proprietà1: valore; proprietà2: valore; … proprietàn: valore } Ivan Renesto

119 CSS: foglio di stile 1. Scrittura pagina web
2. Definizione foglio di stile Ivan Renesto

120 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

121 CSS: font-family Valori possibili: “Times New Roman” “Arial” “serif”
“fantasy” … Ivan Renesto

122 CSS: font-size Possibili valori assoluti: Possibili valori relativi:
xx-small x-small small medium large x-large xx-large Possibili valori relativi: larger smaller Ivan Renesto

123 CSS: font-weight Normal Bold Bolder lighter 100 200 300 400 500 600
700 800 900 Ivan Renesto

124 CSS: font-style Possibili valori: normal italic oblique Ivan Renesto

125 CSS: text-align Valori possibili: left right center justify
Ivan Renesto

126 CSS: text-indent Indentazione del testo esprimibile come lunghezza:
“15px” Indentazione esprimibile come percentuale: “10%” Ivan Renesto

127 CSS: esempio 1. Creazione documento web 2. Creazione foglio di stile
css2.htm 2. Creazione foglio di stile css2.css 3. Visualizzazione mediante il browser Ivan Renesto

128 Ivan Renesto

129 Ivan Renesto

130 Ivan Renesto

131 Tabelle Una tabella è definita da un apposito tag: <table>
… contenuto della tabella … </table> Ivan Renesto

132 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: <td> … </td> <th> … </th> Ivan Renesto

133 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 width Che determina la larghezza della tabella bgcolor Consente di applicare un colore di sfondo alla tabella border Permette di applicare un bordo di spessore specificabile alla tabella cellspacing/cellpadding Determinano i margini delle celle Ivan Renesto

134 <table>: align I valori possibili di questo tag (deprecato) sono: left Allineamento a sinistra right Allineamento a destra center Allineamento centrato Ivan Renesto

135 <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

136 <table>: bgcolor
Ci consente di esprimere un colore di sfondo per la tabella: Es.: bgcolor=“orange” Es.: bgcolor=“#44F31A” Ivan Renesto

137 <table>: border
Permette di definire uno specifico spessore per i bordi delle tabelle: Es.: border=“0” (nessun bordo) border=“1” border=“2” … Ivan Renesto

138 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: torna al passo 2 NO: prosegui al passo 4 4. Vuoi ridefinire un’altra riga? SI: torna al passo 1 NO: fine definizione del contenuto della tabella Ivan Renesto

139 Tabelle: <tr>, <td>, <th>
1.1 inizio definizione riga <tr> 2.1 inizio definizione colonna <td>, oppure <th> 3.1 fine definizione colonna </td>, oppure </th> 4.1 fine definizione riga </tr> Ivan Renesto

140 Tabelle: <tr>, <td>, <th>
Applicando la sequenza di passi (algoritmo) descritto in precedenza, sarà possibile definire il contenuto di una semplice tabella Ivan Renesto

141 Tabelle: Esempio di codice HTML
<table> <tr> <td> Cella 1 </td> <!– Prima riga, prima colonna -> <td> Cella 2 </td> <!– Prima riga, seconda colonna -> </tr> <td> Cella 3 </td> <!– Seconda riga, prima colonna -> <td> Cella 4 </td> <!– Seconda riga, seconda colonna -> </table> Ivan Renesto

142 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

143 Tabelle: span E’ possibile definire uno “span” su: righe: colonne:
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 Consente ad una colonna di spandersi sulla superficie di più colonne Es.: <td colspan=“3”> … </td> Ivan Renesto

144 Tabelle: esempio Ivan Renesto

145 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: molti - uno Ivan Renesto

146 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

147 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

148 LINK: contenuto Un link può essere rappresentato da:
Testo <a href=“X.htm”> Questo è un link testuale </a> Immagini <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

149 LINK: esempio 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

150 LINK: esempio Ivan Renesto

151 FRAMES Parti di documento che rappresentano documenti indipendenti
Necessitano di duplice definizione: Nell’insieme, mediante il tag: <frameset> Individualmente, mediante il tag: <frame> Ivan Renesto

152 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: Permette di definire la suddivisione del documento principale per righe Ivan Renesto

153 FRAMES: frameset <frameset cols=“110,*” …>
Il documento sarà diviso in due frame, per COLONNE, di cui la prima andrà dal pixel 0 al pixel 110 Dimensione in pixel della larghezza della colonna (anche esprimibile in percentuale) Dimensione variabile tag che indica le caratteristiche dei frame, nell’insieme, che costituiranno la pagina <frameset cols=“110,*” …> Ivan Renesto

154 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 <frameset rows=“150,*” …> Ivan Renesto

155 FRAMES: frameset <frameset cols=“110,*” rows=“150,*” …>
Ivan Renesto

156 FRAMES: frameset Altre proprietà del tag <frameset>: frameborder
“YES” “NO” border Es.: border=“0” framespacing Es.: framespacing=“0” Ivan Renesto

157 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

158 FRAMES: esempio Ivan Renesto

159 Ivan Renesto

160 Ivan Renesto

161 Ivan Renesto

162 Ivan Renesto

163 Ivan Renesto

164 Ivan Renesto