XHTML
XHTML reformulou o HTML 4 como XML estrito. Aprenda regras de boa formação, doctypes, xmlns e por que o HTML5 o substituiu em grande parte.
XHTML (Extensible HyperText Markup Language) é uma reformulação do HTML 4.01 dos anos 2000 como uma aplicação estrita de XML, publicada pelo World Wide Web Consortium (W3C). Possui o mesmo vocabulário de tags que o HTML, mas aplica as regras de boa formação do XML: toda tag deve ser fechada, em letras minúsculas e devidamente aninhada.
Para novos projetos, prefira HTML5. O XHTML 1.0 foi amplamente substituído pelo HTML5, que mantém a disciplina de boa formação como um estilo poliglota opcional, sendo muito mais tolerante e rico em recursos. Esta página é mais útil como referência histórica sobre um padrão legado que você ainda pode encontrar em bases de código mais antigas.
O objetivo original era tornar os documentos mais rigorosos e previsíveis, para que pudessem ser analisados por qualquer processador XML padrão e reutilizados em diferentes dispositivos e ferramentas. Como as regras não admitem exceções, uma única tag de fechamento ausente poderia impedir que o documento inteiro fosse renderizado quando servido como XML real.
Regras de boa formação
A diferença fundamental entre HTML e XHTML é que o XHTML deve ser XML bem formado. Abaixo estão as regras, cada uma mostrada como errado vs. correto.
Estrutura do documento e doctype
Todo documento XHTML deve começar com um <!DOCTYPE> XHTML e conter os elementos <html>, <head>, <title> e <body>. O elemento <html> também deve declarar o namespace XML com o atributo xmlns.
<!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/1999/xhtml">
<head>
<title>Title of the document</title>
</head>
<body>
Content of the page
</body>
</html>O atributo xmlns
xmlns="http://www.w3.org/1999/xhtml" é a declaração de namespace XML. Ela informa a um analisador XML que os elementos do documento pertencem ao vocabulário XHTML, e não a outra linguagem XML. É obrigatório no elemento raiz <html> de todo documento XHTML. A URL é um identificador, não um link que o navegador busca.
Variantes de doctype do XHTML
O XHTML 1.0 define três DOCTYPEs, cada um apontando para um DTD diferente. O exemplo acima usa o Transitional, a escolha mais comum.
- Strict — marcação limpa, sem elementos de apresentação. Elementos e atributos de apresentação obsoletos (como
fontoubgcolor) não são permitidos; a estilização é feita com CSS. - Transitional — permite os recursos de apresentação obsoletos para compatibilidade com conteúdo mais antigo.
- Frameset — como o Transitional, mas permite documentos
<frameset>que dividem a janela em quadros.
Feche todos os elementos
Em HTML, algumas tags de fechamento podem ser omitidas, mas em XHTML todo elemento deve ser fechado. Elementos vazios sem conteúdo (como br, hr, img) se fecham com uma barra no final.
<!-- Wrong (HTML-style, not closed) -->
A break: <br>
An image: <img src="smile.gif" alt="Always smile">
<!-- Right (self-closed for XHTML) -->
A break: <br />
An image: <img src="smile.gif" alt="Always smile" />Use nomes de tags e atributos em letras minúsculas
XML diferencia maiúsculas de minúsculas, portanto <P> e <p> são tags diferentes. O XHTML exige que todos os nomes de elementos e atributos sejam escritos em letras minúsculas.
<!-- Wrong -->
<BODY>
<P>Some paragraph</P>
</BODY>
<!-- Right -->
<body>
<p>Some paragraph</p>
</body>Coloque aspas em todos os valores de atributos
Todos os valores de atributos devem ser envoltos em aspas, inclusive os numéricos.
<!-- Wrong -->
<table width=100%>
<!-- Right -->
<table width="100%">Aninhe os elementos corretamente
Tags sobrepostas são proibidas; os elementos internos devem ser fechados antes do elemento pai externo.
<!-- Wrong (overlapping) -->
<strong><em>This text is bold and italic</strong></em>
<!-- Right (properly nested) -->
<strong><em>This text is bold and italic</em></strong>Sem minimização de atributos
Em HTML, atributos boolean podem ficar sozinhos (checked). O XHTML proíbe essa abreviação: todo atributo precisa de um valor e, para atributos boolean, o valor repete o nome.
<!-- Wrong (minimized) -->
<input type="checkbox" name="flower" value="rose" checked />
<!-- Right -->
<input type="checkbox" name="flower" value="rose" checked="checked" />Prefira id em vez de name
No XHTML, o atributo name está obsoleto em elementos como âncoras, portanto o atributo id é recomendado para identificar elementos.
Vantagens do XHTML
- Todas as tags devem ser fechadas e devidamente aninhadas, o que mantém a marcação consistente e mais fácil de ler.
- Por ser XML bem formado, os documentos podem ser processados de forma confiável por ferramentas XML genéricas e transportados para ambientes especializados, como leitores Braille e outros softwares de tecnologia assistiva.
- Incentiva uma separação clara entre estrutura e apresentação, funcionando em conjunto com CSS para estilização.
XHTML vs HTML
Algumas distinções importantes entre os dois:
- Padrão subjacente. HTML é uma aplicação de SGML; XHTML é uma aplicação de XML.
- Linhagem. HTML descende de SGML; XHTML é derivado de XML e HTML 4.
- História. HTML teve origem com Tim Berners-Lee no início dos anos 1990 (Wikipedia); o XHTML 1.0 tornou-se uma Recomendação W3C em 2000 (Wikipedia).
- Análise. HTML usa um analisador tolerante a erros; o XHTML servido como XML requer um analisador XML estrito que rejeita documentos malformados.
XHTML vs HTML5
- Sensibilidade a maiúsculas e minúsculas. XHTML diferencia maiúsculas de minúsculas; o HTML5 (como o HTML clássico) não faz essa diferença.
- Doctype. Os doctypes XHTML são longos e referenciam um DTD; o HTML5 usa o curto
<!DOCTYPE html>. - Tipo MIME. O HTML5 é servido como
text/html; a análise estrita do XHTML requerapplication/xhtml+xml. - Tolerância. O HTML5 se recupera graciosamente de muitos erros de marcação, enquanto o XHTML os rejeita.
- Status. O HTML5 é o padrão moderno para todos os dispositivos; o XHTML 1.0 é considerado legado.