Introduzione all’HTML
HTML, acronimo di HyperText Markup Language, è il linguaggio standard utilizzato per creare pagine web. È un linguaggio di markup, il che significa che utilizza “tag” per definire la struttura e il contenuto delle pagine web.
Struttura di Base di un Documento HTML
Un documento HTML è strutturato in modo gerarchico, con elementi annidati l’uno nell’altro. Ecco un esempio di una struttura HTML di base:
<!DOCTYPE html>
<html lang="it">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Titolo della Pagina</title>
</head>
<body>
<h1>Ciao, Mondo!</h1>
<p>Questo è un paragrafo di esempio.</p>
</body>
</html><!DOCTYPE html>: Dichiara il tipo di documento e indica che si tratta di un documento HTML5.<html>: L’elemento radice che racchiude tutto il contenuto del documento HTML.<head>: Contiene meta-informazioni sulla pagina, come il titolo e i metadati.<title>: Definisce il titolo della pagina, visualizzato nella scheda del browser.<meta>: Fornisce informazioni sui dati, come il set di caratteri e la viewport per i dispositivi mobili.<body>: Contiene il contenuto visibile della pagina, come testi, immagini e link.
Principali Tag HTML
HTML utilizza una serie di tag per definire diversi tipi di contenuti e struttura. Ecco alcuni dei tag più comuni:
- Titoli e Testo:
<h1> - <h6>: Definisce titoli, con<h1>il più importante e<h6>il meno importante.<p>: Definisce un paragrafo di testo.<strong>e<em>: Definiscono rispettivamente testo in grassetto e corsivo.
- Liste:
<ul>: Definisce una lista non ordinata (puntata).<ol>: Definisce una lista ordinata (numerata).<li>: Definisce un elemento di lista.
- Link e Immagini:
<a>: Definisce un link ipertestuale. Attributo principale:hrefper specificare l’URL.<img>: Definisce un’immagine. Attributi principali:srcper il percorso dell’immagine,altper una descrizione testuale alternativa.
- Tabelle:
<table>: Definisce una tabella.<tr>: Definisce una riga della tabella.<td>: Definisce una cella della tabella.<th>: Definisce una cella di intestazione.
- Form:
<form>: Definisce un modulo HTML per l’inserimento di dati.<input>: Definisce un campo di input (testo, password, etc.).<button>: Definisce un pulsante.
Attributi HTML
I tag HTML possono avere attributi che forniscono ulteriori informazioni sugli elementi. Gli attributi sono specificati all’interno del tag di apertura e assumono la forma nome="valore".
Esempi di attributi comuni:
href(per<a>): Specifica l’URL di un link.src(per<img>): Specifica il percorso di un’immagine.alt(per<img>): Fornisce testo alternativo per l’immagine.classeid: Specificano nomi di classe e identificatori univoci per lo stile CSS o la manipolazione con JavaScript.
Commenti in HTML
Puoi aggiungere commenti al codice HTML che non verranno visualizzati nel browser:
<!-- Questo è un commento -->Conclusione
HTML è il fondamento di qualsiasi pagina web. Comprendere come strutturare correttamente un documento HTML è essenziale per qualsiasi sviluppatore web. Conoscendo i tag, gli attributi e la struttura di base di HTML, puoi iniziare a costruire pagine web statiche che possono essere ulteriormente migliorate con CSS e JavaScript.
