Fora Tableless!
Publicado em: 2008-02-20 — 28.317 visualizacoes
Tableless é extremamente nocivo e presta um enorme desserviço aos Padrões Web.
Tableless dissemina um conceito totalmente equivocado sobre as tecnologias do W3C e no meu entender deveria ser banido definitivamente.
Escrevo esta matéria com dois propósitos básicos:
- Conclamar todos meus leitores que desenvolvem Blogs a escrever algo contra Tableless
- Alertar os desenvolvedores iniciantes (e até mesmo alguns não iniciantes) para os perigos de Tableless
A motivação para escrever esta matéria veio de um post colocado na seção Web Standards de um fórum para desenvolvedores. Lá, possivelmente um iniciante nos estudos dos padrões Web, perguntava como inserir dinamicamente o resultado de uma consulta a Banco de Dados em uma grade composta de n linhas por m colunas de DIVs.
Obteve como primeira resposta a sugestão de usar uma tabela desde que supostamente os dados a apresentar se enquadravam na categoria "dados tabulares" (como são os dados contidos em tabelas de índices financeiros, horários de meios de transporte, datas de jogos de campeonatos de futebol, preços em geral e similares).
Várias outras respostas e sugestões surgiram e lá pelas tantas o iniciante que postou a dúvida, talvez indignado com a insistência de outros participantes em convencê-lo a usar a usar uma bela e apropriada tabela argumentou que não queria a solução, pois (sic) "E este forum tbm nao fala sobre tableless?".
Humm! ele deve ter raciocinado assim: este fórum é sobre tableless, logo vou buscar uma solução tableless (sem tabelas).
Perfeito o raciocínio! Mas, baseado em uma premissa errada.
Tableless significa realmente sem tabelas, contudo Padrões Web não é e nem nunca foi desenvolver sites sem usar tabelas. Associar o nome Tableless aos Padrões Web é um erro altamente nocivo ao aprendizado. Tabelas são perfeitamente legais em marcações seguindo as recomendações do W3C, pois o elemento TABLE tem o valor semântico de "apresentar dados tabulares" e não deve nunca ser substituido por DIV, um elemento sem valor semântico, quando se trata de apresentar dados.
Portanto:
Fora o termo Tableless do jargão Web Standards!
À propósito:
Vida longa para o site do Élcio e Diego:
http://www.tableless.com.br
Desenvolvimento com Padrões Web? Adquira os livros do Maujor
Visite o site dos livros.
Esta matéria foi publicada em: 2008-02-20 (quarta-feira). Subscreva o feed RSS 2.0 para comentários.
Comente abaixo, ou link para http://www.maujor.com/blog/2008/02/20/fora-tableless/trackback no seu site.
[…] ao chamado do dinossauro das CSS, Maujor, vou dar minha colaboração contra o termo Tableless, que começou […]
Concordo plenamente.
É tudo uma questão de bom senso.
Grande abraço ao Maujor.
Não acho necessário se banir o termo Tableless, mas sim deixar claro que quando digo que crio um site com Tableless, não quer dizer que não vou utilizar tabelas, mas sim que não vou utilizar tabelas para criar o design.
Como dito no texto, tabelas devem ser utilizadas para dados tabulares e DIV para o layout.
Quando comecei a trabalhar com XHTML, aprendi o termo Tableless, mas me deixaram bem claro o que era isso.
[…] uns <br />’s ali e pronto. Sobre este assunto, recomendo a leitura do artigo “Fora Tableless” do […]
[…] pessoas que defendem que o uso do termo TABLELESS é prejudicial ( Maujor ( opa…citei nomes denovo )), mas eu particularmente não acho, acho que é muito […]
Legal seu artigo, sempre explico para estágiarios aqui da empresa isso, que dados de banco de dados e muitas informações, devem estar em tabelas, porém seguindo os padrões de desenvolvimento da W3C. Pois após ensinar Tableless para algumas pessoas, a maioria quer fazer TUDO sem tabelas. rs rs rs. Mas com a experiência e inteligência é fácil distinguir onde usá-las.
Rafael, se seu site não funciona no ie 6 é porque seu código precisa ser melhorado, quase tudo que se faz para os browsers modernos tb da para fazer para o ie6. Só se esforçar um pouco mais.
Olá, eu criei uma versão tableless para o meu site, no entanto ao testar percebi que ela não funcionava nada bem com o IE6, que é o 3º navegador mais utilizado (com mais ou menos 25% dos acessos) pelos visitantes do meu site.
Olhem as estatísticas de visitas dos últimos dias:
IE 7 -1364
FF 3 – 836
IE 6 – 816
Chrome 1 – 195
Outros (vários browsers e versões, poucas visitas)
O que vocês acham que eu deveria fazer nesse caso? O IE6 está pertinho do FF 3 e do IE7, não tem como eu simplesmente parar de suportar esse browser.
Acredito que o IE6 ainda é bastante utilizado pelos meus visitantes porque é um site local, e a minha cidade do interior não é das mais desenvolvidas tecnologicamente rs 😛
Até agora a versão disponível para os visitantes continua com tabelas.
Estou pensando em disponibilizar a versão tableless apenas quando o site renderizar corretamente em pelo menos 95% das visitas. O que acham?
Abraços, Rafael.
Acho importante separar as coisas: layout e dados são partes distintas do site e não podem ser confundidas. Acredito que os tables sejam úteis e devam ser usados sim, mas para exibição de dados e informações, não para desenhar o layout do site. Mas, nada de extremismo. Tudo que é em excesso é prejudicial… Se alguma porção do site é muito complexa para desenhar com div + css, então que se use o table com css para sua formatação.
Só uma coisa acho impraticável no desenho do layout de um site: marcação de formato inline (com o atributo style ou tag font, por exemplo). O CSS está aí pra isso e a forma mais correta de se fazer a formatação do conteúdo. O HTML serve para marcação, para definir o que vai onde e como deve ser interpretado, mas a exibição não deve ser responsabilidade dele.
Abraço!
Achei bem interessante o post, e tenho que admitir que te xinguei muuuuuuito quando lí o título! :]
O que o pessoal que tá começando com html/css tem que entender é o real significado de cada tag, conhecendo bem a semântica.
parabens, belo artigo!
Me lembro na epoca em q foi lançado o site Tableless.com.br e tinha postado justamente isso, q seria extremamente mal interpretado … as pessoas iriam achar q utilizar tables estava errado e blah blah blah … a maioria não me entendeu na epoca e ainda hoje insito em dizer q tableless eh uma definiçao muito infeliz! Pior q faz um tempao isso!
Concordo em 100% com o maujor, não misturemos as coisas, as pessoas acabam divulgando erroneamente uma nomenclatura que por uso acaba “parecendo” verdade.
Viva a TABLE para uso de dados tabulares! (Que redundante! 😀 )
Boa semana a todos!!
O termo foi lançado no mercado como a descrição de uma metodologia de trabalho essencialmente baseada na utilização das regras definidas como “padrões web”, com destaque especial para o não-uso de tabelas em layouts, técnica amplamente difundida por importantes designers da assim chamada “web 1.0”, protagonizada, especialmente, por David Siegel em seu livro “Creating killer web sites”, uma grande revolução para a web, naquela época.
Acho que o “problema” foi o uso do termo de forma marketeira: quando bem sucedido, leva o aluno a estudar, numa boa escola, com bons livros, as técnicas de padrões. Quando não, leva o tal aprendiz a uma busca desenfreada em sites de referência, e acaba tendo uma visão levemente distorcida das coisas.
Acho que devemos lutar pela propagação do termo “padrões web. É isso.
Parabéns pelo artigo!
Sinceramente eu sempre desenvolvi sites usando tableless, nunca fui a favor de usar Tables para construir a estrutura de meus sites. Acho feio e ridículo usar tabelas, e além disso, pessoalmente acho que o código fonte fica mais bagunçado usando tables…
Bom, então quer dizer o que? Devo abandonar o tableless e fazer sites somente em tabelas!!??
Logo que comecei a ler o post tomei um susto. “Mas tableless não deixou de ser tendência e já se tornou padrão na internet?”, me questionei. Muito bom o esclarecimento que você fez. Sou iniciante e muitas vezes me bati porque achava que deveria usar divs e a tabela cairia bem ali.
Meio tarde pra comentar, quase 6 meses depois do post publicado, mas o tema ainda me foi útil.
Até mais!
Conforme prometi no comentário #23, aí está:
Site com layout em tabelas:
http://www.ethicalinformatica.com.br/_arquivados/_ethical_ate_22_de_julho_de_2008/
Site Web Standards
http://www.ethicalinformatica.com.br/
Mudanças: CSS validado nos padroes web, semântica correta (talvez nem tudo), acessibilidade para leitores de tela e navegadores de texto, javascript não obstrusivo, AJAX em alguns recursos e etc…
Dêem uma olhada e se quiserem me enviar algum comentário, no final da página há o e-mail para contato.
Vlw, abraço.
Meu caro,
Você é que está equivocado.
Tableless condena tabelas quando seu uso não é para exibir dados tabulares.
Antes de condenar algo, tente se informar primeiro.
@Mauro
exatamente !
Deixa eu ver se eu entendi, usar as divs para a diagramação do site o layout, e as tabelas para dados tabulares tipo um calendário.
E o termo “tableless” é errado de se dizer o correto seria webstandarts.
Por favor me respondam, pode parecer ate bobeira para alguns é que sou iniciante mais procuro me aprofundar o maximo possivel.
Obrigado
E um abraço pra geral do blog e pro Maujor
Ressuscitando a discussão:
@William
É sim “sem tabelas”
Mas como o artigo mesmo disse, é impraticável se manter sem tabelas.
@Leandro
acho que nao cara, posso estar enganado pq meu ingles ta meio enferrujado mas pra ser “menos tabelas” seria less table, tableless realmente é “sem tabelas”……. alguem me corrija se estiver errado.
@Leandro
O último parágrafo do artigo responde tua pergunta.
A propósito, “tableless” significa “menos tabelas” e não “sem tabelas”, que seria “no tables”. Mas não entendi muito bem a intenção do artigo, enfim, maujor, vc defende que só usemos tabelas em dados tabulares, ou podemos usá-la para o layout do site?
[…] Atendendo ao chamado do dinossauro das CSS, Maujor, vou dar minha colaboração contra o termo Tableless (que começou como uma bandeira, hoje não faz mais sentido). […]
Depois de vários pedidos não feitos, eis o botão do Fora Tableless:
http://www.rjcorrea.com.br/images/micro-botao-fora-tableless.gif
Não tive paciência de esperar a opinião de todos rs
Olá Maujor, escrevi no meu blog sobre o lado nocivo do termo Tableless, e fiz uma imagenzinha que acho q pode virar um botão para disseminamos a ideia.
Vocês acha que vale a pena criar um selo?
Fiz um (meio roubado do seu).
Da pra ver no link:
http://www.rjcorrea.com.br/2008/04/27/fora-tableless/
Abração.
Ps: gostaria da opinião de todos.
nao consegui encontrar uma tag table no site do maujor…q engraçado….cade as tables…
Discordo plenamente.
Na minha opinião sites devem sim ser desenvolvidos sem tabelas, digo, a estrutura.
Mas também discordo com os pensamentos de pessoas que querem abusar do tableless para tentar “desenhar” tabelas utilizando css sendo que para isso existe a tag específica para exibir os dados tabulados.
Complementando o que o Joel Galdino disse no 11º comentario, que além do ganho de performace, a manutenção do site fica bem menos complicada.
O que eu acho engraçado nisso tudo é que uns anos atrás eu discuti isso com algumas pessoas, eu disse que o termo “Tableless” era um problema, uma bela maneira de fazer as pessoas entenderem tudo errado achando que é só sumir com as tabelas e tudo fica perfeito. Lamentável saber que ainda existe isso.
Eu gosto do site tableless.com.br, os caras são feras. Aliás, eles já discutiram isso em alguns posts, o problema é o pessoal preguiçoso que não busca se informar e se limitam a opiniões alheias garimpadas nos fóruns com pessoas mais desinformadas ainda.
E sabia que tem curso de Tableless?
O cara do fórum deveria ter estudado mais antes de falar besteira… Tem tantos artigos na web falando da importância semântica da table…
O cara do fórum deveria ter estudado mais antes de falar besteira… Tem tantos artigos na web falando da importância semântica da …
Maujor,
Retorno aqui para elogiá-lo pela iniciativa de “abrir os olhos” de muita gente, o que nem sempre, principalmente baseando-se nos comentários, é possível fazer…
E também queria parabenizá-lo pelo livro!
Abraços!
http://fabianopereiradesigner.blogspot.com
Depois de trocentos anos, finalmente resolveram falar que o termo “tableless” é péssimo?!?!?
[…] Maujor contra o (termo) Tableless! Leia o artigo. […]
@Luiz Tiago
Porque assim os mecanismos de busca apresentam meu site para aqueles desavisados que usam este malfadado termo nas suas buscas e aqui encontrarão o verdadeiro significado do termo.
Uma pergunta. Por que utilizas o termo Tableless no título do seu site ?
Perfeito!
Dados tabulares = Tabelas
Acho que a dúvida aí está no “less”. Traduzindo a palavra ao pé da letra, esta significa “Menos”, concorda ?
Não sou professor de inglês, mas vejo que less também é usado para: “SEM”. Como nos casos: wireless(sem fio), bondless(sem osso), etc.
Então o tableLESS seria “Menos” tabelas e não “Sem” tabelas, concorda?
Lembrando, também não sou a favor do uso desta palavra.
Abraços.
Olá pessoal, graças a vcs ja me convenci que tabelas ja era…. da web….
mas não consigo achar um tutorial digno de me ajudar a construir meu site em tabless preciso muito de ajuda pois trabalho com web e gostaria que todos os proximos sites da empresa fosse sem tabelas….
alguém poderia me indicar um site ou trutorial. que ensina perfeitamente????
muito obrigado
Alex Carvalho
alexcarvalhocp@gmail.com
alexcarvalho@climatempo.com.br
Ufa, também tomei um susto no começo do post.
Concordo plenamente. E falo mais uma coisa que não comentaram aqui:
“Tableless” quer dizer “com menos tabelas”, mas o pessoal entende “sem tabelas”, por isso que dá toda essa confusão. Acho que “Webstandards” soa melhor.
Concordo com você maujor.
Nos últimos meses tenho estudado a fundo a questão dos padrões web. Sempre usei tabelas para desenvolver todo o layout e confesso que passar a aplicar os padrões e obedecer a semântica não foi fácil, mas só no começo,. Hoje, como o Sampaio (22) comentou, não consigo me ver fazendo sites sem os padrões!
Infelizmente, o que aconte é que muitos não se dispõe a estudar, ler, praticar, exercitar, enfim, encarar a “novidade” de frente. É aí que acabam ficando estagnados.
A propósito, o site dessa escola de informática de florianópolis no meu link foi feito por mim em um layout com tabelas que está fora dos padrões. No momento estou refazendo tudo. Quando estiver pronto vou postar aqui tanto o velho como o novo site para análise, observação e críticas.
Abraço
E parabéns ao Maurício por tantas contribuições significativas!
Bem no comecinho, quando começou a se expor webstandards eu migrei para esse tipo de desenvovimento (já que como a maioria eu desenvolvia através de tabelas os meus layouts) gradativamente. Pesquisei muito antes de deixar o método antigo. Hoje utilizo 100% webstandards em meus sites. Mexe que vira enfrento problemas por incompatibilidades de browsers. Mas quando vejo meu código-fonte estufo o peito com orgulho. O que não acontecia com o método antigo, através das tabelas. Hoje me acostumei tanto em utilizar o novo método que não consigo mais voltar ao antigo, e acho muito mais difícil construir um site com tabelas. Agora dados tabulares em divs?? Francamente. Dados tabulares tem que ficar para os elementos que foram constituídos para dados tabulares!! Redundante?? Não. Lógica!! O que faltou ao nosso amigo lá do post. Webstandars não são só divs, amigo.
Resumindo, eu acho que webstandars nada mais são que lógica de HTML/CSS: usá-los da forma que eles foram criados para serem usados.
Esses maníacos do tableless são um pé saco, um deles já veio me perturbar por causa de uma tabela que exibia um CSV.
[…] – A grande novidade da transmissão do podcast ao vivo – Trabalhos Freelancer – Inclusão digital no brasil – Padrão MVC – Dada.net e Flycell.com – Críticas não-construtivas – Fora tableless – Desenvolvedores que não costumam ler […]
Boa Maujor! Iniciantes, como eu, se vangloriam em criar um documento sem nenhuma tabela, mesmo quando há a necessidade delas. Poucos sabem que é um conceito errado. E ao meu ver, criar uma tabela “nos conformes” é bem mais complicado do que montar um layout tableless. Acho que seria interessante, ao invés de divulgarmos “não ao tableless” ou qualquer outro não, divulgarmos um “sim às recomendações da W3C”, o que o teu site já faz com maestria. Abraço…
Apoio essa campanha!
Seria bom uma campanha a favor do divless também 🙂
Olá Maujor…li o post mandou muito bem, apenas na minha opinião o que poderia ser feito é, não ser totalmente radical, pois como vc mesmo disse o rapaz era iniciantee tinha uma visão meia errada do que realmente significa o Termo de tableless, o que podemos fazer neste caso (Se vc claro…faz parte de algum forum de web) e explicarmos o que realmente significa esse termo e dizermos também que, não tem essa de não poder usar tabelas, apenas não vamos fazer todo o layout recortado em tabelas…. assim estaremos ensinando mais uma pessoa a seguir e estudar realmente os padrões da W3C..
Té Mais Seu livro chega pra mim essa semana ^^]
[…] Fora o termo Tableless do jargão Web Standards! (blog do Maujor) […]
Olá, Mauricio e leitores…
Meu querido Maujor, seu post não poderia ter vindo em melhor momento… Me lavou a alma…hahahaha
Ontem mesmo eu estava explicando a diferença – como e para quê o CSS funciona – ao contato de uma agência que me contratou para um serviço e sabe o que tive que ouvir? “Acho que avaliei mal seus conhecimentos, achei que vc conhecesse mais de css, mas se vc só consegue fazer com tabelas tudo bem.”
Depois de tentar explicar a diferença e como funciona o CSS umas duas vezes, desisti. Infelizmente algumas pessoas repetem o vêem na net sem saber exatamente do que estão falando.
Assim como o Adriano, que leu o seu post, mas não compreendeu realmente o contexto, muitas pessoas lêem sobre CSS e Padrões Web, mas não compreendem exatamente o que está sendo dito e saem por ai fazendo um verdadeiro “telefone sem fio”. Imagina para qtas pessoas ele não deve ter dito que o Maujor é contra Tableless…
Talvez algumas acreditem, outras venham checar e outras achem impossível, enfim… podemos dar a informação, mas como ela será interpretada, infelizmente foge ao nosso controle.
Bjs e parabéns pelo excelente post,
Margot
O termo em questão representa, sem dúvida, uma evolução ao modo como o design de sites deve ser efetuado, porém, trata-se de um “neologismo” marketeiro de muita eficiência, a ponto de se confundir com o termo “correto”: padrões web.
Parabéns pelo artigo e vida longa aos defensores e praticantes dos padrões!
Olá Maurício e leitores,
Assim como os outros, tomei um susto ao ler esse título no meu leitor de feeds, curioso, li o artigo todo e fiquei mais calmo ;}
Realmente esse tipo de confusão é volte e meio reincidente, eu tive essa dúvida nos meus primeiros contatos com tableless e muitos ainda a tem. E é ótimo quando blogs respeitados no assunto como o seu, do Élcio e Diego, ZenGarden e por ai vai, postar o devido esclarecimento sobre o assunto.
PS: Acho que o Adriano não entendeu o post tanto quanto ainda não entendeu os benefícios de um layout sem uso de tabelas como componente do design.
Abraços
Acho que o Adriano (2º comentário) realmente não entendeu.
A proposta dos padrões web é justamente proporcionar compatibilidade aos diferentes browses e dispositivos.
Por exemplo: Eu posso ter o mesmo conteúdo apresentado de forma melhor em um smartphone. Apenas tendo uma folha de estilo própria para dispositivos móveis. Posso ter também uma versão própria para impressão.
Aprender a “pensar” como os padrões web é um investimento na carreira e sua produtividade será tão melhor quanto.
Também não posso esquecer no ganho em performace, já que estamos usando menos código.
O pensamento é simples: “Se você está usando tabelas para compor o designer do seu projeto, está tomando o caminho errado”.
O Orkut é um lugar onde deve-se disseminar isso!!!
Micox, eu tenho certeza que ele não entendeu.
Bom a idéia que eu tive do tableless quando comecei a estudar os padrões web, era para fazer o layout sem tabelas. Mas somente o layout. E não de usar divs ou qualquer outra coisa para apresentar dados tabulares.
Acho que a questão não resume-se em não usar tabelas, mais sim, “quando devo usar tabelas?”, visto que o problema maior para quem está iniciando na caminhada dos padrões web de desenvolvimento é justamente compreender como funciona a semântica de desenvolvimento e o valor semântico de cada elemento xhtml. Tableless sim!, mais apenas para se estruturar layouts, e que Deus ilumine a mente daqueles que tentam fazer divs funcionar semanticamente como tabelas.
Acho que o adriano (2o comment) não entendeu o recado…
Muito bem observado!
Realmente o termo é muito perigoso, até mesmo, para desenvolvedores experientes.
Abs
t+
Assunto veeeelho…
contudo, volta e meia encontro malucos tentando criar estruturas nianas para agrupar dados tabulados em que uma tabela serviria perfeitamente.
Ufa, no começo do post eu me assustei ..heheh achei que o pessoal(Élcio e Diego) tivesse feito algo de errado 😛
Mas infelizmente é assim mesmo, muito iniciantes no estudo de desenvolvimento web, acabam achando que se tirarem todas as da sua página, serão considerados os maiorais.
É ai que a coisa complica, e infelizmente é onde eles não entendem o recado do tableless 🙁
Grande abraço Maujor, parabéns e muito obrigado por tudo o que vc já fez pela Web 🙂
Clap! Clap! Clap!
Sempre desenvolvi sites com tabelas, coloco elas alí, em 30 segundos esta do jeito que eu quero. meus códigos (os mais atuais) geralmente validam tudo.
Esse esquema de Tableless, SÓ me da dor de cabeça, em questões de compatibilidade com diferentes browsers e versões.
HOJE, quem me diz para fazer todo em tableless, em mando ir às favas. quero produtividade com qualidade, e isso, as tabelas me servem muito bem.
ótima matéria. ótimos site, parabens!
Abraços
De acordo!
Já escrevi sobre isso em meu blog, e está na hora de reforçar o recado.
Assim que meu domínio (que expirou) voltar, será meu primeiro artigo.