1) Costruisci una cartella personale in cui copiare i file contenuti nella cartella UNO: seleziona i file, aziona Copy/Copia e poi, nella tua cartella, Paste/Incolla; non trascinare i file, se no li cancelli dalla sede originale. In questo primo incontro prenderemo confidenza con alcuni dei principali formati di file che si possono usare in "Internet" e con alcuni modi per aprire o scaricare file. Ci riferiremo essenzialmente a Windows. In Mac vi sono piccole differenze (ad es. al posto dell'uso del pulsante destro del mouse vi tiene pressato il pulsante per qualche istante in più; invece di BloccoNote si usa un altro editor di testi; …).

2) Esamina il contenuto della cartella e i file in essa contenuti. Scegli dal menu a cascata l'opzione "visualizza i dettagli", in modo da poter esaminare le dimensioni dei file. Se non vedi le dimensioni dei file, usando il menu a cascata cerca di aprire la finestra di dialogo che ti consente di scegliere i dettagli da visualizzare e attiva la visualizzazione delle dimensioni, ed, eventualmente, disattiva visualizzazioni che non ti interessano.

3) Controlla che si vedano le estensioni di tutti i file, ossia che i nomi dei file vengano visulizzati come "macosa.txt", "macosa.doc", …. È assai utile che sia attivata questa visualizzazione in quanto potrebbe accadere che un file appia con una estensione mentre ne abbia due di cui una nascosta; la cosa può creare vari problemi, dei quali non ci si rende conto subito. Se l'opzione non è attivata cerca di farlo operando sul PannelloDiControllo (puoi accedervi dal menu Start/Avvia, in genere in basso a sinistra).
Occorre arrivare alle OpzioniCartella (non è detto che ci si arrivi direttamente, dipende da come è impostato il sistema operativo; potrebbe essere necessario passare attraverso una cartella più generale del tipo OpzioniDiVisualizzazione). Ciò che si deve fare è togliere con un clic il segno di spunta dal box NascondiEstensioni. 

4) I file di nome "macosa" sono tutti testi formati dalla sola parola "macosa", ma salvati in formati diversi, e occupano diversi spazi di memoria; apri ad esempio il file Macosa.txt (dovrebbe aprirsi automaticamente con NotePad/BloccoNote o un altro Editor di testi; se così non accadesse clicca col pulsante destro, scegli ApriCon e seleziona BloccoNote o un altro editor; l'applicazione con cui aprire un file di data estensione in Windows è stabilito nelle Opzioni sui TipiDiFile attivabili dal menu OpzioniCartella, di cui abbiamo parlato sopra; in Mac, invece, i file, al di là della loro estensione, contengono al loro interno una codifica della applicazione con cui vengono automaticamente aperti). Le dimensioni della memoria occupata sono indicate in K (per informazioni su chilobyte, byte, codice ASCII vedi Gli Oggetti Matematici, indice alfabetico). 
Se col pulsante destro clicchi su Macosa.txt e visualizzi Proprietà puoi esaminare per esteso le dimensioni: 1 K è un'approssimazione; in realtà sono solo 6 B (6 byte, il necessario per memorizzare i 6 caratteri che formano il nome "macosa"); lo spazio occupato su disco è maggiore: dipende dalla formattazione del disco, dal modo e dalla disposizione spaziale con cui è stato archiviato il complesso dei dati, e può variare da computer a computer (in alcuni casi la dimensione minima è 1024 B, in altri 4096 B, …); se spedisco il file per e-mail o se lo scarico da Internet, ciò che viaggia sono solo 6 byte. Macosa.doc occupa uno spazio pari a circa 8mila/6 = 1300 volte quello occupato da Macosa.txt. Ciò spiega perché è assurdo inviare documenti word per scrivere solo poche righe di testo (o impostare il proprio programma di posta per inviare messaggi in formati strani): spreco di tempo e memoria, ingombro del traffico sulla rete, … e possibiltà di inviare virus nascosti in mezzo ai tanti byte di informazioni varie che word, e altre applicazioni per elaborare testi, estraggono automaticamente dal PC e inseriscono nel file, senza che l'utente se ne accorga.
Il documento in formato htm occupa anch'esso 6 B, mentre quello in rtf ne occupa qualche centinaia.

5) Le diverse estensioni corrispondono a diversi formati. "txt" è il formato SoloTesto, senza formattazioni, che impiega 1 B per carattere."doc" è per i documenti di Word; in realtà non rappresenta un unico formato: a seconda delle versione utilizzata, dal sistema opetativo, ... può accadere che un documento non si riesca a leggerlo come lo vedeva chi lo ha creato, o che non si riesca a leggerlo per niente. "rtf" (Rich Text Format) è un formato sviluppato per l'interscambio tra applicazioni diverse di file di testo con formattazioni (di caratteri, paragrafi, …); produce tuttavia file di dimensioni relativamente grandi. "sxw" è la forma compressa di un formato xml (eXtensible Markup Language), standard linguistico fissato da convenzioni internazionali, che usa OpenOffice (e StarOffice) della Sun, applicazione Office gratuita, multipiattaforma (e per vari aspetti più affidabile dell'Office di Microstf, con la quale riesce comunque a scambiare documenti). "pdf" (Portable Document Format) indica che il file è in formato Acrobat, un'applicazione per la produzione (e la lettura) di tutti i file in un formato che contiene tutte le formattazioni impiegate nella stampa (Acrobat memorizza i file come verrebbero inviati alla stampante: posso così generare documenti che si possono leggere e stampare anche senza disporre della applicazione che li ha generati nella forma originale; OpenOffice può produrre direttamente file anche in questo formato); si tratta di un formato spesso utilizzato per diffondere su Internet moduli, manuali, …; è comodo per la stampa, meno per la lettura. "htm" è il formato Html; su di esso ci soffermeremo più avanti.

