Il codice HTML e come funziona una pagina web

pubblicato il:

Una pagina web è una pagina del World Wide Web con collegamenti ipertestuali che abilitano la navigazione da una pagina o una sezione all’altra.

Più pagine web collegate fra loro, ed ospitate sullo stesso server web, costituiscono un sito web.

Le pagine web di solito sono file di testo scritti in un linguaggio HTML, un codice che permette di definire la modalità di presentazione grafica della pagina, la struttura del testo, la  fonte e la dimensione dei caratteri, la presenza di immagini, di video, etc.

A differenza di un file di Word o di un PDF, le pagine web NON contengono fisicamente immagini, o video, ma solo dei riferimenti a file esterni; un meccanismo simile agli XREF di AutoCAD. Le pagine web contengono quindi solo il testo e le informazioni sull’impaginazione. Immagini, animazioni e video sono file a parte.

La sintassi del linguaggio HTML è costituita principalmente da elementi detti Tag che definiscono la struttura grafica della pagina; i Tag sono dei codici convenzionali racchiusi da un segno di maggiore e minore (<tag>).</tag>

Indice

formattazione di base


i TAG < b > o < strong > indicano un testo in grassetto.

es.

L'agile < b >volpe bruna< /b > saltò sul cane infingardo.

viene visualizzata in questo modo:

L’agile volpe bruna saltò sul cane infingardo.


i TAG < i > o < em > indicano un testo in corsivo.

es.

L'agile < i >volpe bruna< /i > saltò sul cane infingardo.

viene visualizzata in questo modo:

L’agile volpe bruna saltò sul cane infingardo.


in combinazione:

L'agile < i >< b >volpe bruna< /b >< /i > saltò sul cane infingardo.

viene visualizzata in questo modo:

L’agile volpe bruna saltò sul cane infingardo.


Avrete notato che questi tag hanno una notazione di apertura (b) e chiusura (/b).

In questo modo si delimita il testo che andrà visualizzato in grassetto.

i Link

Un tag fondamentale è quello che permette di collegare una pagina ad un’altra.

< a href=”indirizzo della pagina” >testo visualizzato< /a >

le Immagini

< img src=”indirizzo del file” width=”larghezza” height=”altezza” />

Struttura del testo

Questo gruppo di tag ha la funzione di definire le varie parti del contenuto della pagina.

< br /> a capo semplice

< p > … < /p > paragrafo

< h1 > … < /h1 > titolo 1 (di solito è il titolo della pagina, ce ne dovrebbe essere solo uno per pagina)

< h2 > … < /h2 > titolo 2 (di solito è il titolo dei capitoli o dei paragrafi)

< h3 > … < /h3 > < h4 > … < /h4 > titolo 3, 4 etc.

< ul > < li > … < /li > < /ul > Elenchi puntati

< ol > < li > … < /li > < /ol > Elenchi numerati

Non hanno solo una funzione grafica, ma soprattutto servono a definire una struttura gerarchica del testo. È un aspetto da non sottovalutare, perché i motori di ricerca valutano l’importanza delle sezioni di testo contenute nella pagina anche in funzione dei tag indicatori.

w