Como evitar a armadilha de layout baseado em tabela html5

Tabelas são muito grandes. Eles são uma ótima maneira de apresentar certos tipos de dados usando HTML5. Quando você adicionar os e conceitos, você pode usar tabelas para criar alguns layouts muito interessantes. Na verdade, por causa da velha escola HTML realmente não tem qualquer tipo de tecnologia de layout, um monte de desenvolvedores veio com alguns layouts bastante surpreendentes com base em tabelas.

Video: Curso de HTML5 - 19 - Tabelas em HTML - by Gustavo Guanabara

Usando tabelas para layout causa alguns problemas, porém, como

Tabelas não são destinadas para layout. As tabelas são projetados para apresentação de dados, não layout. Para fazer tabelas trabalhar para layout, você tem que fazer um monte de hacks furtivos, como tabelas aninhadas dentro de outras tabelas ou imagens invisíveis para espaçamento.

  • O código torna-se complicado rápido. Tabelas envolver um grande número de marcação HTML. Se o código envolve tabelas aninhadas uma dentro da outra, é muito difícil lembrar qual elemento está relacionado à qual linha de qual tabela. layouts baseados em tabela são muito difíceis de modificar manualmente.

  • A formatação é feita célula a célula. Uma página web poderia ser composto de centenas de células da tabela. Fazer uma mudança na fonte ou a cor, muitas vezes envolve fazer alterações em centenas de células em toda a página. Isso faz com que sua página menos flexível e mais difícil de atualizar.



  • Apresentação é bem amarrado aos dados. Um layout baseado em tabelas firmemente entrelaça os dados e sua apresentação. Isso vai contra o objetivo principal de web design - separação de dados de sua apresentação.

  • layouts baseados em tabela são difíceis de mudar. Depois de criar um layout baseado em tabelas, é muito difícil de fazer modificações porque todas as células da tabela têm um efeito potencial sobre outras células.

    Video: Curso HTML 5 - Aula 7 - Mesclar células em uma Tabela html

  • layouts baseados em tabela causar problemas para leitores de tela. Pessoas com deficiência visual usar software especial para ler páginas web. Estes leitores de tela são bem adaptados para ler tabelas como eles foram destinados (para gerenciar dados tabulares), mas os leitores de tela não têm nenhuma maneira de saber quando a tabela está sendo usado como uma técnica de layout em vez de uma ferramenta de apresentação de dados. Isso faz com layouts baseados em tabelas menos complacente com padrões de acessibilidade.

  • layouts baseados em tabela não se adaptam bem. usuários modernos esperar para executar páginas em celulares e tablets celulares, bem como máquinas desktop. projetos baseados na tabela não são facilmente escalar para esses fatores de forma menores.

    Video: Curso de HTML5 - Aula 08 - Tabelas

  • Resista à tentação de usar tabelas para layout. Use tabelas para fazer o que eles são projetados para: apresentação de dados. As abordagens baseadas em CSS que você pode usar para gerar qualquer tipo de layout visual que você pode querer é mais fácil, mais seguro, e muito mais flexível.


    Publicações relacionadas