XHTML - Sintassi

La sintassi XHTML è molto simile alla sintassi HTML e quasi tutti gli elementi HTML validi sono validi anche in XHTML. Ma quando scrivi un documento XHTML, devi prestare un po 'più di attenzione per rendere il tuo documento HTML conforme a XHTML.

Ecco i punti importanti da ricordare durante la scrittura di un nuovo documento XHTML o la conversione di un documento HTML esistente in un documento XHTML:

Scrivi una dichiarazione DOCTYPE all'inizio del documento XHTML.
Scrivi tutti i tag e gli attributi XHTML solo in minuscolo.
Chiudi correttamente tutti i tag XHTML.
Nidifica correttamente tutti i tag.
Cita tutti i valori degli attributi.
Vieta la minimizzazione degli attributi.
Sostituisci il name attributo con il id attributo.
Deprecare il language attributo del tag script.

Ecco la spiegazione dettagliata delle regole XHTML di cui sopra:

Dichiarazione DOCTYPE

Tutti i documenti XHTML devono avere una dichiarazione DOCTYPE all'inizio. Ci sono tre tipi di dichiarazioni DOCTYPE, che sono discusse in dettaglio nel capitolo XHTML Doctypes. Ecco un esempio di utilizzo di DOCTYPE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

Maiuscole / minuscole

XHTML è un linguaggio di markup case sensitive. Tutti i tag e gli attributi XHTML devono essere scritti solo in minuscolo.

<!-- This is invalid in XHTML -->
<A Href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</A>

<!-- Correct XHTML way of writing this is as follows -->
<a href="/xhtml/xhtml_tutorial.html">XHTML Tutorial</a>

Nell'esempio, Href e tag di ancoraggio A non sono in minuscolo, quindi non è corretto.

Chiusura dei tag

Ogni tag XHTML dovrebbe avere un tag di chiusura equivalente, anche gli elementi vuoti dovrebbero avere tag di chiusura. Ecco un esempio che mostra modi validi e non validi di utilizzare i tag:

<!-- This is invalid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.

<!-- This is also invalid in XHTML -->
<img src="/images/xhtml.gif" >

La sintassi seguente mostra il modo corretto di scrivere i tag sopra in XHTML. La differenza è che qui abbiamo chiuso correttamente entrambi i tag.

<!-- This is valid in XHTML -->
<p>This paragraph is not written according to XHTML syntax.</p>

<!-- This is also valid now -->
<img src="/images/xhtml.gif" />

Citazioni sugli attributi

Tutti i valori degli attributi XHTML devono essere citati. Altrimenti, il tuo documento XHTML viene considerato come un documento non valido. Ecco l'esempio che mostra la sintassi:

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" width=250 height=50 />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" width="250" height="50" />

Minimizzazione degli attributi

XHTML non consente la minimizzazione degli attributi. Significa che devi dichiarare esplicitamente l'attributo e il suo valore. L'esempio seguente mostra la differenza:

<!-- This is invalid in XHTML -->
<option selected>

<!-- Correct XHTML way of writing this is as follows -->
<option selected="selected">

Ecco un elenco degli attributi ridotti a icona in HTML e il modo in cui devi scriverli in XHTML:

Stile HTML	Stile XHTML
compatto	compact = "compatto"
controllato	controllato = "verificato"
dichiarare	declare = "declare"
sola lettura	readonly = "readonly"
Disabilitato	disabled = "disabled"
selezionato	selected = "selezionato"
differire	defer = "defer"
ismap	ismap = "ismap"
nohref	nohref = "nohref"
noshade	noshade = "noshade"
nowrap	nowrap = "nowrap"
multiple	multiple = "multiple"
noresize	noresize = "noresize"

L' attributo id

L'attributo id sostituisce l'attributo name. Invece di usare name = "name", XHTML preferisce usare id = "id". L'esempio seguente mostra come:

<!-- This is invalid in XHTML -->
<img src="/images/xhtml.gif" name="xhtml_logo" />

<!-- Correct XHTML way of writing this is as follows -->
<img src="/images/xhtml.gif" id="xhtml_logo" />

L' attributo della lingua

L'attributo della lingua del tag script è obsoleto. L'esempio seguente mostra questa differenza:

<!-- This is invalid in XHTML -->

<script language="JavaScript" type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

<!-- Correct XHTML way of writing this is as follows -->

<script type="text/JavaScript">
   document.write("Hello XHTML!");
</script>

Tag annidati

Devi nidificare correttamente tutti i tag XHTML. Altrimenti il tuo documento viene considerato come un documento XHTML errato. L'esempio seguente mostra la sintassi:

<!-- This is invalid in XHTML -->
<b><i> This text is bold and italic</b></i>

<!-- Correct XHTML way of writing this is as follows -->
<b><i> This text is bold and italic</i></b>

Divieti di elementi

I seguenti elementi non possono contenere altri elementi al loro interno. Questo divieto si applica a tutte le profondità di nidificazione. Significa che include tutti gli elementi discendenti.

Elemento	Divieto
<a>	Non deve contenere altri <a> elementi.
<pre>	Non deve contenere gli elementi <img>, <object>, <big>, <small>, <sub> o <sup>.
<button>	Non deve contenere gli elementi <input>, <select>, <textarea>, <label>, <button>, <form>, <fieldset>, <iframe> o <isindex>.
<etichetta>	Non deve contenere altri elementi <label>.
<form>	Non deve contenere altri elementi <form>.

Un documento XHTML minimo

Il seguente esempio mostra un contenuto minimo di un documento XHTML 1.0 -

<?xml version="1.0" encoding="UTF-8"?>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/TR/xhtml1" xml:lang="en" lang="en">
   <head>
      <title>Every document must have a title</title>
   </head>
	
   <body>
      ...your content goes here...
   </body>
</html>

↰ Previous page Next page ↱