-
.
Elementi base di una pagina web
Una pagina web è composta fondamentalmente da marcatori, o tag, che stabiliscono delle regole su come debba essere strutturato e formattato il relativo documento che intendono descrivere.
Questi tag possono essere di tipo two-sides (detti anche elements), espressi mediante l'indicazione di un tag di apertura e chiusura nella forma, oppure di tipo one-sides (deti anche void o empty elements), espressi mediante l'indicazione del solo tag di apertura nella forma <elem_name> o <elem_name>. Inoltre essi possono averedegli attributi, ossia del testo scritto al loro interno in una forma chiave/valore, che permettono di specificare opzioni o dettagli supplementari.
Vediamo allora un primo esempiodi definizione di una semplice pagina HTML.CODICE<!DOCTYPE html>
<html>
<head>
<title>La nostra prima pagina in HTML5</title>
<meta name="keywords" contest="web, html5" charset="utf-8">
</head>
<body>
<p> Lorem ipsum dolor sit amet, consectetur adipisici elit,<br /> sed eiusmod tempor incidunt ut labore et dolore magna aliqua.</p>
<p>Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat.</p>
<p>Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur.</p>
<p>Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p>
</body>
</html>
Nel codice notiamo subito la presenza, come primo elemento, del tag <!DOCTYPE html>, che rappresenta un'struzione che dà al browser un'indicazione del tipo di codice di cui dovrà eseguire il parsing. In pratica, un documento HTML, tramite l'elemento DOCTYPE, dice al browser che il suo codice è conforme allo standard ivi indicato, e nel nostro caso esso asserisce che è conforme a HTML5.Abbiamo poi il tag <html>, il principale contenitore di un documento HTML, che è indicato anche con il termine di elemento root (radice). Al suo interno si inseriscono tutti gli elementi HTML. Segue il tag <head>, che rappresenta una sorta di intestazione (header section): qui si inseriscono dei tag che non sono interpretati come elementi che visualizzano o formattano qualcosa direttamente nell'area di renderizzazione del browser.
Si tratta di tag come i seguenti:- <title>: indica il titolo della pagina e ha un grande valore sematico. Viene visualizzato nella barra del titolo dei browser.
- <meta>: permette, tra le altre cose, di indicaredelle parole inerenti alla tipologia o l'indicizzazione dai motori di ricerca e di specificare la codifica di caratteri utilizzata nei propri documenti HTML.
- <script></script>: consente di inserire del codice di scripting nella pagina web
- <link>: consente di collegare al documente altre risorse a esso esterne.
SPOILER (clicca per visualizzare)Nota
L'elemento meta viene utilizzato per fornire dei metadati per il documento HMTL, principalmente attraverso l'attributo name, utilizzato per indicare il nome del metadato, e può avere come valori author (fornisce il nome dell'autore della pagina); description (fornisce una descrizione della pagina); keywords (fornisce una serie di parole rilevanti per la pagina) e così via. Abbiamo poi l'attributo content, che è utilizzato per indicare il valore del corrispondente attributo name.
Infine, dopo il tag </head> abbiamo il tag <body>, che rappresenta la sezione più importante di una pagina web, poichè al suo interno sono definiti tutti i quei tag che descrivono il contenuto da visualizzare nel browser. Nel nostro esempio, usiamo il tag <p>, che indica di formattare il testo in esso indicato come un paragrafo (da notare come il browser abbia posto degli spazi tra i vari paragrafi), e il tag
che indica di spezzare una riga.Guida a cura di ©True Story - Web Resource
Edited by True Story - 13/11/2013, 19:13.
Guida HTML5 - Elementi base di una pagina webGuida numero 1 |
Like
