Elementi di base HTML

HTML, acronimo di HyperText Markup Language, costituisce il linguaggio fondamentale per la creazione di pagine web.

In questo articolo, ci concentreremo sugli elementi di base di HTML, esaminando i tags per la struttura di base e quelli per la formattazione del testo.

Questi elementi sono fondamentali per la creazione di pagine web strutturate e leggibili.

Tags per la struttura di base

<html>

Il tag <html> è l’elemento radice di ogni pagina HTML.

Racchiude l’intero contenuto della pagina e indica al browser che il documento è scritto in HTML.

<!DOCTYPE html>
<html lang="en">
  <!-- Contenuto della pagina -->
</html>

Il tag <html> include spesso l’attributo lang per specificare la lingua della pagina.

<head>

Il tag <head> contiene informazioni sulla pagina che non sono visualizzate direttamente, come il titolo della pagina, i collegamenti ai fogli di stile e i metadati.

<head>
  <title>Il Mio Sito Web</title>
  <link rel="stylesheet" href="styles.css">
  <!-- Altri elementi head -->
</head>

<body>

Il tag <body> racchiude il contenuto visibile della pagina, come testo, immagini, link e altri elementi.

<body>
  <h1>Benvenuti nel Mio Sito Web</h1>
  <p>Questo è un paragrafo di esempio.</p>
  <!-- Altri elementi body -->
</body>

Tags per la formattazione del testo

<p>

Il tag <p> definisce un paragrafo di testo.

È ampiamente utilizzato per organizzare il testo in blocchi logici.

<p>Questo è un paragrafo di esempio. Lorem ipsum...</p>

<h1>, <h2>, <h3>, <h4>, <h5>, <h6>

Questi tags definiscono titoli di diverse dimensioni, dal più grande <h1> al più piccolo <h6>.

Sono utilizzati per strutturare il testo in sezioni gerarchiche.

<h1>Titolo Principale</h1>
<h2>Titolo di Secondo Livello</h2>
<!-- ... -->
<h6>Titolo di Sesto Livello</h6>

<strong>

Il tag <strong> viene utilizzato per evidenziare il testo, rendendolo visivamente più forte o in grassetto.

<p><strong>Importante:</strong> Leggere attentamente le istruzioni prima di procedere.</p>

Esempi Pratici

Esempio di Pagina HTML Completa

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Il Mio Sito Web</title>
  <link rel="stylesheet" href="styles.css">
</head>
<body>
  <header>
    <h1>Il Mio Sito Web</h1>
  </header>
  <nav>
    <ul>
      <li><a href="#">Home</a></li>
      <li><a href="#">Servizi</a></li>
      <li><a href="#">Contattaci</a></li>
    </ul>
  </nav>
  <section>
    <h2>Benvenuti</h2>
    <p>Questo è il nostro sito web di esempio. Benvenuti!</p>
  </section>
  <footer>
    <p>&copy; 2023 Il Mio Sito Web. Tutti i diritti riservati.</p>
  </footer>
</body>
</html>

Conclusioni

Gli elementi di base di HTML forniscono la struttura fondamentale per ogni pagina web.

Comprendere l’uso corretto di tags come <html>, <head>, <body>, <p>, <h1>, <strong>, e altri è essenziale per creare pagine ben strutturate e facilmente comprensibili.

Pubblicità