Quindi utilizzeremo WorldPress?
Eh no, troppo semplice, ma come tutte le cose semplici è limitato. WorldPress è utilissimo per creare blog o simili come quello che stai leggendo ora. Ma per altri tipi di siti questo ambiente non è abbastanza. Un ambiente macroscopico come WorldPress non riesce a descrivere tutte le fantasie della tua mente come potrebbe fare un linguaggio come HTML.
Ti ricordi di lui? Ne abbiamo parlato nel nostro primo articolo sul web. Ovviamente non finiranno gli articoli su WorldPress, ma saranno molti meno e molto meno approfonditi rispetto agli altri. Questo perché WorldPress è più intuitivo e più difficile da illustrare in un blog, per qualsiasi domanda comunque ti ricordo il nostro forum!!
Teoria su HTML
Ultima operazione prima di poter iniziare a scrivere davvero in HTML: la teoria! Non fare quella faccia… è molto utile in caso di un’interrogazione. Ceh, volevo dire, per capire il funzionamento di questo linguaggio.
HTML è un linguaggio dichiarativo, ciò lavora non per comandi veri e propri, ma per tag, etichette. Questo linguaggio ha una logica molto diversa da Java, C++ o Python, infatti non ha la possibilità di creare loop. Esso è un linguaggio creato e impostato solo e solamente per trattare l’ipertesto e il contenuto delle pagine web, ma non la grafica ad alto livello (che aspetta a CSS).
Partiamo!
Per cominciare scarichiamo quello che sarà il nostro editor. Questo passaggio non è fondamentale, infatti basta usare notepage su windows o TextEdit su mac e salvare i file in cui andremo a scrivere il codice con .html oppure .htm. Noi in ogni caso utilizzeremo Sublime Text. Questo ha il vantaggio di colorare funzioni e altre parti di codice in modo da rendere più facile la revisione e la scrittura di quest’ultimo.
Dopo questo passaggio possiamo iniziare per davvero. Per prima cosa dobbiamo scrivere due linee così.
In mezzo a queste scriveremo tutto il nostro codice.
!! Per quasi tutti i tag (le parole fra <>) c’è un corrispettivo conclusivo con la barra es. <tag> … </tag>
Adesso, dentro a questa struttura, creeremo il codice. Composto da testa e corpo:
Andando per ordine, mettiamo il titolo del documento all’interno della struttura testa (tra i due tag head). Questo sarà il nome con cui visualizzeremo la pagina, per codificarlo dobbiamo fare così:
Fatto questo possiamo iniziare a creare per davvero il nostro documento. Per fare questo dovremo spostarci nella struttura body e scrivere prima di tutto il titolo della pagina. I titoli possono avere vari ordini di importanza e dimensioni (da 1 a 6). Però non bisogna usarli solo come tipologia di carattere (come modificare lo stile di scrittura lo vedremo nella prossima lezione), ma bensì come veri proprio titoli e parole chiave visto che servono anche come nodi nell’universo dell’ipertesto. Per creare quindi questi titoli scriveremo dentro al body:
Adesso possiamo andare a scrivere i paragrafi che compongono la nostra pagina. Quindi dovremo, nella linea sottostante, scrivere:
!! Nota bene che HTML non è case sensitive, cioè non c’è alcuna differenza fra <p> e <P>.
Per aggiungere un altro paragrafo basterà scrivere nella linea sotto un altro paragrafo esattamente come questo appena descritto. I browser in cui apriremo il file prevedono di partenza che tra un paragrafo e l’altro ci sia uno spazio.
Se invece volessimo avere la certezza che nel nostro paragrafo la linea vada a capo ci basterà inserire nel luogo opportuno br.
Un esempio
Codice:
E risultato su chrome:
Come aprire il nostro lavoro
Una volta sudato dietro tutte queste cose vogliamo, giustamente, poterle vedere in funzione. Per fare questo basterà, come accennato all’inizio della lezione, salvare il file in formato .html oppure .htm. Una volta fatto ciò possiamo aprirlo cliccandoci sopra, questo si visualizzerà sul nostro browser predefinito.
Arrivederci!
Come sempre speriamo ti sia stato stato utile questo articolo. Ricorda che per il momento nulla di tutto quello che abbiamo fatto è online. Questo lo vedremo fra qualche articolo. Nei prossimi tratteremo anche di altri tag e comandi. Speriamo di rivederti presto! Ricordati di commentare e di fare visita al forum se ne avessi bisogno. Buon coto a tutti!