HTML, HTML5 & CSS

Approfondimenti >

HTML, HTML5 & CSS

Previous pageReturn to chapter overviewNext page
Mostra/Nascondi testo nascosto 

Semplificando, un Sito Web non è altro che un insieme di Pagine messe tra loro in relazione, in base a una gerarchia, attraverso una struttura ipertestuale.

Esistono due tipologie di Pagine Web: statiche e dinamiche. Mentre le prime sono fondamentalmente ipertesti in formato HTML, le seconde fanno uso di linguaggi di scripting.

Ogni Pagina Web ha uno o più URL (Universal Resource Locator), un link permanente che consente di raggiungerla: in altre parole, la URL è l'indirizzo che viene digitato dall'Utente nel proprio Web Browser per poter visualizzare la Pagina.

Clicca per espandere/ridurreHTML

HTML (acronimo di Hyper Text Mark-Up Language) è un linguaggio di markup sviluppato alla fine degli anni '80 da Tim Berners-Lee al CERN di Ginevra e usato per descrivere i documenti ipertestuali disponibili nel Web.

HTML è un linguaggio di pubblico dominio la cui sintassi è stabilita dal World Wide Web Consortium (W3C): durante gli anni ha subito molte revisioni e attualmente l'ultima versione disponibile è la 4.01, resa pubblica nel 1999. Dopo un periodo di sospensione, in cui il W3C si è focalizzato soprattutto sulle definizioni di XHTML (applicazione a HTML di regole e sintassi in stile XML) e dei fogli di stile (Cascading Style Sheet, CSS), nel 2007 è ricominciata l'attività di specifica con la definizione di HTML5 che è stato pubblicato come W3C Recommendation da Ottobre 2014.

Essendo un linguaggio di marcatura e non di programmazione, HTML non ha meccanismi per permette l'interazione: prevede, invece, l'uso di marcatori, detti "tag", che hanno la funzione di indicare come i diversi elementi che compongono una pagina devono essere visualizzati.

Le pagine HTML sono accomunate da un'identica struttura:

Dichiarazione della DTD (Document Type Definition, ovvero Definizione del tipo di documento) adottata.

Con la DTD viene comunicato al browser l'URL delle specifiche html che si stanno utilizzando per il documento: lo scopo è quello di indicare quali elementi, attributi ed entità possono essere lecitamente utilizzati.

Apertura del tag <html>
Sezione HEAD

Questa sezione contiene informazioni, non direttamente visualizzate dai Browser, che riguardano come il documento deve essere interpretato. In questa sezione devono essere collocati i meta-tag (fra cui quelli per i Motori di ricerca), script JavaScript, Fogli di stile, ecc.

Sezione BODY

Questa sezione racchiude il contenuto vero e proprio del documento.

Chiusura del tag </hml>

L'HTML prevede tag specifici per far fronte a molte necessità di formattazione e per fornire molte funzionalità ma occorre ricordare che è stato concepito per definire il contenuto logico e non l'aspetto finale del documento. Pur essendo stato nel tempo piegato per far fronte a scopi presentazionali, l'HTML rimane un linguaggio che dovrebbe essere utilizzato solo per definire la struttura di un documento: per definire come i documento deve essere presentato occorre utilizzare, piuttosto, gli appositi Fogli di stile.

Clicca per espandere/ridurreHTML5

HTML5 si propone come evoluzione dell'HTML 4.01 e introduce molte novità finalizzate, principalmente, a separare in maniera sempre più netta la struttura delle pagine (definita dal markup) dall'aspetto grafico (definito dai CSS) e dai contenuti veri e propri. Fra gli obiettivi che si pone vi sono l'introduzione di nuovi comandi per funzioni fino ad ora ottenute in maniera non standard, garantire una buona compatibilità sui diversi Browser e consentire l'utilizzo di applicazioni basate sul Web anche in assenza di collegamento a Internet. Ampiamente utilizzato, HTML5 è stato pubblicato come W3C Recommendation da Ottobre 2014.

Clicca per espandere/ridurreCSS

I fogli di stile a cascata (dall'inglese CSS Cascading Style Sheets) sono una tecnica che permette di fissare gli stili (per es. tipo di carattere, colori e spaziature) da applicare ai documenti HTML e XHTML. L'introduzione di tale tecnica si è resa necessaria proprio per separare i contenuti dalla formattazione e permettere così una programmazione più chiara e facile da utilizzare, sia per gli autori delle pagine HTML che per gli utenti.

Le regole per comporre i fogli di stile sono contenute in un insieme di direttive (Reccomandations) emanate a partire dal 1996 dal W3C. Le specifiche CSS 2, naturale evoluzione dei CSS 1, sono state emanate nel 1998 e il CSS 2.1 nel 2004. Le specifiche CSS 3 sono costituite da sezioni separate dette "moduli" che hanno differenti stati di avanzamento e stabilità.

Clicca per espandere/ridurreIn WebSite X5

WebSite X5 genera automaticamente codice HTML5 e utilizza i Fogli di stile (CSS 2.1 o CSS 3 a seconda del supporto garantito dai Browser) per definire come i contenuti devono essere visualizzati. La produzione di questo tipo di codice consente di ottenere una serie di rilevanti vantaggi, fra cui:

aderenza agli standard internazionali;
ampia compatibilità con i principali Browser;
maggiori possibilità di una corretta e completa indicizzazione da parte dei Motori di ricerca.

Per quanto concerne l'utilizzo dei Fogli di stile, è bene sottolineare che le Pagine vengono costruite in maniera da poter essere correttamente fruite anche se l'Utente disattiva i CSS durante la navigazione. In questo caso, le Pagine vengono linearizzate: questo significa che si perdono le formattazioni e gli elementi grafici ma rimangono i contenuti presentati in maniera sequenziale e corredati da link interni (skip link altrimenti non visibili) che rendono più semplice la navigazione.

È possibile verificare la navigazione con i Fogli di stile disabilitati utilizzando le apposite funzioni messe a disposizione dai Browser.

Maggiori informazioni su HTML, CSS, standard, procedure di validazione del codice e molti altri argomenti correlati sono disponibili direttamente sul sito del World Wide Web Consortium (W3C): www.w3.org.