Il sito per imparare gratuitamente a fare pagine Web

Guida HTML

Questa guida Ŕ stampabile in modo agevole dalla versione off-line scaricabile dal men¨ laterale: Download.zip
 


Andrea Bianchi © www.web-link.it  Guida HTML 4.01 - Ver. 7.0.1  

Benvenuti su questa mia guida dedicata ai tags e relativi attributi di HTML. Nessuna pretesa, vuole semplicemente essere una guida di aiuto con basi introduttive, qualcosa che illustri con esempi pratici le potenzialità di questo metalinguaggio che nonostante le continue evoluzioni del web continua ad essere il pilastro portante della rete. Nasce dalle molteplici domande che ricevevo in forma privata nella mia mailbox e da qualche anno ormai sul forum gratuito di supporto. Come potrete notare cerco di tenerla sempre aggiornata nonostante non sia facile visto il continuo evolversi della stessa rete, mi auguro con questo mio ennesimo sforzo di riuscire a soddisfare molte delle vostre esigenze. Se poi l'argomento dovesse interessarvi al punto tale di volerlo ulteriormente approfondire, la cosa migliore sarebbe affidarsi alla letteratura specializzata. Credo di aver trattato in queste pagine tutto quello che realmente serve per creare un buon sito web.

Febbraio 2013: La guida Ŕ stata scritta nella sua prima versione nel Settembre del 1998 ed oggi molte cose sono cambiate, o per meglio dire: evolute. Tutto questo grazie soprattutto all'uso dei CSS: fogli di stile, e ad alcune regole precise e pi¨ restrittive che hanno dato vita a XHTML (evoluzione del linguaggio html) ed oggi il pi¨ recente HTML5 ancora in fase di definizione, il tutto nel pieno rispetto del W3C, consorzio che si occupa proprio di questo argomento. Tutto quello che troverete in questa guida (salvo precisa nota) Ŕ e resta perfettamente funzionante con qualsiasi tipo di html che deciderete di usare, a questo proposito vi ricordo che esistono altre guide qui su web-link che trattano: come iniziare, XHTML, HTML5 e CSS. Le trovate su questi links: Primi Passi, XHTML, HTML5, CSS fogli di style.

Per verificare subito se il tag (elemento) o l'attributo html che state cercando Ŕ trattato qui su web-link potete consultare la pagina indice dove troverete tutti i tags di html presenti in questo sito, per quelli non trattati su questa guida ci potrebbe essere un riferimento per raggiungerli su altre guide sempre di web-link.it

E' possibile contribuire scaricando la guida anche in formato pdf e/o e-book per poterla stampare agevolmente su carta o consultare a video comodamente off-line, cioè scollegati dalla rete, è sufficiente cliccare su questo link: Scarica guida html scarica la guida HTML

Attenzione! eventuali ultime modifiche potrebbero non essere state ancora inserite in questa versione on line (prioritÓ alle versioni off-line), questa on line viene aggiornata ad intervalli prestabiliti o quando ci siano modifiche di una certa importanza. Sono gradite segnalazioni, commenti e qualsiasi altra cosa ritenuta utile al fine di migliorare il lavoro che sarÓ sempre e solo a beneficio di tutti quanti voi.

  Alcuni consigli per adoperarla al meglio: nel men¨ laterale trovate disposto verticalmente l'indice degli argomenti: tabelle, links, immagini ecc. Per ogni argomento esistono altri due men¨ disposti orizzontalmente in cima alla pagina che riportano in ordine alfabetico i nomi degli elementi o tags

ed i relativi attributi, (sempre in ordine alfabetico o di assemblaggio codice).

BasterÓ un click sul nome dell'elemento o su quello del suo attributo per raggiungere la descrizione. Alla fine di ogni descrizione una riga come questa sotto separa e conclude gli elementi, grazie alla piccola freccia verde posizionata a destra della riga separatrice sarÓ possibile (cliccandola) ritornare all'indice degli argomenti.

Torna su

HTML (Hyper Text Markup Language) è formato da definizioni, elementi (tags), questi impartiscono al browser (il programma usato per la navigazione) delle direttive ben precise al fine di ottenere il risultato a video, una sorta di interpretazione che varia a volte a seconda del tipo di browser adoperato. Si tratta dunque di conoscere il significato dei vari elementi e come questi possono essere combinati fra loro per avere la padronanza del linguaggio.

Per la stesura di questo metalinguaggio si fa uso di un normale editor di testi, meglio se un editor specifico per HTML, cominciamo proprio da qui, cliccando su questo link sarÓ possibile scaricarne uno dalla rete.

Cosa è un editor e cosa è il codice html?

Un editor altro non è che uno strumento che ci consente di scrivere in modo semplice e veloce righe di codice html; quel codice che i vari browser di navigazione, qualunque essi siano, riconoscono ed interpretano. Si potrebbe paragonarlo ad un programma per videoscrittura, anzi sono molte le similitudini, con la sola differenza che il testo scritto da questi editors è formattato nel modo giusto per dare vita a pagine di ipertesto, da qui il nome sigla HTML: Hyper Text Markup Language.

