Imparare l’HTML – Le basi – Struttura di una pagina

Hai deciso di imparare il linguaggio HTML ma non hai idea da dove cominciare? Vuoi un corso gratuito di HTML semplice e facile da capire, senza troppi dettagli, quel che basta per indirizzarti verso la creazione dei siti web?

Sei nel posto giusto! Noi di BytePost abbiamo deciso di pubblicare un corso sulle basi dell’HTML e CSS racchiuso in una serie di articoli collegati tra loro, in modo che chiunque con un minimo di voglia possa iniziare a realizzare pagine web con questo linguaggio.

Per iniziare questo corso non hai bisogno di conoscere già l’HTML o altri linguaggi. Qui inizi da zero!

Questo sarà il primo di una serie di guide, dove spiegherò le le basi per imparare l’HTML per la creazione di siti e pagine internet, senza dilungarmi troppo su dettagli poco rilevanti ed informazioni (al momento) non necessarie.

Non ti spaventare! Può capitare di non comprendere appieno quello che stai leggendo. Prosegui con la lettura, completa ogni articolo singolarmente per capire meglio il contenuto descritto. In fondo a molti post sono presenti degli esempi in HTML utili, leggi ed interpreta ogni riga di codice (è l’unico modo per impararlo realmente) e riscrivilo nel nostro editor HTML dedicato.

Guarda in nostro video introduttivo, e già che ci sei iscriviti al nostro canale YouTube!

Per qualsiasi dubbio scrivi nei commenti in fondo alla pagina o contattaci e ti aiuteremo a risolvere i tuoi problemi!

Se sei pronto ora, iniziamo!

Imparare l’HTML

Come è strutturata una pagina web

Una pagina web creata in HTML è strutturata nel modo più semplice e basilare possibile. Per semplificare la comprensione possiamo dire che ogni pagina è divisa in sezioni, che vengono indicate tramite appositi tag HTML. La suddivisione di base è semplice, e si può riassumere in testa e corpo:

  • Testa o Head è la parte non visibile del sito. Questa sezione contiene molte informazioni importanti ed utili come:identità della pagina e del sito, il titolo principale, script, meta tag, collegamenti, stili e codici di vario genere;
    Questa sezione è racchiusa nei tag <head>…</head>.
  • Corpo o Body, al contrario della precedente questa sezione determina la parte visibile della pagina, quella a contatto diretto con gli utenti e in cui possono interagire. Racchiusa nei tag <body>…</body> contiente elementi come: testi, paragrafi, tabelle, immagini, link ecc…;
Esempio struttura di una pagina html
Esempio della struttura di una pagina HTML

Esempio

Un esempio di struttura base di una pagina web scritta in linguaggio HTML potrebbe essere questo:

<!DOCTYPE html>   <!--Istruzione della versione HTML-->
<html>             <!--tag di apertura del documento HTML-->
   <head>          <!--testa del sito-->
   </head>
   <body>          <!--corpo del sito, parte visibile-->
   </body>
</html>            <!-- tag di chiusura HTML-->

Per comprendere meglio questo esempio di codice, dobbiamo fare dei chiarimenti:

  • Ogni tag è racchiuso tra i simboli minore(<) e maggiore(>) in questo modo: <tag>
  • Per determinare la loro chiusura, basterà inserire il simbolo / (slash) prima del tag dichiarato e davanti al simbolo minore, così: </tag>
  • I tag <html> e </html> indicano l’apertura e la chiusura dell’intero documento, realizzato in linguaggio HTML.
  • Il tag iniziale <!DOCTYPE html> serve a specificare la versione HTML utilizzata per creare la pagina, come istruzione per il browser che elaborerà il codice. In questo caso indica HTML 5;
  • I tag <!– e –> aprono un commento nel codice utile per lo sviluppatore, che non sarà visibile nel sito agli utenti;

Questi concetti sono le basi per la creazione di pagine in HTML per una pagina web. Ora sarà necessario inserire il reale contenuto del sito, le parti necessarie a dar vita alla pagina e definire tutti i dettagli per il corretto funzionamento.

Per far ciò bisogna inserire altri tag specifici, con ognuno la funzione differente che vedremo nei seguenti articoli.

Pensavi fosse più difficile? Faccelo sapere nei commenti. Iscriviti alla nostra Newsletter per rimanere aggiornato sulla pubblicazione dei nuovi articoli del corso e seguici su Facebook.

Impara a scrivere codice e a realizzare pagine HTML con il nostro editor online gratuito


Leggi anche: Come creare e visualizzare una pagina HTML

Articoli Recenti:

Lascia un commento

Il tuo indirizzo email non sarà pubblicato. I campi obbligatori sono contrassegnati *

CAPTCHA