Esquerda - Conteúdo.
Padrões Web: Desenvolvimento em Camadas.
Desenvolver sites e aplicações pra web usando os padrões web significa, basicamente, usar cada tecnologia para o propósito único para o qual ela foi desenvolvida. Com isso, acabamos por organizar nosso código em "camadas". São elas conteúdo, apresentação e comportamento. Vamos ver em separado, o que significa, para que serve e como desenvolver cada camada separadamente.
Neste texto vamos dar uma rápida passada pelas duas primeiras camadas, a de conteúdo e a de apresentação. A de comportamento fica para um próximo post.
Conteúdo.
A camada de conteúdo é, sem sombra de dúvida, a mais importante de todas. É onde colocamos a parte mais preciosa do nosso site, aquilo que realmente faz a diferença no fim das contas " o conteúdo" (surpresa!).
Para desenvolver essa camada usamos as chamadas linguagens de marcação de hipertexto, no nosso caso HTML ou XHTML. O desenvolvimento deve sempre começar por esta camada. Antes de se preocupar com a parte visual ou comportamental de um site ou aplicação, deve-se estruturar com o maior cuidado e critério possível o conteúdo.
Quando você for começar a realmente pôr a mão na massa e escrever o código, mesmo que já tenha um layout definido, tente não pensar na parte visual. Se atenha ao conteúdo. Como esse conteúdo é dividido? Que partes compõem esse conteúdo? Qual a função de cada parte do conteúdo dentro do site?
Tendo isso em mente, coloque essas partes por ordem de importância e relevância para os usuários. Certifique-se de que o que é mais importante seja colocado antes no código.
Preocupe-se com a semântica. Use os elementos certos para marcar o conteúdo. O HTML te dá uma quantidade consideravelmente boa de elementos para estruturar o seu conteúdo.
Abra o seu HTML puro em um browser. O que você vê na tela faz algum sentido? Verifique se é possível navegar tranquilamente pelo conteúdo usando o teclado.
Lembre-se, todo o restante do processo de desenvolvimento do seu site vai depender de como o seu conteúdo está estruturado. Se as coisas não estiverem bem estruturadas nessa camada, você vai, certamente, ter problemas no futuro. Revise o seu código, mexa no que tiver de ser mexido agora. Mais tarde pode ser tarde demais e o tempo que você vai perder será muito maior, acredite.
Estando tudo certo com a estruturação do conteúdo, podemos passar para a próxima camada.
Apresentação.
Agora é a hora de aplicar aquele belo layout que você (ou o seu designer) criou para tornar o seu conteúdo mais atraente. Nessa camada, vamos usar o CSS para definir propriedades visuais para cada elemento do seu conteúdo.
O mais importante aqui é manter as coisas simples. Evite usar propriedades que possam causar problemas em diferentes browsers. Em geral é possível criar qualquer tipo de layout usando apenas aquilo que é largamente suportado.
Resista à tentação de mexer na camada de conteúdo para satisfazer uma necessidade especificamente de apresentação. Pense um pouco mais. A solução pode ser mais simples do que você pensa. Use esse artifício apenas em casos de desespero total, quando tudo o mais falhar.
Lembre-se, se você tem um problema, é grande a chance de que alguém já tenha tido o mesmo problema e o tenha resolvido. Também é grande a chance de que esse alguém tenha publicado, em algum lugar, a solução, quem sabe, com uma bela explicação. Uma busca no Google é sempre uma boa pedida.
Teste freqüentemente o resultado, de preferência em diversos browsers. Principalmente nos mais usados (Internet Explorer, Firefox, Opera e Safari).
Quer uma dica? Use como base de testes um browser que tenha um melhor suporte aos padrões web. Firefox é uma bela opção para os usuários de Windows. Para quem usa Mac, o Safari é a melhor opção.
O Internet Explorer é, de longe, o browser mais usado, mas tem um suporte bastante precário aos padrões. Por isso, se você tomá-lo como base para o seu desenvolvimento, será muito mais complicado consertar as falhas que serão notadas nos outros browsers.
Se você fez tudo direitinho até aqui, você tem um site bem estruturado, visualmente agradável e consistente.
Disponibilizado em: 04/04/2008.
