Vai al contenuto
Home » Notes » HTML: Storia, Caratteristiche, Struttura

HTML: Storia, Caratteristiche, Struttura

html storia struttura caratteristiche del linguaggio di markup delle pagine web

Appunti su HTML: Storia, Caratteristiche, Struttura. HTML, HyperText Markup Language è il linguaggio in cui è costruita la struttura delle pagine di un sito Web ed è proprio il linguaggio che il tuo browser traduce per generare e disegnare la pagina finale.

Storia di HTML – infografica riassuntiva

Come è fatto HTML 5?

Un esempio semplice i codice HTML 5 per creare una pagina con un titolo e una sezione che racchiude un sottotitolo e un paragrafo.

Questo codice, letto dal browser, dà origine a questa pagina:


hello world in html 5 rendered by browser

HTML: Elementi, Attributi, Tag, Entità

Come è strutturato HTML? Che differenza c’è tra elementi , attributi, tag ed entità HTML?

I tag HTML sono parti del linguaggio di markup che definiscono la fine e l’inizio di un elemento. Nell’esempio sopra, il titolo inizia con il tag di apertura <h1> e finisce con il tag di chiusura </h1>.

Esistono quasi 100 tag (lista completa qui): titoli, sottotitoli, paragrafi, contenitori, tabelle, pulsanti, immagini, sono solo alcuni dei tag esistenti in HTML. I tag possono contenere attributi.

Gli attributi HTML sono stringhe opzionali, inseribili dentro al tag di apertura di un elemento che ne controllano il comportamento o ne assegnano delle proprietà. Esempi classici sono l’attributo src di una immagine e l’attributo href del tag a che indica il link.

<img src= ".."/>
<a href = ".."> testo link </a>

Gli elementi HTML sono parti di documento dotate di senso proprio e formate da tag di apertura, contenuto, e tag di chiusura. Nell’esempio sopra, l’elemento div è formato da un tag di apertura <div>, il contenuto cioè il sottotitolo e il paragrafo, e un tag di chiusura </div>.

Infine, le entità HTML sono pezzi di codice utilizzati per indicare al documento di mostrare caratteri speciali o riservati al linguaggio come <, >, & , lettere accentate, eccetera.

Caratteristiche di HTML

Indice delle caratteristiche di HTML:

  1. Case sensitiveness
  2. Whitespace
  3. Buona forma in HTML
  4. Attributi globali

Case Sensitiveness di HTML

HTML è case-unsensitive. Questo significa che il tag <input> scritto in minuscolo e il tag <INPUT> scritto in maiuscolo sono entrambi correttamente interpretati e rappresentano lo stesso tag. Vale lo stesso per gli attributi.

Whitespace

HTML collassa gli spazi bianchi e i caratteri di ritorno a capo. Dovrai usare &nsbp per generare uno spazio non collassabile.

La buona forma in HTML

Mentre XHTML, derivando in parte da XML, ha dato rilievo alle regole di “buona forma” (annidamento corretto, tag chiusi, presenza di elemento radice, ecc), con HTML 5 il browser è in grado di processare anche documenti HTML che non rispettano regole di buona forma, facendo una sorta di “interpretazione”.

Questo, se da un lato ha permesso ai browser di rendere visualizzabile qualsiasi documento HTML, ha lasciato maggiore libertà e margine di errore agli sviluppatori web.

Ha inoltre reso ancora più complicato estrarre dati ed effettuare manipolazioni automatiche dei contenuti a causa della “eterogeneità” e della “non-standardizzazione” delle pagine web.

Attributi globali

Gli attributi globali sono attributi definiti su tutti gli elementi del linguaggio. Li classifichiamo in coreattrs, i18n e attributi di evento.

Gli attributi coreattrs sono attributi con funzionalità predefinite da HTML e sono id, class, style e title. Questi attributi hanno un ruolo preciso, rispettivamente quello di identificare l’elemento, assegnargli una lista di classi, assegnargli una o più proprietà di stile, aggiungergli un titolo.

i18n sta per “internationalization” e comprende gli attributi lang e dir chespecificano il linguaggio del documento.

Attributi di evento: gli attributi di evento permettono di associare funzionalità ad un certo elemento al verificarsi di qualche evento. Ad esempio, tramite l’attributo evento onclick=”miaFunzione()” è possibile eseguire la funzione specificata quando l’utente clicca su quell’elemento.

altri appunti a tema tecnologie web

Grazie per la lettura

Lascia un commento

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