Este segundo módulo tem como intuito apresentar algumas das regras de sintaxe, assim como alguns exemplos de uso comparando-o com a forma antiga.
As regras estarão escritas abaixo em negrito, sendo que para aquelas que apresentarem exemplos logo em seguida, considere como o primeiro exemplo sempre como o correto e o segundo como o errado, ok?
Vamos à elas então..
- Todos os elementos XHTML devem estar dentro do elemento raiz <html>.
- É obrigatório a declaração do DOCTYPE assim como a existência dos elementos <html> <head> <title> e <body>.
- O atributo “alt” é obrigátorio em todas as imagens.
Dica: Caso a imagem em questão seja apenas de uso decorativo, você pode especificar seu atributo, como alt=” “
- Elementos XHTML devem estar devidamente aninhados.
<div><p><strong>Tutorial - XHTML</strong></p></div> - Certo
<div><p><strong>Tutorial - XHTML</p></strong></div> - Errado
- Elementos XHTML devem estar escritos em letras minúsculas.
<p>Tutorial - XHTML</p> - Certo
<P>Tutorial - XHTML</P> - Errado
- Elementos XHTML vazios devem ser fechados.
<img src="images/xhtml.jpg" alt="Imagem" /> <br /> - Certo
<img src="images/xhtml.jpg" alt="Imagem"> <br> - Errado
Dica: Coloque sempre um espaço a mais antes do / que fecha a tag, por exemplo:
<img src="images/xhtml.jpg" alt="Imagem" /> <br /> - Certo
<img src="images/xhtml.jpg" alt="Imagem"/> <br/> - Errado
- Os nomes dos atributos devem estar escritos em letras minúsculas.
<img src="images/xhtml.jpg" alt="Imagem" /> - Certo
<img SRC="images/xhtml.jpg" ALT="Imagem" /> - Errado
- Os valores dos atributos devem estar entre “aspas”.
<img src="images/xhtml.jpg" alt="Imagem" /> - Certo
<img src=images/xhtml.jpg alt=Imagem /> - Errado
- Minimização nos atributos é proibido.
<option selected="selected">Tutorial - XHTML</option> - Certo
<option selected>Tutorial - XHTML</option> - Errado
- O atributo “name” é substituído pelo atributo “id”.
<img src="images/xhtml.jpg" id="Imagem" /> - Certo
<img src="images/xhtml.jpg" name="Imagem" /> - Errado
Em um dos primeiros pontos que comentei, citei que era obrigatória a declaração do DOCTYPE, pra você que se perguntou o que era aquilo, vou responder agora:
DOCTYPE é um acrônimo para “Document Type“, que é uma Definição do Tipo de Documento ou DTD (Document Type Definition), ele especifica qual a sintaxe SGML (Standard Generalized Markup Language) usada no documento, quais as regras que se aplicam a linguagem de marcação usada, bem como o conjunto de elementos e entidades válidas para aquela linguagem.
Os tipos de DOCTYPE para XHTML:
- Strict
- Transitional
- Frameset
Strict
A declaração Strict é a mais restrita as 3.
Declaração:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Na declaração Strict, os documentos XHTML não aceitam qualquer item de formatação dentro dos elementos e nem elementos “deprecated” (em desuso) segundo as recomendações do W3C. São indicados para uso com separação entre conteúdo e forma, ou seja, folhas de estilo em cascata com marcação totalmente independente da apresentação.
Transitional
A declaração Transitional permite uma maior flexibilidade.
Declaração:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Na declaração Transitional é indicada para documentos que ainda utilizem elementos “deprecated” (em desuso), regras de apresentação embutidas em tags e também para documentos destinados a exibição em browser sem suporte para CSS. Não aceita marcação para frames.
Frameset
A declaração Frameset é utilizada para páginas com frames.
Declaração:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0
Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
Na declaração Frameset é permitido tudo da declaração transational e mais os elementos específicos para frames.