6) Prova ad aprire i diversi file usando un browser (InternetExplorer, Netscape, …): apri l'applicazione e usa Open/Apri dal suo menu File (oppure trascina l'icona di uno di questi documenti su quella del browser). Se azionato Apri e posizionatoti sulla cartella giusta non vedi i file, seleziona AllFiles/TuttiIFile nel box "Tipi di file" (vedi figura a lato).
Che cosa accade?
Vedrai che essi, tranne Macosa.htm ed eventualmente Macosa.txt, verranno aperti non direttamente dal browser ma tramite un'altra applicazione (Word, OpenOffice, Acrobat, …); se ciò non accade vi chiederà se volete cercare sul computer (ed eventualmente in rete) una applicazione con cui aprirli. In pratica il Browser "ospita" nella sua finestra l'applicazione che serve per aprire il documento, a volte modificandone leggermente barre e menu a cascata.
 

7) Riposizionati sulla cartella contenente i file "macosa.…" e prova ad aprirli con BloccoNote, in modo da esaminare che cosa sono i caratteri che formano i byte di memoria dei vari file. Se i file che si aprono vengono visualizzati su righe non interamente contenute nella finestra, dal menu formato di BloccoNote seleziona WordWrap/ACapoAutomatico. Vedrai che, nel caso dei file doc, sxw e pdf, che sono in un formato compresso, non capirai un gran che; nel caso del file rtf riconoscerai la parola "macosa" e riuscirai ad intuire che i vari "\…" sono in gran parte dei comandi di formattazione, presenti anche se il nostro documento è formato da una sola parola:
{\rtf1\ansi\ansicpg1252\deff0\deflang1031\deftab709{\fonttbl{\f0\froman\fcharset0 Thorndale;}} {\*\generator Msftedit 5.41.15.1503;}\viewkind4\uc1\pard\nowidctlpar\hyphpar0\lang255\f0\fs24 macosa\par }

Il linguaggio Html impiega comandi simili, ma più comprensibili, in modo tale che l'utente possa scrivere direttamente usando un editor di testi, come BloccoNote, un documento contenente i codici di formattazione e salvarlo con estensione htm (o html). Da Word e da altre applicazioni si può salvare direttamente un documento in formato Html, ma verrebbero comunque inseriti automaticamente una marea di comandi.
Apri macosa.doc o macosa.sxw con Word o con OpenOffice e salva il domunento con nome "macosa1" come documento Html, o come pagina web, e, poi, osservane le dimensioni ed esaminane il contenuto con BloccoNote. Vedrai che sono presenti comunque molti comandi.
Se esamini con BloccoNote il documento Macosa.htm già presente nella cartella vedrai invece che non vi è alcun comando: nella redazione del documento non ne sono stati inseriti in quanto non servivano.

8) Ora apri con un doppio clic Macosab.htm (che come potrai esaminare osservandone le proprietà col pulsante destro del mouse occupa solo 13 B), esamina quanto visualizzato ed esamina il contenuto dei file usando Visualizza-Html (o View-Source o ...): il documento viene aperto con BloccoNote e puoi esaminare i comandi di formattazione. Vedrai che il file sullo schermo appare con l'iniziale in Bold/Grassetto e che internamente il file è di 13 caratteri e ha la forma:
    <b>m</b>acosa
