Il sito per imparare gratuitamente a fare pagine Web

Primi passi in HTML














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



Andrea Bianchi © www.web-link.it  Primi Passi in HTML 4.01 - Ver. 2.7.0 - Settembre 2011
 

Muovere i primi passi in HTML Benvenuti su questa rubrica, se siete arrivati fin qui, e non per caso, significa che siete interessati a muovere i primi passi in HTML, ovvero il linguaggio base che da vita alle pagine della rete Internet.

Nei primi giorni del mese di Marzo 2012 è stata messa on line questa stessa guida ma con l'uso dei fogli di style, il suo nome è Primi Passi HTML con Style. Non è l'aggiornamento di questa guida ma la sua evoluzione perchè a differenza di questa che tratta gli attributi per HTML ed accenna a quelli da CSS, l'altra li tratta entrambi privilegiando i CSS.

Dipende solo da voi e dal vostro grado di conoscenza della materia, per certi versi questa potrebbe essere considerata superata ma resta valida e funzionante a tutti gli effetti.

Con questo aggiornamento sono state eliminate alcune informazioni considerate "deprecate" dall'evoluzione del linguaggio html regolato dal consorzio W3C (organo che si occupa proprio di queste regole). Con questa versione potrete dire che il vostro sito è certificato perchè il codice usato risulterà corrispondente alle attuali regole di html 4.01. Chi vorrà approfondire potrà leggere anche la Guida HTML e quella XHTML con Style.

Su questa rubrica è possibile apprendere passo dopo passo, lezione dopo lezione, tutto ciò che serve per creare una propria pagina web e perché no, un vero e proprio sito web!

E' possibile scaricare la guida anche in formato compresso .zip (E-book o PDF) per poterla stampare su carta o consultare a video comodamente off-line, cioè scollegati dalla rete, è sufficiente cliccare su questo link: Scarica Primi Passi Html scarica la guida Primi passi HTML

Attenzione! eventuali ultime modifiche potrebbero non essere state ancora inserite in questa versione on line (priorità alla versione zip), questa on line viene infatti 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.

Useremo soltanto il minimo indispensabile, così facendo sarà tutto più semplice per chi si avvicina per la prima volta a questo "sistema di programmazione". Pochi essenziali comandi per un buon risultato da ottenere subito. Chi volesse potrà proseguire dai due links appena riportati sopra per le guide HTML e XHTML.

Vediamo cosa serve e come si costruisce una pagina web. Una pagina web è una sorta di ipertesto, cioè testo apparentemente "normale" generato da un normalissimo editor per testi, a volte lo stesso che si adopera per scrivere le normali lettere. La differenza consiste nello scrivere "parole" riservate che diventano vere e proprie istruzioni per il browser e che sono chiamate <tags> (elementi), si distinguono perchè racchiuse fra parentesi angolari < >, particolarità che ne consente poi la corretta interpretazione da parte del browser. Cos'è il browser?
E' quel programma che serve per navigare la rete, lo stesso che state adoperando in questo momento per leggere questa pagina che fa uso proprio del linguaggio HTML, questa sigla è ormai sinonimo di WEB, di pagina web, il suo significato deriva dalle iniziali della frase inglese: Hyper Text Markup Language. Senza html non sarebbe possibile leggere questo che sto scrivendo.

Non c'è nulla di particolarmente difficile e non serve avere alcuna esperienza di programmazione; non si tratta infatti di programmare ma di assemblare delle istruzioni tags (elementi) predefinite e molto semplici da inserire, direi anche abbastanza facili da ricordare ma soprattutto con pochissime regole da rispettare, e poi provare... provare, e riprovare fino ad ottenere il risultato che, vi assicuro, é garantito per tutti.

