Porque tabelas para layout são horríveis
- É necessário esperar carregar toda a tabela para que apareça
- Encourajam o uso de gifs transparents para posicionamento
- Tabelas são horríveis para impressão. Com CSS, você pode criar um estilo para impressão. Tirar menus e cores desnecessárias
Porque CSS é melhor do que tabelas para layout
- suas páginas carregarão mais rápido, pois o CSS fica guardado no cache. Em sites com tabelas, os estilos ficam no meio do código
- você economizará dinheiro na hospedagem, pois com elas você faz algo melhor e menor
- a manutenção é mais fácil,pois você não precisa editar o HTML, basta editar o CSS que você pode mudar completamente o design. Com tabelas, você precisaria mudar todos os arquivos
- sua posição nos sites de busca irá melhorar. Em sites com CSS você pode identificar o que é importante e destacar as palavras-chave
- seu site se tornará acessível em diversos navegadores. Podendo ser melhor visualizado em celulares e outros aparelhos
(usando as tags strong e as de cabeçalho com HTML)
Por onde posso começar a aprender CSS?
Fiz uma lista com 21 sites sobre CSS e Tableless (design sem tabelas). São ótimos sites com tutoriais, guias, exemplos e layouts para aprender todas as manhas dessa poderosa e simples linguagem. Não perca tempo e comece AGORA!
Exemplo real de como layouts feitos com CSS são melhores
Vinicius Siqueira, dono do GamesOn, conta que com a mudança do layout em tabelas para quase todo em CSS houve uma redução de 50KB para 15KB por página e aumentaram as visitas vindas de sites de busca.
Textos de referência
- Stupid Tables (Em português) ~ Porque utilizar tabelas para layout é estupidez: problemas definidos, soluções oferecidas
- Why not tables? Is CSS really better?
- Build your pages with CSS, not tables
- Why avoiding tables (for layout) is important
Gostou desse post? Então assine o RSS Feed, Email ou siga-me no Twitter!
Artigos relacionados:
- Como Editar o CSS de Seu Site ao Vivo com Firebug
- Lista Suprema de Recursos para Desenvolvedores Web
- Recursos para WebDev – Parte 6: TOP 21 sites sobre CSS e Tableless
- Como Converter Seus Layouts No Photoshop (ou Gimp) Para CSS (e xHTML válido) Em Segundos com o PSD2CSS
- Como Criar uma Super Página de Erro 404 Que Fará o Usuário Continuar em Seu Site
Publicidade
Assine o RSS
[...] Porque criar sites com CSS é melhor do que com tabelas. [...]
O meu site ainda não tá legal, mas agora com um pouco de css já mudo todo o fundo com apenas seis digitos , enfim é uma maravilha, agora vou ver essas paginas q vc indicou, um abraço
Responder
desculpa, mais perder tempo com css não é minha praia não…
tabelas são 100% melhores, 100% compatíveis com qualquer navegador….
não tem aquelas do cliente te ligar e dizer: a testei no opera e no ie e tá tudo torto o site, com tabelas não tem isso, por esse fato que as tabelas NUNCA vão sumir…
vc abre o frontpage, da forma que vc “configurar” as tabelas elas vão aparecer, nada de usar um comando pra ie outro para firefox e por ai vai…
quando isso mudar, garanto que eu e milhares de designers tb vamos mudar….
até lá e besteira tentar falar no assunto…
Responder
Concordo com tudo! Na boa… Layout com tabela é coisa de amador. Com tabela até minha vó faz site!
abraços
Responder
André M respondeu em October 1st, 2011 8:03 pm:
Sim, até sua avó faz layout com tabelas.
Isso porque as tabelas são extremamente produtivas, o trabalho com elas é minimo e o resultado é fantástico.
Perder tempo trabalhando com 8, 9 ou 10 DIVs flutuantes que não obedecem direito, quando o trabalho poderia ser feito 10 vezes mais rápido usando uma única tabela, não é absolutamente NADA profissional.
É só desperdício de tempo e por isso mesmo de dinheiro.
Um bom profissional é obrigatoriamente versado em varias técnicas de criação e sabe escolher entre elas quando um projeto requer essa ou aquela solução.
O uso exclusivo de tableless é falta de profissionalismo. Infelizmente hoje os profissionais da área estão se deixando levar por essa modinha tola e assim agindo como amadores.
Responder
Eu concordo com o alexandre div pra mim é uma merda porque meu tio pediu uma empresa especializada em fazer sites e ficou uma merda a maioria das coisas ficaram tortas div é só pra complicar a cabeça do sujeito!!!!
eu sou web design e faço sites pros meus clientes todo feito com tabelas e nunca recebi ligações sobre reclamações que o site está torto!!!
só faço com tabelas!!!!
acessem meu site:
http://osandersondesing.t35.com/osandersondesign!!!
valew alexandre vc está completamente certo!!!
Responder
André M respondeu em October 1st, 2011 8:09 pm:
Pois é cara… o tableless é uma moda tola.
É autocastração. As tabelas fazem coisas que os DIVs não fazem.
Já viu a tal da faux column? é uma malabarismo caro e inutil que tenta reproduzir um comportamento atingido em 2 minutos com o uso de uma simples tabela.
A faux column deixa o site mais pesado, a manutenção mais cara e o tempo de produção é maior.
Pra que diabos usam isso? É que ouviram algum sabichão falar que usar tabelas é coisa de amador…
Hoje em dia, com o CSS, usar tabelas virou um paraíso.
Entregando um site feito com tabelas vai estar entregando maior qualidade e manutenção mais simples. Tempo é dinheiro e isso é o melhor para seus clientes.
Responder
“vc abre o frontpage”> 01 Apr 2010<
Com essa já perdeu minha credibilidade… só falta dizer que o frontpage é 100% melhor do que o dreamweaver!
Achu que comentar que prefere tabelas do que css é valido, mas não admitir que css é melhor é simplismente não intender o que é css!
economizar codigo, ganho na velocidade e etc….. tabela pra mim soh no Excel!
Responder
Ola entendedores , eu apenas gostaria de saber o seguinte , quero fazer um site dinamico , estou começando em meios de sites , fazer em Css , posso fazer dinamico ou nao , pois ate onde sei tenho que colocar codigos de php em tabelas dentro do site certo ou estou errado , e posso fazer um site em css e criar as tabelas dentro das divs do css sem problemas , aguardo e desde ja agradeço a resposta se possivel .
Responder
sei
Responder
Pra quem se diz profissional deve saber usar com adequação as linguagens e seus estilos apropriadamente por questões superficialmente citadas acima, que não irei me aprofundar.
Se existe um método proposto, que é o CSS, pq usar tabelas?Quem as critica é pq não sabe usá-las ou é muito preguiçoso(ou não domina). E se não sabe está sendo amador, sim; e se preguiçoso, que trabalho está oferecendo, hein!É só aprender a RESETAR o CSS antes que resolve o problema com os browsers.
Pra quem diz que div é uma merda e etc está dando claros sinais de que não sabe nada de programação, é o famoso cara que mexe com internet, mexe com linguagem de programação. Aí sim, concordo com a palavra “merda” citada acima pq na net tá cheio de site mal feito em todos os aspectos.
Se fosse tolice, não teríamos o CSS, programação orientada a objeto, o javascript partindo para o ajax e agora o Jquery…Acha que tais mudanças ocorrem apenas por redução de código ou por dar melhorias em vários aspectos técnicos tb?
Cliente só vê e só entende visual sim. Mas qdo a parte técnica começa a dar pau, ficar encrencado pq usou tabela, o código tá enorme, confuso, pesando no servidor, lento e etc, ai a bomba sobra pra quem????
Pra quem quer aprender direito, aprenda CSS e aprenda utilizar adequadamente as linguagens pra evitar dor de cabeça no futuro. Pra quem sabe fazer, não tem dor de cabeça pq tem conhecimento, é profissional.
Usava-se tabela ANTIGAMENTE pq no ínicio não havia o CSS e tudo era precário!
Minha respeitosa opinião!
Responder
André M respondeu em October 1st, 2011 7:57 pm:
Quem disse que existe oposição entre tabelas e CSS?
Antigamente não existia CSS, então usava-se tabelas sem ele, hoje o CSS existe e tornou as tabelas ainda mais poderosas.
O tableless é uma modinha idiota, a discussão é entre essa pratica e o layout fazendo uso de tabelas, isso nada tem que ver com o CSS.
A discussão está errada desde o começo.
Eu faço layouts usando CSS e tabelas, as combino com DIVs também.
Não faz nenhum sentido não aproveitar o poder das tabelas, em especial hoje em dia com as maravilhas do CSS.
Responder
Eu usava tabelas antes porque não tinha conhecimento em DIV, nem CSS…
Então comecei a estudar os dois e aposentei de vez a tabela.
CSS realmente nos permite fazer coisas incríveis, coisas que a querida não possibilita, mas não a descartei de vez, ainda uso ela pra outras coisas.
Abraço, belo post!
Responder
Eu sou bem novo nessa area tenho 13 anos e sei que css quando e mal ultilizado fica torto e distorcido em outros navegadores por isso bom texta em todos os navegadores para ver se vai ficar bom e se tiver erro concerteza e do seu codigo não acuse seu propio erro o erro e do seu codigo.
Responder
E desde quando a escolha é entre CSS e Tabelas?
Tabelas e divs são TAGs HTML, nenhuma delas se opõe ao CSS.
A escolha é entre DIVs e TABLES, ambas podem ser combinadas com o uso de CSS.
Coisa de amador é nem ao menos perceber isso.
DIVs são limitados e o uso exclusivo de DIVs limita a capacidade de Design.
Fazer layout usando a combinação TABLES + DIVs + CSS abre todo um leque de opções que superam em muito a limitada pratica do tableless.
Responder
Concordo com o André M.
Utilizo nos sites da agência em que trabalho a mescla de TABLES + DIVS e fica tudo organizado.
Construo a estrutura padrão em TABLE e dentro coloco os DIVS para ordenar. Fica tudo alinhado e o site roda 100% em qualquer navegador, por mais antigo que seja. Até mesmo em celulares há 100% de compatibilidade.
Lógico que usando recursos mirabolantes e plugins de terceiros pode haver problemas de compatibilidade, mas isso tudo tem que ser estudado antes.
Uso muito DIV em menus e em listagem de notícias e exibição de produtos, mas tudo dentro de um TABLE.
Erich
Responder