Banner propaganda da DevMedia - Cursos de desenvolvimento web

:: CSS desde o início ::

Autor: Joe Gillespie
URL do original: http://www.wpdfd.com/editorial/basics/index.html
Título original: CSS from the Ground Up
Traduzido com autorização expressa do autor

Etapa número 10 - Fazendo as coisas certas

Doctypes e validação

Chegamos a décima etapa das lições 'CSS desde o início' e eu tenho uma confissão a fazer. Tudo o que eu mostrei para vocês até aqui, - marcação de códigos e páginas de exemplos estão todas erradas! Bem, tudo provavelmente funcionou muito bem a menos que você esteja usando um navegador muito antigo, contudo se você testar o que fizemos em um verificador de sintaxe ou submeter a uma programa de validação, tudo que fizemos será reprovado.

O que é um programa de validação? deve estar você perguntando.

Você já deve estar familiarizado com o conceito de checador de sintaxe. Provavelmente existe um deles no seu programa processador de textos. O checador compara as palavras que você digita, com uma lista de palavras de um dicionário e alerta quando encontra alguma palavra que não está no dicionário. Pode ser que a palavra não esteja listada no dicionário, mas também pode ser que você tenha digitado errado. Em processadores de textos mais sofisticados é possível checar a gramática, a existência de verbo em uma frase, alertar para o uso repetido de uma mesma palavra 'e' importuná-lo incessantemente.

Para que um checador de palavras ou de gramática possa funcionar a contento, ele precisa saber qual é a 'linguagem' usada. O meu checador de inglês da Inglaterra é diferente do inglês dos EUA - e se você não estiver nos EUA?

Assim como suas escritas em inglês ou seja lá qual for o idioma usado é checado pelo processador de texto, o HTML e as CSS podem e devem ser checadas também. Se você comete um erro na sua escrita, as pessoas provavelmente julgarão tratar-se de um erro de datilografia, mas entenderão o que você quis dizer e não haverá prejuizo para o entendimento. Um pequeno deslize no HTML ou nas CSS, por outro lado, é uma história diferente. Algo aparentemente insignificante como uma vírgula ou uma aspas fora do lugar, pode fazer toda a diferença entre uma página funcionando ou não - isto dependerá do erro e de como o navegador tratará o erro. É uma boa idéia submeter seu HTML e as CSS a um checador de sintaxe ou a um validador.

Uma das vantagens de se utilizar um editor de HTML decente é que ele vem com um checador de sintaxe embutido. Você não dispõe de checadores em editores de textos simples e de propósitos gerais. Se você possui um editor tipo HomeSite ou BBEdit ou um editor WYSIWYG tal como o Dreamweaver ou GoLive, você terá um checador e ainda sugestões de como corrigir erros. Se você não possui um editor assim, poderá usar um validador online fornecido pelo W3C - Validador HTML do W3C - Validador CSS do W3C - onde você faz o upload de seu arquivo e obtém de imediato um relatório de erros ou de não existência de erros!

É evidente que o programa tem que saber qual é a 'linguagem' que foi usada na marcação - existem várias versões ('linguagens') do HTML. Todos os exemplos que mostrei, foram escritos usando o HTML 4.01 - esta é a versão atual e a mais utilizada. Existem sub-versões do HTML 4.01 - 'Strict', 'Transitional' e 'Frame Set'.

Strict é um conjunto de regras muito rígidas que definem o que pode e o que não pode ser escrito em HTML.

Transitional é um conjunto um pouco mais flexível e permite escrever algum HTML mais antigo e para algumas peculiaridades próprias de navegadores.

Frame Set não é muito usado nos dias atuais. Não temos nos utilizado do uso de 'frames' pois eles estão em desuso desde o aparecimento das CSS.

A maioria das pessoas está satisfeita com o uso de 'Transitional' pois ele não é tão rígido com a marcação, outras gostam de fazer tudo conforme 'reza o manual' e preferem usar 'Strict'.

Para dizer ao navegador qual a linguagem de marcação e a sub-versão que você está utilizando, coloque a declaração de DocType logo no início da marcação, no topo da página - acima da tag de abertura <html>. Assim como mostrado abaixo...

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD 
  HTML 4.01 Transitional//EN"
  "http://www.w3.org/TR/html4/loose.dtd">

Não vou analisar a declaração agora, basta que você saiba por enquanto que esta declaração no topo da página fornece ao validador as informações necessárias para ele fazer seu trabalho de validação. Agora o validador saberá quais são as regras (normas) você esta utilizando na marcação e poderá fazer as análises necessárias.

Ao adicionar o DocType, poderei checar minhas páginas em um editor de HTML que forneça esta facilidade e estar seguro de que terei um código limpo. Agora que já sabemos da importância do Doctype, podemos voltar ao assunto estilizações.

  1. » Introdução - página básica
  2. » Folha de estilos
  3. » Estilizando texto
  4. » Mais texto
  5. » As listas
  6. » Os links
  7. » Boxes CSS
  8. » DIV's
  9. » Juntando tudo
  10. » DOCTYPE
  11. » Estilos externos
  12. » Estilizando tabelas
  13. » Estilizando formulários
  14. » Browsers
  15. » O futuro

Conheça os livros do Maujor®

Clique a "capinha" para visitar o site do livro

capa livro jQuery capa livro ajaxjQuery capa livro css capa livro html capa livro javascript capa livro html5 capa livro css3 capa livro jQuery Mobile capa livro jQuery UI capa livro SVG capa livro RWD capa livro foundation capa livro HTML5 e CSS3 capa livro Bootstrap3 capa livro Sass e Compass

Criado em: 2005-04-12
Atualizado em: 2005-11-21

topo