Resumo:
Usar CSS para desenhar a apresentação do conteúdo
Planificar faz parte da estratégia de sucesso
Validar com w3.org e ter em conta os bugs.

Referência: Existe um manual em CriarWeb que explica a linguagem CSS detalhadamente.

1. Usar CSS para desenhar a apresentação do conteúdo

O antigo método de desenhar páginas se baseava na edição de intermináveis linhas de HTML onde tabelas aninhadas definiam a apresentação de nosso site.

Este método gerava uma grande quantidade de código que "só" serviria para projetar informação e que deveria ser reutilizado página por página no site.

O exemplo típico são os menus onde para mostrar 5 links, são necessários 10kbs de código.

Abandonando o antigo método e abraçando as CSS ganharemos 2 coisas.

• Agilidade na produção tanto desde a criação de novo conteúdo como desde o ponto de vista da atualização e manutenção do conteúdo criado.
  
• Una maior velocidade para baixar documentos e com isso, um melhor funcionamento de nossos servidores.

A agilidade na produção é um dos pontos chaves já que a criação de conteúdo e sua apresentação se dividem evitando os gargalos da garrafa. Por outro lado, não se necessitam mais tabelas para construir menus já que todos os elementos podem ser definidos de forma precisa através da CSS.

Este exemplo apresenta um cabeçalho, um menu lateral e um conteúdo. Ou seja, o típico esquema que qualquer site pode utilizar. Todos estes elementos foram definidos na folha de estilo deixando o HTML limpo para o conteúdo.

A maior velocidade de download origina-se pela eliminação total do código de apresentação dentro do HTML do conteúdo. Não é estranho de se ver como um site dedica quase o 80% do HTML para gerar tabelas com menus que se repetem em cada página ao longo do site. Editando o estilo destes menus assim como o layout da página na CSS evita-se toda essa redundância.

Não mais "table", não mais "font", não mais "color" para construir. Conteudo + CSS.

O peso por documento pode ser visto rebaixada facilmente em um 50%. Este peso se acumula por documento e podemos ver como ao final da atualização o site em geral reduz seu peso em Megas refletindo-se em uma otimização na transferência de dados.

Este tipo de atualização oferece resultados facilmente mensuráveis que provam a efetividade da ação.

Uma estratégia a seguir com esta atualização é o poder inserir mais informação por página sem chegar a aumentar o peso. Esta informação pode vir no formato de banners mais ricos, melhores promoções, mapas do web mais completos.


2. Planificar faz parte da estratégia de sucesso

Como sempre uma planificação e previsão das necessidades do projeto é a chave para poder definir estilos que responderão às necessidades do site.

Algumas chaves:

1. Estudar os estilos atualmente aplicados para poder reciclar e construir sobre uma base evitando uma "mancha e uma conta nova".
   
2. Conhecer as necessidades das diferentes partes que colaborarão dentro do site e saber transmitir possibilidades, limitações.
   
3. Aplicar um método de trabalho que permita "provar / mudar" o que for necessário.
   
4. Não dar a versão 1.0 como boa.
   
5. Pensar grande, documentar, publicar guias.

Pensar grande requer planificar e manter uma continuidade das necessidades dos diferentes departamentos para poder inserir dentro da linha de produção novos formatos, planilhas. O ter um controle sobre novas necessidades e ser capazes de oferecer soluções ajudará a ter versões atualizadas, consistentes e facilmente melhoráveis.

A documentação e publicação devem tender a documentos simples, breves e fáceis de aplicar. Evitar o "dossier" e tender mais ao "flyer". Para conseguir que as pessoas leiam e sigam as normas deve-se tender a apresentar os novos guias de uma forma simples, demonstrando os benefícios das mesmas e facilitando seu funcionamento desde qualquer plataforma, ocasião e circunstância.


3. Validar com w3.org e ter em conta os bugs

Validar segundo as normas de w3.org não é fácil. A melhor tática é usar CSS que validem e de aí modificar o que for necessário para acomodar o estilo a nossas preferências.

Existem problemas de interpretação entre navegadores e existem bugs que não podem ser corrigidos. Se não criarem incompatibilidades, sim podem ser problemáticos e algo desagradável na hora de trabalhar.
Erratas da w3.org


Validator: http://jigsaw.w3.org/css-validator
CSS: http://www.w3.org/Style
Samples Mozilla: http://www.mozilla.org/docs/dom/samples
Styles w3.org: http://www.w3.org/StyleSheets/Core/preview
Directory: Diretório de Google com exemplos CSS
Ver também: Manual de CSS de CriarWeb.com