|
HYPER
TEXT MARKUP LANGUAGE
Corso
di HTML
Benvenuto/a
in questa sezione della guida che intende seguirti ed aiutarti nella
realizzazione della tua home page. Questa premessa serve a sottolineare pochi ma
fondamentali concetti che reggono l'HTML e che, se compresi tempestivamente,
consentono di far proprio un sistema di contrassegno tutt'altro che complesso,
ma pur sempre retto da regole e principi inderogabili.
Creare un sito Internet non è difficile, ne' può essere messo a confronto con
veri e propri sistemi di programmazione. Su quest'ultimo punto, in particolare,
è bene fin d'ora sottolineare come HTML non sia un linguaggio di programmazione
ma un semplice sistema di contrassegno, i cui tag vengono riconosciuti ed
interpretati dai browser Web (Netscape, MsIe, Opera ecc). Questa peculiarità
rende HTML un sistema facile da comprendere perchè non pressuppone alcuna
conoscenza tecnica preesistente. Per questo motivo chiunque può avvicinarsi al
Web Publishing senza prerequisiti di specializzazione e per questo in Internet
esistono milioni di creatori di pagine Web.
Il mercato è gravido di decine di software speciliazzati nella creazione di
pagine HTML: i cosiddetti editor HTML. La complessità di questi programmi ha
raggiunto livelli molto alti ma ha seguito strade diverse. In buona sostanza il
mercato propone due tipi di editor HTML:
-
Editor
testuali
Si tratta di programmi che propongono modifiche dirette sul codice HTML puro
con possibilità di preview del risultato. Per facilitare la scrittura del
codice mettono a disposizione comandi preconfezionati attivabili con
semplici click. L'utilità maggiore di questi strumenti è la padronanza del
codice HTML puro che riescono a comunicare agli utilizzatori. Il difetto
maggiore è nell'apprendimento più difficile rispetto agli editor WYSIWYG.
-
Editor
WYSIWYG
L'acronimo sopraindicato sta per: What You See Is What You Get, ed
italianizzando significa che ciò che si vede sullo schermo è ciò che
si ottiene in un browser Web. In altre parole questi editor non visualizzano
il codice HTML ma esclusivamente gli oggetti, le immagini ed il testo. In
questo modo lo sviluppatore non si trova a lavorare su codice HTML ma sulla
pagina così come verrà visualizzata dal browser: spostando oggetti con il
semplice trascinamento del mouse, sfruttando layout predefiniti ecc.
Il vantaggio di questo tipo di editor è evidente: lo sforzo di comprensione
delle specifiche HTML è ridotto al minimo e il tempo di apprendimento è
brevissimo.
Secondo chi scrive, però, questo tipo di editor (un esempio concreto è
Front Page) non dà la possibilità di comprendere l'HTML e personalizzarne
l'uso. Si corre, infatti, il rischio di creare siti fotocopia con un layout
identico agli altri e, in presenza di errori che l'editor non riesce a
risolvere, di non riuscire ad andare oltre ciò che il programma prevede.
A prescindere da pareri soggettivi su programmi per l'HTML, la presente
guida è concepita per far comprendere i rudimenti dell'HTML puro.
Continuando questo corso non ti troverai di fronte un tutorial sui comandi
degli editor più diffusi, ma davanti codice HTML puro ed universale. Solo
in questo modo potrai comprendere le peculiarità dell'HTML e degli altri
linguaggi che ne supportano e ampliano l'utilizzo.
Abbandona per tutto il corso di questo tutorial il tuo editor e concentrati
sulle nozioni di codice che la guida ti presenta volta per volta. Comprese
le basi dell'HTML potrai scegliere se usare editor WYSIWYG o editor
testuali, in entrambi i casi avrai consapevolezza dei limiti e delle
potezialità del sistema, potendo usare meglio tutti gli strumenti che il
mercato mette a tua disposizione.
Alcuni consigli per comprendere pienamente questa guida:
-
I
siti Web, prima della pubblicazione, vanno creati in locali, cioè sul tuo
hard disk. Solo successivamente vengono spediti attraverso programmi
appositi.
-
Per
i nomi dei file e per le estensioni degli stessi usa caratteri sempre in
minuscolo.
-
Ricorda
che la modifica del tuo sito Web avviene tramite programmi FTP (File Trasfer
Protocol) mediante password e UserId. Quindi nessun altro, oltre te, può
modificare le pagine.
-
Per scrivere
codice HTML puoi utilizzare qualsiasi editor HTML testuale (HomeSite, HotDog,
DreamWeaver ecc.), ma anche solo Blocco Notes di Win95.
^
On
Top
Prima
di continuare è importante sottolineare una caratteristica dei tag HTML. Come
più volte accennato, HTML è un sistema di contrassegno che produce i suoi
effetti su testo e immagini. Perchè tali effetti si producano è necessario che
elementi specifici (standardizzati in HTML) vengano assegnati ai vari elementi
testuali o d'immagine della pagina. Il termine marcatura deriva proprio
da questa caratteristica. Per una migliore comprensione di questo fondamentale
concetto di HTML prendiamo in considerazione il testo seguente:
HTML è un sistema di contrassegno indipendente dalla piattaforma.
Come vedi si tratta di un normalissimo testo per il quale non abbiamo
specificato alcun tag HTML. In linea con i concetti che reggono il sistema di
markup, senza altre indicazioni, il browser formatta il testo come quello che lo
precede (infatti si tratta di un font arial di dimensioni e colore identici a
questo stesso testo).
Consideriamo, ora, l'ipotesi di voler dare un colore rosso al testo di esempio.
Per fare questo marchiamo il testo con lo specifico tag HTML che determina il
colore del testo:
<font color="red">HTML è un sistema di
contrassegno indipendente dalla piattaforma.</font>
In seguito vedremo il funzionamento del tag FONT. Quello che interessa
sottolineare in questa sede è l'uso generale dei marcatori HTML: come si nota
agevolmente dall'esempio, il tag <font color="red"> è
posto immediatamente prima e dopo la frase da formattare in rosso. L'unica
differenza è che il tag prima della frase è <font color="red">,
mentre quello che chiude è </font>. La barra posta in verticale
verso destra indica al browser che il tag <font> precedentemente
aperto, in questo caso va chiuso. Abbiamo così dato vita ad un piccola
marcatura, comunque sintomatica del funzionamento del sistema HTML.
^ On
Top
I tag HTML sono case insensitive, cioè assolutamente indipendenti dal
maiuscolo e minuscolo. Per intenderci, il seguente codice:
<font size="red"></font>
ha gli stessi effetti del codice:
<FONT SIZE="RED"></font>
In HTML esistono TAG che non hanno bisogno di chiusura, perchè la loro funziona
non è quella di marcare un elemento, ma di fornire informazioni di diverso
tipo. Volta per volta indicheremo quali elementi hanno bisogno di chiusura e
quali funzionano correttamente anche se ne sono privi.
Adesso
che hai un'idea di cosa sia e come opera l'HTML sei pronto/a a seguire il corso
(suddiviso in 16 lezioni più 2 punti di approfondimento) tenuto da Massimo
Valenti di HTML.it. Questo corso è strutturato in maniera semplice e chiara
adatto quindi ai principianti del linguaggio, ma offre anche spunti interessanti
agli utenti più esperti. Clikka sull'argomento al quale sei più interessato,
anche se, ti consiglio (se sei alle prime armi) di seguire il corso punto per
punto data la correlazione tra una lezione e l'altra. Buona fortuna.
CORSO
di HTML di HTML.IT
1.
<HEAD> intestare il
documento
Come creare da zero un documento HTML; dare un titolo alla
pagina e cosa sono e come impostare i meta tag.
2. Scrivere correttamente i
meta tag
Come scrivere correttamente i meta tag per risultare in
buona posizione nei search engine
3. <BODY> Impostare lo
sfondo del documento
Come inserire un'immagine o un colore di sfondo; il colore
di tutti i link attivi e visitati e altre operazioni riguardanti lo sfondo del
documento.
4. Inserire suoni o musiche di
sottofondo
Come inserire suoni e musiche di sottofondo compatibili
con Netscape e MsIe.
5. <FONT> carattere e
grandezza del testo
I tag fisici e logici; come formattare il testo o
scegliere un font; come rendere il testo grassetto, corsivo e sottolineato.
6. Paragrafi e giustificazione
del testo
Come posizionare testo e immagini; centrare oggetti,
creare linee orizzontali.
7. Creare elenchi puntati e
numerati
Indicizzare risorse all'interno di elenchi puntati e
numerati.
8. <IMG> inserire
immagini nel documento
Come inserire immagini all'interno di un documento e usare
gli attributi del tag IMG.
9. <HREF> link verso
documenti o immagini
Come creare collegamenti tra documenti HTML con l'elemento
e tutti i suoi attributi.
10. <TABLE>
creare e gestire Tabelle HTML
Creare tabelle HTML per gestire dati e formattare il
layout di pagina.
11. Un modo nuovo per
formattare i documenti: i css
18 lezioni per scoprire ed imparare i fogli di stile
12. <FRAME> creare
pagine con Frame
Come creare e gestire correttamente pagine HTML con frame
13. <FORM> creare e
gestire moduli HTML
Tutorial in 6 lezioni per inserire moduli HTML nel tuo
Website
14. <MAP> creare mappe
cliccabili
Cosa sono, come si creano, quali programmi usare: tutto
sulle image map
15. <APPLET> inserire
Applet Java nel documento
Come inserire le applet Java che trovi in HTML.it o su
altri siti Internet
16. Le nuove specifiche di
HTML 4
Le maggiori novita' introdotte dalla quarta versione dello
standard HTML
A. Risoluzione
dei problemi più frequenti
Ora che hai imparato a conoscere HTML ti troverai di
fronte a problemi molto diffusi. Questa sezione ti aiuta a risolververli
agevolmente.
B. Strumenti
per gestire al meglio il tuo sito
Come creare facilmente forum di discussione, chat,
password, banner a rotazione, mailing list e altri strumenti necessari a
migliorare il tuo sito.
^
On
Top
|