<b> e </b> sono i comandi che racchiudono la parte del documento che si vuole sia visualizzata in Bold. Vedremo che i comandi Html hanno quasi tutti una struttura molto simile. Il nucleo essenziale dell'Html è uno standard internazionale: tutti i browser (non vecchi di troppi anni), da qualunque sistema operativo (non vecchio di troppi anni), sono in grado di visualizzare un documento Html redatto rispettando questo standard.
Se avessimo formattato in grassetto la "m" con uno degli altri programmi le sue dimensioni sarebbero aumentate ben più che di solo 7 B.
Con BloccoNote non possiamo formattare un testo, però possiamo formattare la visualizzazione dell'intero documento: analogamente a quanto abbiamo visto per l'ACapoAutomatico (che mette degli "a capo" nella visualizzazione, ma non all'interno del file) dal menu Formato-Carattere posso formattare i caratteri visualizzati: se seleziono grassetto vedo tutta la parola "macosa" in grassetto. Se risalvo il documento le dimensioni non cambiano. Se chiudo e riapro lo rivedo in grassetto, ma solo perché quando ho chiuso BloccoNote avevo impostato la visualizzazione in grassetto: qualunque altro documento lo vedrei in grassetto. Se ricambio l'impostazione di Formato-Carattere ciò non accade più.

9) Apri gli Oggetti Matematici (cliccando qui se sei collegato a Internet o aprendolo dal tuo computer se lo hai su disco fisso o in rete locale o su CD), o altro da altri siti, e usalo in vario modo, con l'intento di riflettere e mettere a fuoco le differenze tra l'Html e altri formati: doc, pdf, rtf, txt, …

10) Sicuramente avrai messo in evidenza la facilità con cui si possono realizzare letture ipertestuali dei documenti Html (un ipertesto può essere realizzato anche su carta - per altro, un indice, una nota a pie' pagina, un rimando, un'indicazione su cosa saltare o cosa rileggere, … hanno un che di ipertestuale - ma è tutta un'altra cosa). Questa è la principale caratteristica, che si aggiunge a quelle di "leggerezza" (poca memoria occupata rispetto ad altri formati), "leggibilità" della codifica, indipendenza dalla piattaforma e possibilità di usare un qualunque editor di testi per la realizzazione, … già emerse nei punti precedenti. Inoltre vi è la possibilità di modificare la visualizzazione: ridimensionare la finestra e automaticamente la larghezza dei paragrafi, cambiare le dimensioni dei caratteri, … in modo da adattarsi facilmente a differenti usi: lettura individuale, proiezione, stampa, esame contemporaneo di più documenti, …. Caratteristiche, queste ultime e le precedenti, che costituiscono anche una profonda differenza rispetto a PowerPoint e ad analoghe applicazioni per la "presentazione di diapo" (come quella inclusa in OpenOffice).

11) Incominciamo ad entrare dentro ai documenti Html. Vediamo come sono realizzati i collegamenti ad altri documenti, i cosiddetti link (nota che scriviamo link, file, … senza l'aggiunta di "s" anche se intendiamo il plurale: quando una parola straniera entra nell'uso italiano al plurale non deve essere modificata, a meno che non si stia parlando o scrivendo in quella lingua; altrimenti saremmo tenuti a conoscere la grammatica di quella lingua; invece è facile leggere o sentire cose del tipo "aprite i files con i mouse" dove si mette al plurale "file" e non "mouse", che dovrebbe invece diventare "mice"; e che cosa si dovrebbe fare con le parole di origine russa, indiana, cinese, …?).
   Uno dei modi per imparare è confrontare visualizzazione e contenuto interno di qualche documento html già redatto.
Vediamo, ad es., il "sorgente", ossia il contenuto interno, coprendente i comandi di visualizzazione, della sottofinestra sinistra degli Oggetti Matematici che si apre cliccando sull'icona "percorsi":

Clicca col pulsante destro all'interno della sottofinestra e seleziona la visualizzazione del sorgente Html. Otterrai in BloccoNote: 
<HTML><HEAD><TITLE>Percorsi</TITLE>
<link href="../voci/macosa.css" title="stampa" rel="stylesheet" type="text/css"></HEAD>
<body>
<p class=marbt><a href="../simboli/simboli.htm" target="testo">simboli</a></p>
<p class=mart><a href="strument.htm" target="indice">strumenti</a></p>
<p class=marbt><a href="../esr/index.html" target="testo">esercizi</a></p>
<p class=marbt><a href="esempi.htm" target="indice">esempi</a></p>
<p><a href="../anim/animaz.htm" target="indice">animazioni</a></p>
<p class=marbt><a href="errori.htm" target="indice">errori</a></p>
<p class=marb><a href="predef.htm" target="indice">percorsi predefiniti</a></p>
<p class=marbt><a href="altriper.htm" target="indice">altri percorsi</a></p>
<p class=marb><a href="collega.htm" target="indice">collegamenti</a></p>
<p class=marb2>Office efficiente e gratuito:
<a href="http://it.openoffice.org">OpenOffice</a></p>
<p class=marbt2><a href="../prg/index.html" target="indice">programmini apribili</a></p>
</body></html>

