Comments
Description
Transcript
lucidi - Renesto.it
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