Sei qui: blog » HTML, il linguaggio delle pagine web

HTML, il linguaggio delle pagine web

Un ipertesto è un insieme di documenti messi in relazione tra loro per mezzo di parole chiave. La caratteristica principale di un ipertesto è che la lettura può svolgersi in maniera non lineare: qualsiasi documento della rete può essere "il successivo", in base alla scelta del lettore di quale parola chiave usare come collegamento.

Le pagine web non sono altro che degli ipertesti informatici, dove il computer ha automatizzato il passaggio da un documento all’altro. Fisicamente, sono dei semplici file di testo, con estensione HTM o HTML (il perché della versione corta dovete chiederlo a Microsoft, dato che il suo DOS accettava estensioni di massimo 3 caratteri), all’interno dei quali si trova codice HTML.

L’HTML (HyperText Markup Language, ovvero "linguaggio a marcatori per ipertesti") è un linguaggio di formattazione (e NON di programmazione) di pubblico dominio, che consiste nell’inserimento nel testo di marcatori, detti tag, che descrivono caratteristiche come la funzione, il colore, le dimensioni, la posizione relativa all’interno della pagina; la sintassi dell’HTML è stabilita dal World Wide Web Consortium (W3C). Dato che l’HTML è stato concepito per definire il contenuto logico e non l’aspetto finale del documento, non esiste alcuna garanzia che uno stesso documento venga visualizzato in egual modo su due dispositivi; e questa è una cosa da tenere bene a mente, dato che troppo spesso la si dimentica fino a quando si nota una pagina assurdamente caotica aperta in un computer che non avevamo preso in considerazione nei test...

Elementi sintattici

Il componente principale della sintassi dell’HTML è l’elemento; ogni elemento è racchiuso all’interno di marcature dette tag, costituite da una sequenza di caratteri racchiusa tra i segni minore e maggiore (per esempio, <br>, che serve ad indicare un ritorno a capo). Quando il tag deve essere applicato a una sezione di testo o di codice, l’ambito di applicazione deve essere delimitato fra un tag di apertura ed uno di chiusura (chiusura esplicita), che coincide col tag di apertura preceduto da una barra (/) dopo la parentesi angolare aperta (per esempio: <b>testo</b>, dove "testo" verrà visualizzato in grassetto all’interno del browser). Alcuni tag presentano un’applicazione puntuale, come per esempio il già citato <br> o <img> che serve per inserire un’immagine in un determinato punto della pagina, e in quanto tali non richiedono il tag di chiusura; in questo caso si parla di tag a chiusura implicita.

Struttura di una pagina web

Un documento HTML comincia con l’indicazione della definizione del tipo di documento (Document Type Definition o DTD), che dice al browser quali specifiche HTML vengono utilizzate per il documento.

Dopo il DTD, il documento HTML presenta una struttura ad albero annidato, composta da sezioni che al loro interno contengono a loro volta sottosezioni più piccole, tutte delimitate da tag, ma inserite nell’ordine di preferenza, purché non vadano ad incrociarsi (come nei casi in cui l’apertura di una seconda sezione precede la chiusura di quella precedente).

La struttura più esterna è quella che delimita l’intero documento, eccetto la DTD, ed è compresa tra i tag <html> e </html>. All’interno dei tag lo standard prevede sempre la definizione di due sezioni ben distinte e disposte in sequenza ordinata:

  • la sezione di intestazione o header, delimitata tra i tag <head> e </head>, che contiene informazioni di controllo normalmente non visualizzate dal browser, con l’eccezione di alcuni elementi come il titolo della pagina;
  • la sezione del corpo o body, delimitata tra i tag <body> e </body>, che contiene la parte informativa vera e propria, ossia il testo, le immagini e i collegamenti che costituiscono la parte visualizzata dal browser.

La struttura sufficientemente basica di una pagina HTML5 è quindi:

<!doctype html>
<html>
<head>
</head>
<body>
</body>
</html>

Tag base di una pagina web

