Questo sito contribuisce alla audience di Il Messaggero

Come creare una pagina HTML

di

Recentemente, hai effettuato alcune ricerche per fini lavorativi e, anziché utilizzare il “classico” PowerPoint, vorresti riportarne i risultati in una pagina Web ricca di contenuti, con la quale “impressionare” il tuo capo e ambire, perché no, a un avanzamento di carriera. Il problema, adesso, è che brancoli completamente nel buio, poiché non hai mai provato a capire come creare una pagina HTML prima d’ora, pertanto sei alla ricerca di un corso “intensivo” che possa farti acquisire quantomeno le conoscenze di base per realizzare un lavoro di questo tipo.

Ebbene, sono molto felice di comunicarti che ti trovi nel posto giusto, al momento giusto: di seguito, infatti, sarà mia cura spiegarti i fondamenti della “programmazione” in linguaggio HTML, avendo inoltre cura di fornirti tutti gli strumenti necessari per agire autonomamente in futuro. Lo so, all’inizio potrebbe sembrare piuttosto difficile, ma posso garantirti che bastano un po’ di pazienza e qualche giorno di pratica per raggiungere risultati degni di nota!

Dunque, senza esitare oltre, ritaglia qualche minuto del tuo tempo libero e leggi con attenzione tutto quanto ho da spiegarti sul tema: sono sicuro che, al termine di questa lettura, avrai le idee ben chiare sul da farsi e riuscirai a organizzare al meglio la pagina HTML che avevi pensato per il tuo capo. Detto ciò, non mi resta altro da fare che augurarti buona lettura e buon lavoro!

Indice

Informazioni preliminari

Come creare una pagina HTML

Prima ancora di passare nel concreto e iniziare a scrivere la tua prima pagina HTML, lascia che ti dia qualche informazione utile sul linguaggio e sulle tecnologie con le quali dovrai prendere confidenza per riuscire nel tuo intento.

Per prima cosa, è bene conoscere precisamente il significato della parola HTML: essa è l’acronimo dell’espressione HyperText Markup Language, che puoi tradurre come linguaggio di marcatura per ipertesti. Al contrario di quanto ciò possa lasciare intendere, però, HTML non è un linguaggio di programmazione (poiché non si basa su flussi di azioni collegate tra loro, né su un algoritmo di base), bensì un linguaggio dichiarativo di markup: questa categoria di linguaggi, altro non fa che contrassegnare una serie di elementi e specificarne l’ordine di apparizione.

Nel caso particolare di HTML, il compito del linguaggio è quello di indicare al suo interprete (per esempio il browser) la tipologia degli elementi da visualizzare, oltre che la modalità con cui devono essere disposti all’interno della singola pagina: in particolare, la definizione avviene racchiudendo l’elemento in questione tra due tag, cioè tra due marcatori identificati da termini molto simili all’inglese, compresi tra parentesi angolari (ad esempio, <table> è il tag HTML che identifica una tabella).

Al momento in cui ti scrivo questa guida, la versione più recente di HTML è HTML 5: si tratta di un’evoluzione del linguaggio di base in grado di definire, oltre che la struttura della pagina, anche il comportamento di numerose tipologie di contenuti multimediali (es. flussi video, elementi interattivi, flussi audio e via dicendo) e di monitorare numerosi aspetti del dispositivo da cui le pagine vengono visualizzate (come la percentuale di luminosità dello schermo o le proporzioni da usare per le specifiche risoluzioni), il tutto senza integrare all’interno della pagina componenti “esterne” come elementi Flash o applet Java, tempo fa indispensabili per ottenere risultati simili.

Proprio per questo motivo, ad oggi, HTML 5 viene largamente impiegato, oltre che per l’implementazione di siti e portali Web, anche nello sviluppo di app per smartphone e tablet e nell’implementazione dei pannelli di gestione di altre tipologie di dispositivi “connessi”.