Fare delle buone pagine web non è per niente difficile, i problemi possono nascere quando non bastano più semplici pagine statiche o quando queste debbano produrre risultati elaborati, ma avremo modo di parlarne in seguito. Al momento basta imparare le regole, il meccanismo necessario, e si potranno assemblare tutti gli altri elementi che in questa rubrica non saranno trattati per non confondere il principiante ma che sono presenti sulla guida HTML di Web-Link.

Vediamo in concreto cosa serve e quali sono gli strumenti necessari per creare la nostra prima pagina web. Abbiamo detto un editor, cioè uno di quei programmi che si adoperano per scrivere testi, il wordpad o il blocco notes che di solito si trovano a corredo di windows, tanto per fare un esempio, potrebbero andare bene, ma anche qualsiasi altro elaboratore di testi potrebbe fare al caso nostro; unica raccomandazione: ricordarsi sempre di salvare il tutto in formato ASCII, cioè puro testo senza aggiunta di formattazioni particolari.

Alcuni di questi programmi, word di microsoft per citarne uno, aggiungono dei caratteri particolari che soltanto loro riescono poi a riconoscere ed interpretare, questi caratteri non vanno d'accordo con il codice html e relative pagine web. Non lasciatevi ingannare dal fatto che word possa esportare in HTML, lasciate perdere, se proprio volete adoperare word e seguire questo corso, salvate in ascii (txt) e rinominate poi il file così salvato xxx.txt in xxx.htm o xxx.html (dove xxx sarà sostituito dal nome che voi avrete assegnato al vostro documento).

Personalmente vi consiglio di procurarvi un editor specifico per HTML, in rete se ne trovano di potenti ed anche di gratuiti per cui non vedo perché se ne dovrebbe fare a meno. Dovendo parlare di editor HTML, due sono le categorie in cui si suddividono: visuali e testuali.

Quelli visuali sono sicuramente molto più semplici e comodi da adoperare, assomigliano a dei programmi di grafica, è sufficiente trascinare al loro interno testi ed immagini per avere un'impaginazione più che soddisfacente. Se avete deciso per quelli, potete smettere di leggere questa mia rubrica, non vi servirà a molto infatti, arrivederci, sono però sicuro che ci rivedremo presto.
Presuntuoso?
No, lo so per esperienza, quella che voi stessi mi avete permesso di acquisire in tutti questi anni.

Gli editors testuali richiedono da parte di chi li adopera una minima conoscenza di base, ecco il motivo di questa rubrica. Potrebbero sembrare più dispendiosi in termini di impegno ma alla lunga si rivelano invece un autentico investimento. Consentono di fare cose che editors visuali non riescono a fare ed offrono la possibilità di avere il controllo assoluto su ogni parte del codice, anche di questo avremo modo di parlare meglio quando torneremo in seguito sull'argomento.

E con questa le premesse sono finite, possiamo finalmente iniziare a fare qualcosa di concreto... Aprite il vostro editor preferito, qualunque esso sia, anche uno di quelli visuali se ha però la possibilità di andare in modalità testo, ovvero in html.

Sul foglio bianco inseriremo i TAGS, o elementi, che compongono HTML e che devono essere racchiusi fra parentesi angolari <queste>

Si tratta di parole chiave, termini in lingua inglese riservati. L'elemento (tag) smette di produrre il suo effetto nel momento in cui lo stesso viene ripetuto facendolo precedere da una barra / contenuta sempre all'interno delle parentesi angolari.

L'inizio di un documento HTML avrà come elemento (tag) iniziale: <HTML> e come elemento (tag) finale </html> nessuna importanza se scritti in maiuscolo o minuscolo, tutto ciò che sarà contenuto all'interno di questi due elementi (tags) sarà interpretato dal browser come codice HTML. Consiglio di abituarsi fin da subito a scrivere in minuscolo, chi infatti decidesse poi di passare ad xhtml avrà il vantaggio di avere questa buona abitudine che in xhtml è una regola ferrea.

Vi sembra difficile ?
No! Direi proprio di no.

Nella prossima lezione vedremo la struttura della pagina html.

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



Andrea Bianchi