Gli editors per HTML si dividono in due categorie:

Visuali: molto semplici, simili ai programmi di grafica, permettono di disegnare o semplicemente trascinare quello che serve all'interno del loro ambiente di sviluppo, operazione che genera automaticamente codice html valido.

Testuali: bisogna scrivere il codice, quindi conoscerlo, offrono gli strumenti giusti con i suggerimenti necessari alle varie situazioni, si ha il pieno controllo di quello che si sta facendo superando cosý quelli che spesso sono i limiti degli editors visuali.

Dopo quanto appena detto è abbastanza ovvio immaginare che il principiante si affiderà agli editors visuali. Non fatelo se non per prova. C'è chi consiglia di adoperare il notepad o il wordpad di windows, personalmente reputo la scelta a dir poco illogica, della serie "facciamoci del male da soli". Non capisco perchè mai si dovrebbe adoperare uno strumento che di html non ha nulla quando la rete offre ottimi programmi, alcuni addirittura gratuiti (freeware), che danno un grosso aiuto proprio nella stesura di questo tipo di codice.

Chi avesse comunque deciso di affidarsi agli editors visuali può tranquillamente smettere di leggere il seguito di queste pagine, non gli serviranno a molto visto che parleremo di codice che l'editor visuale gestisce in assoluta autonomia. Un arrivederci a queste persone che probabilmente torneranno qui non appena insorgeranno le prime difficoltà dovute alla mancata realizzazione di determinate "operazioni" che non sempre un editor visuale è in grado di fare. Non ho nulla contro gli editor visuali ve lo assicuro, anzi per certe "cose" ho sempre pensato che avrei dovuto farne uso anch'io.

Un'ultima raccomandazione prima di passare in rassegna i vari elementi (tags): Ŕ bene ricordare sempre che qualsiasi pagina creata per la rete prima di poter essere visualizzata dovrà essere scaricata nella memoria interna del browser (cache); quindi, pagine lunghe o farcite di immagini, applets e suoni, sono spesso per il visitatore un ottimo motivo per decidere di abbandonare quella pagina perchŔ stanco di attendere. Evitatele nel modo più assoluto, meglio pianificare diverse pagine corte al posto di una singola lunga. Suddividere il lavoro in più pagine non costa nulla ed offre maggiore flessibilità anche a voi stessi per eventuali future modifiche.

Html non è un vero e proprio linguaggio di programmazione, o almeno non come si è abituati a pensare quando si parla di programmazione. HTML è molto più semplicemente un insieme di istruzioni: <TAGS>, che il browser legge in maniera sequenziale: dall'alto verso il basso, da sinistra verso destra, esattamente come avviene per noi umani la normale lettura di un testo.

Queste istruzioni, o meglio questi elementi (tags), sono racchiusi fra parentesi angolari: <queste> ogni elemento (tag) impartisce un ordine preciso che termina con lo stesso elemento preceduto da una barra retroversa, per rifarmi all'esempio appena citato: </queste>

Non sono molti gli elementi che compongono il linguaggio, alcuni addirittura non vengono mai adoperati, al punto che spesso mi sono chiesto cosa li abbiano inventati a fare :). Come già detto, mi limiterò ad illustrare soltanto quelli che secondo il mio modesto parere possono realmente essere utili.

Ogni volta che ci saranno esempi di codice li troverete all'interno di box colorati come questi sotto, per facilitarne la comprensione useremo box a sfondo giallo per quello che riguarda il codice HTML, box a sfondo verde per quello che riguarda il codice CSS, box a sfondo marrone chiaro per javascript e box a sfondo grigio per i risultati di esempi prodotti dal codice html, css e javascript.

codice HTML
codice CSS
codice obsoleto o deprecato
risultato di eventuali esempi
Consiglio.

Per chi non avesse mai avuto prima d'ora alcuna esperienza con HTML è consigliabile iniziare dalla rubrica primi passi che in poche e semplici lezioni chiarisce quelli che sono i meccanismi per usare gli elementi illustrati in questa stessa guida, sulla quale potrete sempre ritornare una volta acquisito quel minimo di esperienza necessaria ad assemblare gli elementi trattati.

Non vi resta che selezionare dal men¨ laterale il gruppo di elementi che vi interessano.

Non mi resta che augurarvi buona lettura. e passare alla Struttura Base

Buona lettura. Andrea Bianchi

Se avete domande potete scrivere sul forum di supporto, gratuito e aperto a tutti.

Forum


Andrea Bianchi 





Licenza Creative Commons
Questo opera Ŕ distribuita con
licenza Creative Commons Attribuzione - Non commerciale -
Non opere derivate 3.0 Italia