In linea di massima, una pagina creata con solo codice HTML viene definita pagina statica, ossia progettata per mostrare sempre lo stesso contenuto, prevalentemente non modificabile dalle condizioni attuali dell’ambiente da cui viene visualizzata, né dal comportamento dell’utente in fase di navigazione.

Tuttavia, è possibile far collaborare HTML con numerosi altri linguaggi, al fine di costruire pagine più complesse, ricche di contenuti e, soprattutto, dinamiche: tra i linguaggi più conosciuti di questo tipo vale la pena menzionare il CSS, usato per definire lo stile degli elementi che compongono una pagina, e il JavaScript, un linguaggio di programmazione che permette di manipolare dinamicamente la pagina rendendola, se necessario, interattiva.

Parti di una pagina HTML

Dopo averti fornito le nozioni fondamentali riguardo la natura del linguaggio HTML, è arrivato il momento di iniziare il nostro percorso, analizzando la composizione di una pagina di questo tipo e i tag più usati all’interno della stessa.

In primo luogo, è d’obbligo fare una distinzione a dir poco fondamentale: il codice con cui viene creata una pagina HTML viene specificato dal programmatore all’interno di un file di testo semplice, modificabile sia con software di base (come Blocco Note o WordPad su Windows o TextEdit su macOS), sia con altri programmi complessi (primo tra tutti, Adobe Dreamweaver), mentre il contenuto della pagina è quello che viene visualizzato all’interno del browser (le immagini, le parti di testo, i moduli, i bottoni e via dicendo) quando si “naviga” nella pagina.

Di conseguenza, è possibile affermare con certezza che il browser sia un interprete HTML, cioè un programma in modo di “capire” gli elementi specificati nei vari tag della pagina, interpretandone le istruzioni, e di mostrare all’utente la struttura della pagina così generata. A meno che non vengano utilizzati particolari strumenti di sviluppo integrati nei browser, di norma il codice HTML non è visualizzato in fase di navigazione: ciò che viene mostrato a schermo, invece, è la disposizione e la struttura degli elementi della pagina, dettati dalle istruzioni presente nel codice.

Ad ogni modo, così come ti ho accennato poc’anzi, gli elementi che compongono la pagina sono racchiusi tra due marcatoritag, uno di inizio e uno di fine, che possono accettare o meno parametri (in base al tipo di elemento definito): il tag iniziale è composto da un termine simil-anglofono compreso tra due parentesi angolari (come per esempio <table>), mentre il tag finale antepone al termine il simbolo slash o “/” (ad es. </img>).

