Componenti di un  sito web

a) Front-end

La parte che rende visibile il sito  agli utenti:

  • HTML (HyperText Markup Language): struttura della pagina

  • CSS (Cascading Style Sheets): stile e colori

  • JavaScript: interazioni dinamiche

b) Back-end

La parte non visibile, che gestisce i dati:

  • Linguaggi come PHP, Python, Node.js

  • Database (es. MySQL)


 Struttura base di una pagina HTML

<!DOCTYPE html>

<html>

<head>

<title>Titolo della pagina</title>

</head>

<body>

<h1>Benvenuto nel mio sito!</h1>

<p>Questa è una pagina di esempio.</p>

</body>

</html>

Questo è il codice minimo per creare una pagina web.

Software di base per sperimentare il coding

  • Editor di codice: Visual Studio Code

La sintassi

HTML è un linguaggio che usa dei tag per creare e organizzare gli elementi all’interno di una pagina.
Ogni tag permette al browser (Chrome, Firefox, ecc.) di capire che tipo di contenuto si sta mostrando: ad esempio un paragrafo, un link, un titolo o un’immagine.


I TAG

Un tag è un piccolo codice scritto tra parentesi angolari (< >).
Di solito ogni elemento HTML è formato da due tag:

  • un tag di apertura, es. <p>

  • un tag di chiusura, es. </p> (notare la barra /)

Tutto ciò che sta tra i due tag è il contenuto dell’elemento.
Ad esempio:

<p>Questo è un paragrafo</p>

In questo caso:

  • <p> è il tag di apertura

  • </p> è il tag di chiusura

  • “Questo è un paragrafo” è il contenuto

Ogni tag definisce un tipo di elemento nella pagina web.

La parte finale della pagina web si chiama Footer


Sintassi HTML di un link

In HTML, si usa il tag <a> (che sta per anchor, ancora).

<a href="https://www.wikipedia.org</a>

 

  • <a> = tag di apertura del link

  • href = attributo che indica l’indirizzo (URL) della pagina di destinazione

  • Il testo tra i tag è quello che l’utente vedrà (e su cui potrà cliccare)

  • </a> = tag di chiusura

sostieni e clicca su un annuncio

sostieni e clicca su un annuncio

sostieni e clicca su un annuncio