Esqueci a senha

Campus Online

Canais

XHTML

XHTML

XML, HTML e XHTML

Você deve se lembrar de quanto falamos sobre tornar seu código inteligível por máquinas, e do papel do XML nisso. Mas você deve entender também que os navegadores hoje não trabalham muito bem com XML puro, e esperam conteúdo HTML. Por isso o pessoal do W3C criou o XHTML. XHTML é uma forma de escrever HTML de modo que ele também seja um documento XML válido.

Mapa de intersecção do XML e do HTML.

Você vai notar no mapa que XML é uma linguagem usada para definir outras linguagens. Simplificando podemos dizer que XML é uma linguagem que serve para criar outras linguagens. Linguagens como XSLT, SVG, XUL e RSS são todas XML. XHTML também é XML e é ao mesmo tempo HTML. Assim, um browser lê XHTML como um arquivo HTML normal e um interpretador de XML pode lê-lo como XML.

XHTML é um subconjunto de XML usado para escrever HTML. Na prática trata-se de escrever o HTML com uma sintaxe ligeiramente diferente, de modo que ele também seja um arquivo XML válido.

Escrevendo XHTML válido

Para o uso do XHTML, temos que ter uma certa disciplina. Precisamos seguir uma série de regrinhas para poder criar um código XHTML válido. Essas regras são fáceis de lembrar, veja abaixo:

DOCTYPE

O Doctype (Document Type Definition - DTD) é a primeira coisa que se deve escrever em um arquivo XHTML. Ele deve ir na PRIMEIRA LINHA do seu documento e serve para informar ao browser que tipo de documento será visualizado. Existem 3 tipos:

  • Strict: Este tipo é usado quando você fez um código 100% XHTML, sem erros. Deve ser escrito assim: 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  • Transitional: Este é o modo mais usado, você o usa quando está começando a migrar do nosso amigo HTML para o poderoso XHTML. Sua sintaxe é: 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  • Frameset: É usado quando você está utilizando FRAMES em seu site. Se escreve assim: 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
              "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html>
   <head>

     <title></title>
   </head>
   <body>

   </body>
</html>
Na versão HTML 5 este Doctype foi bastante resumido, facilitando a vida de todo mundo. A parte importante apenas para o Browser ficou oculta, o que faz muito sentido para todo mundo. O novo Doctype ficou assim: 
<!DOCTYPE html>
Feche TODAS as tags

Quem já escreveu algum XML sabe que ele não funciona até que TODAS as tags estiverem bem fechadas. No HTML era diferente: muitas vezes deixávamos tags abertas, e ele continuava funcionando normalmente.

Para fazer um XHTML válido, devemos fechar TODAS as tags:

  • Não devemos esquecer de fechar as tags normais:
    <p></p>, <b></b>, etc...
  • E também não podemos esquecer de fechar as tags "solitárias". Assim, ao invés de <br>, escrevemos <br></br>, ou na forma simplificada: <br/>

Descobriu-se que fechar tags desta forma: <br/>, não se sabe porquê, causava um problema no Netscape 4. Mas colocando um espaço antes da (barra) / o problema é solucionado: <br />

Use letras minúsculas em tags e atributos

Você já deve ter visto código fonte de um documento HTML escrito assim:

<A href="http://tags.com.letras.minúsculas/" TITLE="descrição"> </A>

Um documento XHTML deve ter TODAS as tags e seus respectivos atributos escritos com letra minúscula:

<a href="http://tags.com.letras.minúsculas/" title="descrição"> </a>
Não esqueça das "ASPAS"

Esta regra é bem simples. Nas tags XHTML, todos os valores dos atributos devem estar entre "ASPAS".

Atributo NAME

O antigo atributo NAME foi substituído pelo atributo ID. Se seus usuários, clientes, etc., utilizam ainda antigos browsers, você pode sem problema nenhum utilizar as duas formas juntas durante o período de migração:

<img src="imagem.gif" id="imagem" name="imagem" />
Atributos sem valor

Não devemos esquecer também os atributos que escrevemos sem valor. Por exemplo:

ERRADO:

<option selected>

<frame noresize>
<input checked>
<input readonly>

CERTO:

<option selected="selected">
<frame noresize="noresize">
<input checked="checked">
<input readonly="readonly">

E assim por diante...

Mantenha os bons Modos

Existem algumas outras regras para se escrever XHTML. As principais tratam sobre onde os elementos podem ou não aparecer. Por exemplo, você não pode ter um elemento ul dentro de um p. Não vamos estudar agora todas essas regras, não vale a pena. Você pode aprender as que lhe são necessárias ao tentar validar o seu código. Para você manter sempre os bons modos em todos os aspectos do documento XHTML, sempre submeta seu arquivo ao validador do W3C. Assim, com o passar do tempo, você vai apurando cada vez mais seu código XHTML.