Muovere i primi passi. Rev.1.2 - Gennaio 2002 Benvenuti; se siete arrivati su questa rubrica, significa che siete interessati a muovere i primi passi in HTML, ovvero il linguaggio base che da vita alla rete Internet. Su questo spazio è 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! Questa rubrica è scaricabile anche in formato compresso (zip)   per poterla poi consultare comodamente off-line. Per stampare le singole pagine basta un clic sull'immagine della stampante che si trova a fine pagina. Nel caso (raro) in cui non dovesse funzionare, sarà possibile ottenere la stampa anche dal menù file del vostro programma di navigazione, dopo aver selezionato questo riquadro (frame). Dopo questa breve premessa, possiamo iniziare; vediamo cosa serve e come si costruisce una pagina web. Una pagina web è una sorta di ipertesto, cioè testo apparentemente "normale" generato da un editor, cioè uno programma che permette di scrivere il codice, anche lo stesso che di solito si adopera per scrivere le normali lettere. La differenza consiste nello scrivere frasi particolari che diventano vere e proprie istruzioni, chiamate <TAGS> (elementi) , racchiusi 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 stresso che stai adoperando adesso per leggere quello che io ho scritto con il linguaggio HTML , questa sigla è ormai divenuta sinonimo di pagina web, il cui significato deriva dalle iniziali di: Hyper Text Markup Language. Senza html non potresti nemmeno leggere questa pagina. Non c'è nulla di particolarmente difficile, non serve avere alcuna precedente esperienza di programmazione. Devi semplicemente seguire le spiegazioni con una certa attenzione e poi provare... provare, e riprovare. Come ho appena detto, non si tratta di un linguaggio di programmazione vero e proprio per il quale sia richiesta una certa preparazione di base, si tratta molto più semplicemente di una combinazione di tags, elementi, molto semplici da inserire, spesso facilissimi da ricordare e soprattutto con pochissime regole da rispettare. Fare delle buone pagine web non è per niente difficile, i problemi potrebbero nascere quando non ci si accontenta più di semplici pagine o quando queste debbano produrre "effetti speciali", ma questo lo vedremo in seguito; una panoramica più completa su quelli che sono tutti gli elementi di html è possibile averla consultando la mia guida HTML dedicata sempre ai principianti e anch'essa di facile consultazione con possibilità di essere scaricata in formato compresso (zip) per essere consultata comodamente off-line. Ci siamo dilungati fin troppo, vediamo cosa serve e quali sono gli strumenti giusti per creare pagine web. Abbiamo detto un editor, cioè uno di quei programmi che si adoperano per scrivere testi, il wordpad o il blocco notes a corredo di windows per 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 infatti, word di microsoft per citarne uno, aggiungono dei caratteri che soltanto loro riescono poi a riconoscere ed interpretare, questi caratteri non vanno certo d'accordo con le 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 e rinominate poi il file cosi' salvato in htm o html. Personalmente consiglio di procurarsi un editor specifico per HTML, visto che se ne trovano di potenti ed anche di gratuiti non vedo perchè se ne dovrebbe fare a meno. Dovendo parlare di editor HTML, due sono le categorie che li distinguono: visuali e testuali. Quelli visuali sono sicuramente molto più semplici 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 continuare a leggere questa mia rubrica; arrivederci, sono infatti sicuro che ci rivedremo presto ... :-) Presuntuoso? No, lo so per esperienza, quella che voi stessi mi avete permesso di farmi in tutti questi anni. Quelli testuali invece richiedono da parte di chi li adopera una minima conoscenza di base, potrebbero sembrare più dispendiosi, ma alla lunga si rivelano invece un autentico investimento. Consentono di fare cose che editors visuali non permetterebbero mai, e danno la possibilità di avere il controllo assoluto su ogni parte del codice, anche di questo avremo modo di parlarne meglio quando torneremo in seguito sull'argomento. Finita questa doverosa premessa, possiamo finalmente iniziare a fare qualcosa di concreto... Aprite il vostro editor preferito, qualunque esso sia. I TAGS, o elementi, che compongono HTML devono essere racchiusi fra parentesi angolari <queste> Si tratta di parole chiave, termini in lingua inglese. L'elemento (tag) smette di produrre il suo effetto nel momento in cui lo stesso viene ripetuto facendolo precedere da una barra laterale / 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> poco importa se siano scritti in maiuscolo o minuscolo, tutto ciò che sarà contenuto all'interno di questi due elementi (tags) sarà interpretato dal browser come codice HTML. Difficile ? Direi proprio di no :-) Un documento HTML è composto da due sezioni ben distinte: una testa <HEAD> ed un corpo <BODY> Nella testa (head) vanno messi quei comandi che inviano informazioni al server o quel codice che deve essere letto con una certa priorità: script, fogli di style, ecc. ecc. Nel corpo (body), tutto il resto. Anche questi elementi, necessitano del relativo elemento di chiusura: </head> e </body> Riassumendo una struttura HTML tipo, potrebbe essere questa: <html> <head> codice per il server, scritp, fogli di style. </head> <body> codice da visualizzare come documento </body> </html> Per il momento all'interno di <Head> non metteremo nulla, si vedrà più avanti cosa inserire, adopereremo soltanto la zona <body>. Col vostro editor create la struttura sopra e portatevi col cursore all'interno degli elementi (tags) <body> ... </body> Inseriremo del testo, per cui lo faremo precedere dall'elemento <p> che significa: paragrafo, andremo a scrivere un qualsiasi testo: "questa è la mia prima pagina web" per esempio, facciamo in modo di chiudere anche l'elemento <p> con il relativo </p>. Se tutto è stato fatto correttamente dovremo avere una struttura di questo genere: <html> <head> </head> <body> <p> Questa è la mia prima pagina web </p> </body> </html> Non importa come avete disposto le frasi del testo, potete lasciare spazi o ritornare a capo quante volte volete, poco importa; il browser ignorerà il vostro modo di scrivere limitandosi a leggere e interpretare soltanto gli elementi validi di html. A questo punto non resta che salvare il tutto. Se il vostro editor non è specifico per html, fate in modo di salvare in formato ascii, cioè testo puro. Assegnategli un nome: quello che volete, e salvatelo. Se non avete un editor che salva direttamente in html con molta probabilità il vostro file avrà un estensione di tipo .txt, ovvio direte voi, visto che è stato scritto con un normale editor per testi. Rinominate questo file in modo che abbia come estensione htm o html altrimenti il browser non riuscirà ad interpretarlo in modo corretto. A proposito di questa operazione, dovrei fare alcune precisazioni: l'operazione di rinomina di per se è molto semplice ma chi adopera Windows potrebbe non vedere l'estensione finale del file appena salvato, in questo caso rinominarlo servirebbe a poco dal momento che windows aggiungerebbe html al nome appena assegnato, lasciando di fatto il file in formato txt Mi rendo conto che non sia un'operazione molto semplice, specialmente per un principiante in senso generale, per chi avesse problemi in questo tipo di operazione vi rimando ad un esempio che credo possa chiarire meglio. Consapevole che se avessimo adoperato un editor visuale quale: "composer" per chi adopera Netscape o "Front Page Express" per chi adopera Intenrnet explorer, non ci sarebbe stato bisogno di niente altro che non fosse stato scrivere: questa è la mia prima pagina web e salvare... Preferivate una cosa fatta in questa maniera ? Se si, avete sbagliato rubrica, questa è infatti destinata a coloro i quali vogliono sapere come fare le pagine web e non come farle fare agli editors visuali :-)) Per essere la prima lezione introduttiva, credo possa bastare, esercitatevi, soltanto dopo aver preso un minimo di familiarità passate alle lezioni successive. Se avete domande da farmi potete scrivere a: primipassi@web-link.it

Andrea Bianchi

per stampare questa pagina

  Se non avete una mailbox adoperate il Modulo.