Vi sono alcuni comandi (su cui ci soffermeremo in successivi incontri) che hanno la funzione di rendere più leggibile la struttura interna del documento, di formattare i paragrafi, di caricare formattazioni predefinite in un altro file (il "link" a "macosa.css" presente nella "head" - intestazione - del file), …, e vi sono i comandi del tipo <a href=…>…</a> che individuano le parti del testo da cliccare per attivare il collegamento ai documenti indicati dopo "href=", documenti che compariranno al posto della finestra da cui si clicca se nel comando <a> compare "target=indice", nella finestra principale degli Oggetti Matematici se c'è: "target=testo". Quello che ora ci preme osservare è che l'indirizzo con cui sono indicati i documenti può essere di due tipi:
assoluto, come in href="http://it.openoffice.org", in cui con "http://" si specifica che il collegamento avviene attraverso Internet e col seguito si fornisce l'indirizzo del sito e dell'eventuale percorso (ed eventuale nome del file) lungo cui muoversi all'interno di esso; un altro riferimento assoluto potrebbe essere href="file:///C:/prove/brano.htm", in cui si specifica che occorre collegarsi al file  brano.htm  direttamente accessibile dal computer, nella cartella  prove  del disco C;
realtivo, come in href="collega.htm", con cui si indica il collegamento a un file che è collocato nella stessa cartella in cui è collocato il file da cui si clicca (il file "percorsi.htm"), o href="../simboli/simboli.htm", in cui il rinvio è al file  simboli.htm  a cui si arriva risalendo di una cartella (".." indica la sopra-cartella) e poi entrando nella sua sotto-cartella  simboli.

In modo simile (con il comando <img src=...>, che poi vedremo) si può inserire, ad es., un file-immagine speficando percorso e nome del file.

12) Se si salva un documento html da rete dentro al proprio computer e poi si prova a riaprirlo da qui, è possibile che non si riescano più ad effettuare molti dei collegamenti (a documenti o immagini) presenti nel documento in quanto non erano indicati con indirizzi assoluti e del tipo "http" ma con riferimenti (assoluti o relativi) al computer contenente il sito.
Analogamente, se si sposta una cartella contenente propri documenti html in un'altra parte del disco fisso o su un altro disco può accadere che alcuni collegamenti non funzionino più, e per motivi diversi:
– alcuni collegamenti assoluti potrebbero non funzionare in quanto erano riferiti a file inclusi nella stessa cartella, che ora ha cambiato collocazione,
– alcuni riferimenti relativi potrebbero non funzionare più in quanto riferiti a file esterni alla cartella a cui ora si dovrebbe accedere con un percorso diverso.
Nel realizzare un ipertesto in Html occorre tener presente quale sarà la sua destinazione finale e regolarsi di conseguenza per l'indicazione degli indirizzi e per la collocazione dei vari file in cui esso si articolerà.

Come esercizio vai sugli Oggetti Matematici, seleziona il percorso "errori", apri cliccando col pulsante destro il sorgente (dovresti vedere qualcosa del tipo di quello sotto riportato) e poi salvalo con lo stesso nome (errori.htm) nella cartella che stai usando.

<HTML><HEAD></HEAD><BODY>
<p style="font-size: 130%;font-weight:bold;font-style:italic;letter-spacing:1; text-align: center">Errori su:</p><p>
<sup>&nbsp;</sup><a href="../voci/variaz/variaz.htm#4" target=testo>variazioni percentuali</A><br>
<sup>&nbsp;</sup><a href="../voci/diagram/diagram.htm#2" target=testo>ideogrammi</A><br>
...
<sup>&nbsp;</sup><a href="../voci/cp/cp.htm#12" target=testo>probabilità 2</a></P> </BODY></HTML>

Controlla, quando azioni SalvaConNome…, che nella finestra di dialogo che si apre, nel box SalvaCome (analogo al box TipiDiFile del menu Apri: vedi punto 6) sia selezionata l'opzione TuttiIFile, non DocumentiTesto, altrimenti al file viene aggiunta l'estensione txt (vedi il punto 3 sul problema delle doppie estensioni).

