XHTML - Sintaxe

A sintaxe XHTML é muito semelhante à sintaxe HTML e quase todos os elementos HTML válidos também são válidos em XHTML. Mas quando você escreve um documento XHTML, você precisa prestar um pouco mais de atenção para tornar seu documento HTML compatível com XHTML.

Aqui estão os pontos importantes a serem lembrados ao escrever um novo documento XHTML ou converter um documento HTML existente em um documento XHTML -

Escreva uma declaração DOCTYPE no início do documento XHTML.
Escreva todas as tags e atributos XHTML apenas em letras minúsculas.
Feche todas as tags XHTML corretamente.
Aninhe todas as tags corretamente.
Cite todos os valores de atributos.
Proibir a minimização de atributos.
Substitua o name atributo com o id atributo.
Rejeitar o language atributo da tag de script.

Aqui está a explicação detalhada das regras XHTML acima -

Declaração DOCTYPE

Todos os documentos XHTML devem ter uma declaração DOCTYPE no início. Existem três tipos de declarações DOCTYPE, que são discutidas em detalhes no capítulo XHTML Doctypes. Aqui está um exemplo de uso de DOCTYPE -

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

Sensibilidade ao Caso

XHTML é uma linguagem de marcação que diferencia maiúsculas de minúsculas. Todas as tags e atributos XHTML precisam ser escritos apenas em letras minúsculas.

<!-- 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>

No exemplo, Href e marca âncora A não estão em minúsculas, por isso está incorreto.

Fechando as Tags

Cada tag XHTML deve ter uma tag de fechamento equivalente, mesmo os elementos vazios também devem ter tags de fechamento. Aqui está um exemplo que mostra maneiras válidas e inválidas de usar tags -

<!-- 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" >

A sintaxe a seguir mostra a maneira correta de escrever as tags acima em XHTML. A diferença é que aqui fechamos ambas as tags corretamente.

<!-- 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" />

Cotações de atributos

Todos os valores dos atributos XHTML devem estar entre aspas. Caso contrário, seu documento XHTML será considerado inválido. Aqui está o exemplo que mostra a sintaxe -

<!-- 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" />

Minimização de Atributo

XHTML não permite a minimização de atributos. Isso significa que você precisa declarar explicitamente o atributo e seu valor. O exemplo a seguir mostra a diferença -

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

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

Aqui está uma lista dos atributos minimizados em HTML e a maneira como você precisa escrevê-los em XHTML -

Estilo HTML	Estilo XHTML
compactar	compacto = "compacto"
verificado	verificado = "verificado"
declarar	declare = "declare"
somente leitura	somente leitura = "somente leitura"
Desativado	desativado = "desativado"
selecionado	selecionado = "selecionado"
adiar	adiar = "adiar"
ismap	ismap = "ismap"
nohref	nohref = "nohref"
nenhuma sombra	noshade = "noshade"
nowrap	nowrap = "nowrap"
múltiplo	múltiplo = "múltiplo"
noresize	noresize = "noresize"

O atributo id

O atributo id substitui o atributo name. Em vez de usar name = "name", o XHTML prefere usar id = "id". O exemplo a seguir mostra como -

<!-- 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" />

O atributo da linguagem

O atributo de idioma da tag de script foi descontinuado. O exemplo a seguir mostra essa diferença -

<!-- 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>

Tags aninhadas

Você deve aninhar todas as tags XHTML corretamente. Caso contrário, seu documento será considerado um documento XHTML incorreto. O exemplo a seguir mostra a sintaxe -

<!-- 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>

Proibições de elementos

Os seguintes elementos não podem ter nenhum outro elemento dentro deles. Essa proibição se aplica a todas as profundidades de aninhamento. Significa que inclui todos os elementos descendentes.

Elemento	Proibição
<a>	Não deve conter outros elementos <a>.
<pre>	Não deve conter os elementos <img>, <object>, <big>, <small>, <sub> ou <sup>.
<button>	Não deve conter os elementos <input>, <select>, <textarea>, <label>, <button>, <form>, <fieldset>, <iframe> ou <isindex>.
<label>	Não deve conter outros elementos <label>.
<form>	Não deve conter outros elementos <form>.

Um documento XHTML mínimo

O exemplo a seguir mostra um conteúdo mínimo de um 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>