I parametri, se presenti, vengono indicati nel marcatore iniziale, utilizzando una sintassi simile a parametro=”valore”; ad esempio, per definire il percorso e la larghezza di un’immagine, vengono usati i parametri src=”indirizzo” e width=”dimensione” (ad es. <img src=”https://www.aranzulla.it/img.png” width=”850px” />).

Tali tag vengono indicati, in ordine di apparizione, in un file di testo con estensione .html, per esempio pagina.html. In particolare, esistono alcuni tag che devono obbligatoriamente comparire in un file .html e che ti elenco nel dettaglio di seguito.

  • <!DOCTYPE html> – si tratta del primo tag che dev’essere inserito in un file di codice, utile a specificare che il file in questione contiene una pagina HTML. Se necessario, la versione di HTML utilizzata viene indicata tra i suoi parametri.
  • <html> – si tratta del marcatore che racchiude l’intera pagina. Accetta come parametri diversi aspetti della pagina stessa, come la lingua e lo schema usato dal markup.
  • <head> – questo tag racchiude le informazioni attraverso le quali la pagina viene gestita dagli interpreti (il browser, il crawler dei motori di ricerca e via dicendo): per esempio, è possibile indicare in questo tag il titolo della pagina, la sua icona caratteristica, il set di caratteri e altre informazioni specifiche.
  • <body> – questo marcatore contiene tutte le informazioni relative al corpo della pagina, cioè agli elementi che verranno mostrati a schermo. Per esempio, in questo tag si specificano i titoli e sottotitoli (<h1>, <h2>, <h3> ecc.), i paragrafi e il relativo contenuto (<p>), le immagini (<img>), i collegamenti ipertestuali ancore (<a>), le tabelle (<table>), i moduli (<form>) e così via.

Come costruire una pagina Web HTML

Tutto chiaro fin qui? Benissimo, è arrivato il momento di entrare nel concreto e di capire materialmente come creare una pagina HTML mettendo insieme le informazioni ottenute finora.

Come ribadito più volte, una pagina di questo tipo non è altro che un insieme di specifici tag racchiusi in un file di testo semplice, che saranno interpretati da un browser (o da altri programmi dediti allo scopo) per visualizzare a schermo la struttura pensata da chi costruisce la pagina stessa. Di seguito, ti spiego il funzionamento dei marcatori maggiormente impiegati nella realizzazione di una pagina HTML e specificati nel suo corpo (cioè nella relativa sezione <body>).

  • Titoli e sottotitoli – i marcatori <h1>, <h2><h3>, in genere, vengono usati per specificare i titoli e i sottotitoli della pagina (ad es. <h1>Benvenuti nel mio sito!</h1>). Per impostazione predefinita, il testo racchiuso tra questi tag assume una formattazione diversa, sia per dimensioni che per stile, rispetto a quello presente negli altri elementi della pagina.
  • Paragrafi – il contenuto di un paragrafo viene racchiuso tra i tag <p></p>.
  • Immagini – il tag che permette di includere le immagini in una pagina HTML è <img>. Esso ammette, al suo interno, parametri come src (cioè l’indirizzo dell’immagine), width height (per la definizione delle dimensioni) e align (per definire la disposizione del testo rispetto alla foto in questione).
  • Ancore – i tag ancora (cioè <a> e </a>) permettono di inserire collegamenti ipertestuali all’interno di una pagina HTML. La destinazione del collegamento viene specificata nel parametro href, mentre il testo del link (cioè quello “cliccabile”) viene racchiuso tra i marcatori di inizio e fine (per esempio <a href=”https://www.aranzulla.it>Sito di Salvatore Aranzulla</a>).
  • Tag di formattazione del testo – come puoi facilmente immaginare, esistono dei tag che permettono di definire (almeno in parte) lo stile del testo da visualizzare nella pagina: le parole o le frasi da formattare vengono racchiuse tra i marcatori di inizio e di fine. I più usati sono <strong> (per il testo in grassetto), <em> (per quello in corsivo) e <u> (per quello sottolineato).
  •  Tag di divisione – In alcuni casi, potresti voler dare alle diverse sezioni di una pagina HTML delle caratteristiche particolari, senza però dividerle graficamente attraverso paragrafi, tabelle o frame. Per questo scopo, vengono utilizzati i tag di divisione, o <div>: essi dividono la pagina in sezioni graficamente invisibili, accomunate da caratteristiche specifiche e personalizzabili. Per esempio, è possibile assegnare una classe a un elemento di tipo div (<div class=”NomeClasse”>), per poi definire le peculiarità specifiche degli elementi contenuti al suo interno attraverso il CSS, con un foglio di stile o una definizione in-pagina. Te ne parlerò nel dettaglio all’interno dell’apposita sezione di questa guida.
  • Liste puntate – esattamente come il nome stesso fa intendere, questa tipologia di tag permette di definire degli elenchi puntati e, volendo, ordinati. L’inizio e la fine di una lista puntata sono decretati dai tag <ul> </ul> (unordered list), mentre per la lista ordinata si utilizzano i tag <ol> </ol> (ordered list). Ciascun elemento della lista viene racchiuso nei tag <li> </li> (list item).
  • Moduli – alcuni tag HTML sono specificamente orientati alla creazione di moduli compilabili. Ad esempio, l’inizio e la fine di un modulo vengono specificati dai marcatori <form> </form>, i vari elementi di input (caselle di testo, caselle di spunta e così via) vengono identificati dal tag <input> e specificati dal parametro type. Per creare dei riquadri all’interno di un modulo, invece, viene utilizzato il tag <fieldset>. Ti mostrerò come utilizzare alcuni di questi tag nella sezione dedicata alle pagine di login HTML.

Come creare una pagina HTML di base

Dopo aver analizzato il funzionamento dei marcatori più importanti, sei finalmente pronto a creare la tua prima pagina HTML di base! Di fatto, tutto sta nel mettere insieme tutto quanto visto nelle sezioni precedenti, così da strutturare una pagina Internet vera e propria: senza esitare oltre, apri l’editor di testo incluso nel tuo sistema operativo (come il Blocco Note di Windows TextEdit di macOS) e incolla al suo interno il testo seguente.

<!doctype html>
<html lang="it">
<head>
<title>Ciao a tutti!</title>
</head>
<body>
<h1>Il sito di Salvatore Aranzulla</h1>
<h2>Creato da una guida tematica</h2>
<p class="colore">Ciao! Io sono Salvatore Aranzulla e ho redatto <strong>questa guida</strong> per insegnarti a costruire una pagina Web HTML.</p>
<p>Scommetto che riconosci la città qui sotto!</p>
<img src="https://images.pexels.com/photos/262413/pexels-photo-262413.jpeg" width="640" height="480" />
<p>Per accedere al mio sito Web <a href="https://www.aranzulla.it" target="_blank" />clicca qui.</a></p>
</body>
</html>

Quando hai finito, salva con nome il file appena creato utilizzando l’estensione .html (ad es. ilmiosito.html) e, per visualizzare la pagina all’interno del browser, fai doppio clic sul file appena salvato. Bene: sei appena riuscito a creare la tua prima pagina HTML! Se lo desideri, puoi visionare il codice della pagina facendo clic destro in un punto casuale della stessa e scegliendo l’opzione Visualizza sorgente pagina dal menu proposto dal browser.

Ricorda che, in questo modo, la pagina HTML creata sarà visibile soltanto all’interno del computer che stai usando; se vuoi rendere, invece, la pagina raggiungibile da Internet, devi acquistare uno spazio di hosting che possa ospitarla, da abbinare eventualmente a un dominio per raggiungerla agevolmente. Se sei interessato a questa eventualità, ti invito a consultare la mia guida al miglior hosting.

Come creare una pagina index.html

In genere, una pagina del tipo index.html non è altro che la pagina iniziale di un sito Web che contiene una descrizione (sommaria o dettagliata) del sito stesso, con collegamenti ipertestuali alle altre pagine che lo compongono. Per esempio, se ti appresti a creare un sito personale, la pagina index.html potrebbe comporsi di una breve descrizione di te stesso, una foto e alcuni link che conducono ad altre pagine tematiche, come per esempio una biografia (bio.html), un portfolio (portfolio.html) e una pagina contatti (contatti.html), che devi avere cura di creare separatamente. Tanto per farti un’idea, questo potrebbe essere il codice di una siffatta pagina Internet.

<!doctype html>
<html lang="it">
<head>
<title>Ciao a tutti!</title>
</head>
<body bgcolor="#E6E6FA">
<h1>Il sito di Salvatore Aranzulla</h1>
<h2>Creato da una guida tematica</h2>
<img src="https://www.aranzulla.it/wp-content/contenuti/310188_10150294165022740_611612739_8037918_694847103_n.jpg" width="640" height="480" />
<p>Ciao! Io sono Salvatore Aranzulla e questo è il mio sito di prova.</p>
<ul>
<li><a href="bio.html" target="_blank" rel="nofollow">Biografia di Salvatore </a></li>
<li><a href="portfolio.html">Lavori di Salvatore </a></li>
<li><a href="contatti.html">Contatti di Salvatore </a></li>
</ul>
<p>Per accedere alla sezione guide <a href="https://www.aranzulla.it" target="_blank" />clicca qui.</a></p>
</body>
</html>

Come puoi facilmente intuire, i collegamenti ipertestuali alle altre pagine del sito sono stati inseriti all’interno di una lista puntata non ordinata. Oltretutto, alla pagina è stato assegnato uno sfondo colorato tramite il parametro bgcolor (cioè backgroundcolor) annesso al tag <body>

Come creare una pagina di login HTML

È tuo interesse creare una pagina HTML di login, cioè una parte del sito che permetta l’accesso a una sezione protetta previo inserimento di nome utente e password? Puoi farlo agevolmente utilizzando i tag relativi ai form, di cui ti ho parlato in precedenza, utilizzando un codice simile a quello seguente.

<!DOCTYPE html>
<head>
<title>Pagina di login</title>
</head>
<body>
<div>
<h1>Effettua l'accesso al sito</h1>
<form method="post" action="scriptAccesso.php">
<p><input type="text" name="login" value="" placeholder="Nome utente o email"></p>
<p><input type="password" name="password" value="" placeholder="Password"></p>
<p class="ricordami">
<label>
<input type="checkbox" name="ricordami" id="ricordami">
Ricordami su questo computer
</label>
</p>
<p><input type="submit" name="accedi" value="Acccedi"></p>
</form>
</div>

<div>
<p>Hai dimenticato la password? <a href="ripristina.html">Clicca qui per resettarla</a>.</p>
</div>

La difficoltà, in questo caso, è comunicare al browser come controllare che il nome utente e la password siano stati digitati correttamente, laddove l’utente prema il pulsante per effettuare l’autenticazione (in questo caso, <input type=”submit”>): in genere, quest’operazione viene portata a termine richiamando un particolare script (scritto con linguaggio javascript, php, ASP o altri), che si occupa di confrontare i campi presenti nelle apposite caselle con i record di un database o di un file di testo. Nel summenzionato codice, questo script viene specificato nel parametro action del tag <form>, il quale indica l’azione da intraprendere quando viene pigiato il pulsante di tipo submit (nel nostro caso, “Accedi”).

Per maggiori indicazioni riguardo la procedura di creazione di script di accesso in PHP, ti invito a consultare il tutorial di base di HTML.it.

Come creare una pagina HTML con CSS

Come ti ho già accennato in precedenza, sebbene HTML sia in grado di gestire la formattazione basilare degli elementi, è possibile utilizzare un linguaggio specifico che permetta di modificarne l’estetica, la disposizione e le decorazioni a proprio piacimento: il CSS. Tale linguaggio ha una sintassi estremamente diversa da quella di HTML, principalmente incentrata sulla definizione grafica dei vari elementi.

Questa tipologia di codice può essere inclusa in una pagina HTML in due modi: il primo, utile quando gli elementi sono pochi e limitati a una singola pagina, consiste nel racchiuderlo all’interno dei tag <style> </style>, dichiarati nella sezione <head>.

Il secondo, invece, prevede la scrittura del codice all’interno di un file di testo dotato di estensione .css, che può essere importato in una o più pagine HTML utilizzando il tag <link> (ad es. <link href=”fogliostile.css” target=”_blank” rel=”nofollow” rel=”stylesheet” type=”text/css”>) ; anche in questo caso, il marcatore viene specificato nella sezione <head> della pagina.

Per esempio, di seguito ti illustro il codice di un foglio di stile CSS che possa colorare tutti gli elementi appartenenti alla classe colore: in particolare, il testo verrà colorato di blu, con sfondo nero e sarà sovrastato da una linea. Inoltre, la spaziatura dei caratteri verrà aumentata a 5 pixel.

.colore { color:blue; background-color:black; text-decoration:overline; letter-spacing: 5px;}

Per verificare il funzionamento del foglio di stile, incolla il codice qui sopra in un file di testo semplice e salvalo con il nome stile.css, all’interno della stessa pagina in cui hai precedentemente salvato la pagina HTML di base.

Per incorporare il foglio, apri quest’ultima in modifica (facendo clic destro con il mouse sul file .html, scegliendo la voce Apri con dal menu proposto e selezionando il programma Bloco Note/TextEdit dalla lista successiva) e, subito sotto il tag <head>, inserisci la stringa specificata qui sotto.

<link href="stile.css" rel="stylesheet" type="text/css">

Per concludere, salva il file, fai doppio clic sul rispettivo html e… goditi il risultato!

Strumenti per la creazione di pagine HTML

Se sei arrivato fin qui, vuol dire che hai acquisito le conoscenze di base necessarie per creare una pagina HTML e che sei pronto a muovere i primi passi in completa autonomia. Dunque, una volta compreso l’utilizzo dei tag e le modalità per costruire la struttura di una pagina Web, vorresti avere una panoramica completa degli strumenti che possano contribuire a realizzare agevolmente il tuo lavoro: di seguito ti indico quelli che, a mio avviso, potrebbero tornarti più utili.

Editor HTML

Sei interessato a qualche programma che ti permetta di realizzare siti HTML, anche con l’ausilio di una parte grafica che ti permetta di creare nuovi elementi anche con tastiera e mouse e senza necessariamente agire sul codice? Ebbene, editor HTML di questo tipo prendono il nome di WYSIWYG (what you see is what you get, che puoi tradurre con ciò che vedi è ciò che ottieni) e sono diffusi sia a livello amatoriale che a livello professionale. Qui sotto te ne indico alcuni.

  • BlueGriffon – si tratta di un editor HTML basato sul motore del browser Firefox, che include un ottimo modulo WYSIWYG ma, all’occorrenza, permette di lavorare anche in modalità solo codice, funzionalità utilissima per i più esperti. Puoi scaricarlo gratuitamente dal suo sito Internet ufficiale.
  • Amaya – è un editor HTML open source creato e distribuito dal consorzio W3 (W3C). Esso permette, grazie a una comoda interfaccia WYSIWYG, di realizzare pagine e interi siti in HTML, fogli di stile, piccoli script e altre parti di piattaforme Web, anche “disegnando” il tutto con il mouse. Puoi scaricare Amaya da questa pagina.
  • Adobe Dreamweaver – è uno strumento semi-professionale estremamente potente che, grazie ai vari strumenti presenti al suo interno, permette di progettare siti Internet semplici e complessi. Oltre che essere un editor HTML, Dreamweaver può gestire fogli di stile CSS, JavaScript, file di grafica e molto altro. Puoi acquistare Dreamweaver (con possibilità di prova gratuita per 7 giorni) dal suo sito Internet ufficiale.

Quelli che ti ho menzionato sono alcuni degli editor HTML più utilizzati, ma non sono gli unici: a tal proposito, ho realizzato per te una guida specifica sui programmi HTML, in cui potrai trovare tanti altri software di questo tipo che possano aiutarti a portare a termine il tuo lavoro.

Come creare una pagina HTML con Blocco Note

Come dici? Preferisci restare sul “classico” ed esercitarti a scrivere codice HTML utilizzando soltanto il Blocco Note di Windows? Sono qui per accontentarti! Tieni ben presente che questo programma è stato progettato per scrivere degli elementari file di testo, pertanto non prevede funzionalità specifiche per l’editing HTML (come segnalazione degli errori, suggerimento dei parametri e così via).

Tutto chiaro? OK, procediamo: per prima cosa, avvia il programma richiamandolo dalla cartella Accessori Windows del menu Start (l’icona a forma di bandierina collocata nell’angolo in basso a destra dello schermo), digita al suo interno il codice HTML di tuo interesse e recati nel menu File > Salva con nome…, collocato in alto a sinistra, per accedere alle opzioni di salvataggio.

A questo punto, seleziona l’opzione Tutti i file (*.*) dal menu a tendina Salva come e indica un nome da assegnare al file nell’apposito campo di testo, avendo cura di specificare l’estensione .html (ad es. miosito.html). Quando hai finito, premi sul pulsante Salva e il gioco è fatto.

Come creare una pagina HTML con Word

Microsoft Word è un programma estremamente potente che, all’occorrenza, può essere utilizzato per creare ottime pagine HTML in modalità WYSIWYG. Come? Semplicissimo! Per prima cosa, avvia il programma e utilizza gli strumenti presenti in esso (come tabelle, grafici, formattazione del testo, liste, immagini e quant’altro) per costruire la pagina Web così come vorresti visualizzarla nel browser.

Quando hai finito, clicca sul menu File di Word, scegli l’opzione Salva con nome, indica la cartella in cui effettuare il salvataggio del file e, successivamente, specifica il nome del file e imposta il menu a tendina Salva come (Formato file su Mac) sulla voce Pagina Web, se ti interessa il solo salvataggio del testo, oppure su Pagina Web in file unico per salvare anche le immagini, i font usati e gli altri elementi “esterni” a Word all’interno dello stesso file.

Nota: per mantenere fede alla formattazione originale, Word potrebbe aggiungere alcuni tag “proprietari” al fine di non alterare la visualizzazione della pagina. Se è tua intenzione escluderli e limitarti a salvare i soli marcatori HTML, devi selezionare la voce Pagina Web Filtrata dal menu a tendina Salva come/Formato file.

Come creare una pagina HTML online

Come dici? Hai intenzione di creare la tua pagina HTML direttamente su Internet, senza installare alcun programma sul tuo computer? Allora un CMS potrebbe fare al caso tuo: di fatto, un Content Management System è un sistema, anch’esso scritto in linguaggio Web, che permette di gestire tutte le fasi della creazione di una pagina HTML (o di un intero sito Internet) attraverso un portale di gestione dotato di interfaccia grafica.

Su Internet, esistono diversi CMS gratuiti (che offrono anche uno spazio di hosting) che permettono di creare e pubblicare agevolmente una o più pagine Web: due dei più utilizzati al giorno d’oggi sono sicuramente WordPress.com e Google Sites, di cui ti ho parlato dettagliatamente nelle mie guide su come creare un sito con WordPress e come creare un sito con Google Sites.

Esistono, inoltre, piattaforme più orientate alla creazione di pagine HTML statiche, come Weebly, Yola Xoom: ti ho spiegato nello specifico il loro funzionamento nella mia guida su come creare un sito Web gratis.

Risorse utili

Ora che hai appreso tutte, ma proprio tutte, le tecniche di base per la creazione di svariate tipologie di pagine HTML, hai iniziato a prenderci gusto e vorresti approfondire la conoscenza dell’argomento, poiché hai intuito che la potenza di HTML va ben al di là di quanto ti ho spiegato nelle battute precedenti di questa guida? Non preoccuparti, non ho intenzione di lasciarti solo, neanche in questa fase: nelle righe a venire, ho infatti tutta l’intenzione di fornirti ulteriori risorse da consultare per accrescere le tue conoscenze sul tema.

  • Guida HTML di HTML.it – con molta probabilità, si tratta di una delle guide più complete, articolate e ricche di approfondimenti disponibili in Rete: è suddivisa in sezioni tematiche e include autentiche lezioni, esempi pratici ed esercitazioni di vario tipo. Oltretutto, la guida di HTML.it viene costantemente aggiornata.
  • W3Schools.com – questo portale, promosso e pubblicato dal W3C, è interamente dedicato al linguaggio HTML e alle altre tecnologie che vi girano intorno. La sua particolarità è quella di poter eseguire numerosi esercizi di auto-verifica, al termine di ciascuna lezione, per verificare e valutare le nuove competenze acquisite.
  • HTML 5 con CSS e JavaScript – se al digitale preferisci la carta stampata, non puoi non dare un’occhiata a questo testo: oltre che essere un manuale di base per realizzare siti HTML, è un riferimento piuttosto completo per la creazione di applicazioni mobile (e non) basate sul Web, che combinano il linguaggio HTML 5 con il CSS e il JavaScript.