Se esci dal sorgente e provi ad aprire il file errori.htm da te creato con un doppio clic, vedrai che i collegamenti non funzionano. Ciò accade per due motivi: gli indirizzi sono relativi alla collocazione del file originale, il collegamento dovrebbe essere visualizzato in un'altra finestra, individuata dal comando "target=testo". Modifichia quindi il sorgente da BloccoNote usando Change/Sostituisci con questi cambi:
  ..   diventa   http://macosa.dima.unige.it/om
  target=testo   diventa       (stringa vuota)
Salva questo sorgente, aggiorna dal browser il tuo errori.htm e prova a rieseguire i collegamenti. Se hai il computer collegato a Internet, essi funzioneranno.

13) Nel preparare un documento in Html occorre cercare di realizzarlo in modo che alla fine siano sfruttabili le potenzialità discusse nel punto 10. Tra le altre cose, tenendo conto che vi potrebbero essere utenti con un PC portatile o che intendono usare un proiettore, e che in questi casi a volte la risoluzione dello schermo è inferiore a quelle degli schermi attualmente più diffusi, sarebbe bene verificare che quanto produciamo sia visualizzabile anche diponendo di una risoluzione 800×600. Come avere idea di questa dimensione se si dispone di uno schermo "grosso"? Ecco un'idea. Prova ad attuarla:
si apre Paint da Start/Avvia - Accessori. Dal menu Immagine - Attributi definisci come 750×550 le dimensioni. Col "secchiello" riempi di un colore a tuo piacimento lo sfondo bianco, salva il documento con nome Schermo ed estensione GIF (o jpg o, in ultima battuta, bmp, se non vi è possibilità di salvare altrimenti: non tutte le versioni di Paint sono equivalenti). Crea un documento Html, a cui darai nome Schermo.htm (salvandolo nella cartella in cui stai lavorando), con sorgente formato solo da:
  <img src=schermo.gif>   (o .jpg o .bmp)
e aprilo come documento html con un doppio clic sul suo nome.

14) Provate ad esplorare liberamente dai percorsi "collegamenti" e "programmini" de Gli Oggetti Matematici risorse di tipo diverso a cui ci si può collegare mediante Internet.

15) Esamina i vari TAG illustrati nel documento sull'Html a cui si può accedere dal percorso "strumenti" de Gli Oggetti Matematici.

16) Esamina alcuni diversi modi di realizzare animazioni partendo dall'analisi di alcune di quelle presenti negli Oggetti Matematici (a cui si può accedere da "percorsi e materiali"): quelle costituite da GIF animate e quelle ottenute collegando diverse GIF mediante documenti html, come negli esempi su "punti di vista", "numero e" e "approssimazioni polinomiali".come negli esempi sui "punti di vista" e sulle "approssimazioni polinomiali".

17) Per la costruzione di GIF animate, vediamo come impiegare OpenOffice, l'Office gratuito (prodotto dalla "comunità informatica") distribuito dalla Sun, per realizzare l'immagine a lato. Con altri software si procede in modi abbastanza simili. 
# Costruisci le immagini da concatenare, ad es. mediante Paint; se vuoi che le immagini si susseguano perfettamente sovrapposte ti conviene dimensionarle ugualmente (fatta una immagine e salvatala, puoi costruire la nuova immagine sulla stessa, dopo averla salvata con un nuovo nome, e così via).
# Apri un nuovo documento "Presentazione" di OpenOffice, e col menu Inserisci inserisci (non sovrapposte) una dopo l'altra le immagini (nel nostro esempio sono solo due, e, se vuoi, le trovi già pronte, con nomi tic.bmp e tac.bmp).
# Dal menu Presentazione seleziona "Animazione".
# Si apre una finestra di dialogo come quella sotto a sinistra; evidenzia con un clic la prima immagine e poi clicca ; procedi così una dopo l'altra per tutte le immagini.
# Alla fine seleziona con un clic "Oggetto bitmap"; la finestra di dialogo si modifica nel modo sotto a destra.
# Operando sulle caselline al centro puoi stabilire, immagine per immagine, il tempo che deve separarla dalla successiva; seleziona per tutte e due le immagini "1 secondo".
# Quando ai finito,clicca "Crea"; a questo punto l'immagine animata appare evidenziata sulla finestra di sfondo.
# Lasciando l'immagine selezionata, dal menu File seleziona "Esporta" e salva l'immagine come GIF nella cartella che vuoi.