Tablelove: transição suave aos Webstandards

Dois dias antes do 10º Encontro de Webdesign em Curitiba, a organização do evento me convidou para substituir meu amigo Bechara, que teve de ser operado no apêndice. Topei o desafio só porque esse assunto não poderia faltar no evento. É a mudança mais importante no rumo do Webdesign nos últimos anos e o mercado curitibano não poderia ficar de fora. Quando comecei a preparar os slides fiquei pensando como eu iria dizer a 300 profissionais que muito do que sabiam sobre codificação HTML estava errado e que era preciso mudar. Se dissesse para esquercer as tabelas, como prega o discurso Tableless, certamente iria desanimar uns e revoltar outros. Se dissesse que eles precisariam conhecer todas as recomendações do W3C, desanimaria a todos. Inspirado na transição suave proposta por Jeffrey Zeldman, propus o movimento Tablelove. As tabelas quebraram nosso galho por muito tempo enquanto não haviam alternativas para marcar layout. Passar a odiá-las de uma hora para a outra não é saudável nem para os webdesigners, nem para as tabelas. Quem ama não abusa O primeiro passo do Tablelove é transferir a formatação inline (embutida na própria tag) para um arquivo separado de CSS. Com as propriedades de formatação do CSS é possível fazer muito mais com muito menos. As tabelas aninhadas (uma dentro da outra) diminuirão e o spacers.gif transparente não serão mais necessários. Só esse esforço de separação entre o conteúdo e a apresentação vai tornar a manutenção do código mais fácil e aumentar a acessibilidade da página. Quem ama quer sempre o melhor Originalmente as tabelas foram criadas para exibirem dados tabulados. Elas começaram a ser usadas para marcar layout porque não havia alternativa melhor na época, mas dessa forma estavam sendo mal tratadas. Eis um exemplo de tabela bem utilizada: Fruto Cor Sabor Banana Amarelo Doce Maçã Vermelha, Amarela ou Verde Doce Tomate Vermelho ou verde Salgado Quem ama trai Para substituir as tabelas na marcação do layout, é recomendável a utilização da tag DIV. Elas permitem posições mais flexíveis, precisas e ousadas. No CSS Zen Garden, um mesmo grupo de DIVs é rearranjado de centenas de formas diferentes para compor layouts impressionantes. Observe que o código HTML não muda, só muda a folha de estilos da página. Áudio da palestra e slides Os títulos sugestivos das lições do Tablelove ficam muito mais engraçados e memoráveis numa palestra ao vivo do que nesse texto. Para quem não estava no evento, segue o áudio da palestra que pode ser escutado junto com os slides. Padrões Web (Webstandards) [MP3] 1h e 30 minutos 14MBComente este post