I tag che più facilmente e/o frequentemente vengono usati nella sezione BODY sono:

  • Titolo (h1-h6)
  • Paragrafo (p)
  • Grassetto (b)
  • Corsivo (i)
  • Link (a) (parametri: href, target, title, id)
  • Immagine (img) (parametri: src, width, height, alt, title)
  • Interruzione di linea (br)

Ad essi si aggiungono quelli per le liste:

  • Lista ordinata (ol) (parametri: start, type(1|a|A|i|I), reversed)
  • Lista non ordinata (ul)
  • Singolo elemento della lista (li)

...e quelli principali per le tabelle:

  • Tabella (table)
  • Riga della tabella (tr)
  • Cella di intestazione della tabella (th)
  • Cella normale (td)

Con questi elementi, si può creare già la gran parte delle pagine disponibili nel web, come vedremo nella prossima lezione.


Lascia un tuo commento

Informazioni

inserita il 17/06/2013
visualizzata 1794 volte
commentata 0 volte
totale pagine: 503
totale visite: 608894

Cerca nel blog

Cerca tra i contenuti pubblicati nel blog:

Categorie

Cerca tra le categorie presenti nel blog:

Pagine più recenti

Pagine più lette

Pagine più commentate

Ultimi commenti

Tag del blog

accompagnatore turistico (47) aerei ed altri oggetti volanti (3) America Centrale (7) amicizia (11) anniversari ed altre ricorrenze (9) appunti di studio (27) astronomia ed astrofilia (3) bambini (11) bicicletta (2) biglietti aerei (3) blog e siti web (15) bucket list (2) calcio (2) campeggio in tenda (2) carta di credito (2) Castegnero (3) Città del Vaticano (2) comici (3) comicità in TV (2) compleanni ed altre ricorrenze (7) concorsi a premi (6) consigli (2) consigli per viaggiatori (10) corsi on line (6) cose buffe (13) CouchSurfing (2) Coursera (9) cultura (2) customer service (2) cybercrime (2) diritti dei consumatori (2) disastri aerei (2) dove dormire in viaggio (6) draghi (6) dubbi esistenziali (3) economia (2) Ecuador (2) elezioni (5) Elizabeth (4) esame per licenza di accompagnatore (35) esami (33) Europa (3) Facebook (2) fantascienza (13) fantasy (10) Federica Cuman (2) film (32) filosofia orientale (3) fotografia (2) fumetti (9) furti e altre malefatte simili (2) Game of Thrones (22) geografia (3) giustizia (3) governo (2) grammatica (2) guerre e conflitti (7) Guerre Stellari (3) House of Cards (2) Il Signore degli Anelli (2) immigrazione (2) impegno civile (2) informatica (2) internet (9) investigatore privato (2) istruzioni per l'uso (2) Italia (2) JLA (2) lavoro (51) legge e normativa (3) leggi e normativa (7) lettere (2) lingua Esperanto (3) lingua inglese (2) Lo Hobbit (2) mare (2) matrimoni che finiscono male (3) Medio Oriente (5) morale (4) musica (7) omofobia (2) Pablo Neruda (2) Papa (2) papà (6) parenti (10) paura (2) pecorElettriche.it (7) pista pedociclabile (2) poesie (4) politica (23) premio Wanderlust (4) Presidente della Repubblica (2) privacy (3) professionalità (2) programmatore (2) Quentin Tarantino (3) Rat-Man (3) razzismo (7) referendum (3) religione (7) riflessioni profonde (3) ristoranti (2) riviste (2) saggi (5) salute (7) San Valentino (2) scienza (6) serie TV (36) servizi postali (2) Sherlock Holmes (7) Sindaco (2) social network (3) sogni (2) spazio infinito (3) spettacoli televisivi (2) sport (2) Stati Uniti d'America (7) storia (2) storie ben scritte (3) storie d'amore (15) studi (2) Sud America (6) supereroi (6) tecnologia (3) telefono (2) terrorismo (3) Tolkien (3) tradimento (4) treni (2) Twitter (3) vacanze (2) viaggi (19) violenza (2) vita da Tour Leader (7) vita e morte (23) Wall-e (5)