Tableless - Desenvolvimento inteligente com Padrões Web

13/12/2005
Geral

Novo Tableless, agora WordPress

Como podem ver, o Tableless passou por uma reformulação. Tradicionalmente, costumo fazer essas mudanças no dia 1º de Janeiro, mas desta vez será diferente. Mudamos não só layout (gostou?) mas também nosso sistema de publicação. Nos anos passados, sofríamos um …

Por


Como podem ver, o Tableless passou por uma reformulação. Tradicionalmente, costumo fazer essas mudanças no dia 1º de Janeiro, mas desta vez será diferente.

Mudamos não só layout (gostou?) mas também nosso sistema de publicação. Nos anos passados, sofríamos um bocado para postar no site. Por isso, nessa reformulação, migramos para WordPress. Estamos gostando muito dessa ferramenta. Eu era um pouco avesso a aplicações prontas de publicação de blog. Por isso, ou fazíamos o nosso próprio ou editávamos direto o XML. Agora com WP nossos problemas acabaram.

Mudamos o layout também, como de costume. Feito meio às pressas, mas acho que ele agüenta até a próxima etapa.

Reformulei todo o Código XHTML e CSS. Se alguém abrisse o source do Tableless antigo, iria se deparar com técnicas ultrapassadas: image-replacement com SPAN, e outras coisas do tipo.
Agora, se você conferir nosso source, vai encontrar tudo comentado (para aqueles que gostam de estudar) bem como um CSS bem feito.

Mas o ponto forte, é que fomos para outro “hospedeiro”. Migramos para a DreamHost.
O pessoal que conheço (Bruno Torres, Danilo Medeiros, Thiago Rigonatti e outros) indica muito esse host. Com apenas US$7,95 você já consegue colocar seu site lá. Mais barato que os hosts brasileiros, e o serviço é impecável. E dizem que o suporte é fascinante.
Agora, estamos lá. :-)

Espero que as alterações sejam apreciadas por vocês, caros leitores.
Outras modificações virão com certeza.

OBS.: Gostaria de agradecer o Bruno Torres por ter ajudado a fazer essa migração. O cara simplesmente fez tudo. Desde instalação do WP até importação do XML enorme do site antigo.
Valeu cara.

A respeito do fórum, migramos para phpBB. Logo, logo, vamos dar um jeito também no layout. Infelizmente, não é possível importar as senhas do Snitz, que são codificadas num formato próprio. Então, para acessar, você vai precisar criar uma senha nova. Acesse por aqui e coloque seu nome de usuário e seu e-mail. Uma nova senha será gerada e enviada para você por e-mail. Se você não sabe seu nome de usuário, basta procurar algum post seu no fórum. É o seu nome, do jeito que estiver aparecendo lá.

Por Diego Eis

Diego Eis criou o Tableless para disseminar os padrões web no Brasil. Como consultor já treinou equipes de empresas como Nokia, Globo.com, Yahoo! e iG. É palestrante e empreendedor.

http://twitter.com/diegoeis/

Veja os outros posts de

  • http://cirofeitosa.com.br/ Ciro Feitosa

    Como sempre, belo trabalho Diego. Gostei da nova cara e organização do menu. Abraço!

  • http://copiaricolar.blogspot.com Webdotx

    Ficou muito bom mesmo, eu estava aqui pensando – porque vc´s não fazem um post especial explicando como é e o que o WP oferece. E como foi essa migração, esse layout maneiro que vc colocaram. Seria interesante. Outra coisa, quando vai sair o proximo Podcast?

  • http://cllabs.com Ricardo Zein

    Muito bom! Também gostei da idéia do amigo acima, sobre o “post explicativo”… =)

    Parabéns!

  • Shino

    Wow, ficou muito bom mesmo! Quase caí da cadeira quando vi hahaha.
    Ficou show de bola! Continuem assim!
    É, eu concordo com o Webdotx. Poderia haver um artigo falando sobre o WP.

  • http://360.yahoo.com/ataqlibert ataqlibert

    Muito bonito, porém (a propósito…. essa fonte aqui do input ficou muito massa!) minha retina doe enquanto espero a imagem da faixa ser baixada na minha conexão discada. E o menu não está cabendo todo em uma linha, então o último ítem ‘Contato’ ficou invisível, pois ele dece pra linha de baixo e letra branca funndo branco…. thcanam!!!

    Espero que meus comentários tenham sido úteis! E mais uma vêz… o design ficou bonitão eim!

  • http://360.yahoo.com/ataqlibert ataqlibert

    esqueci…. estou usando:

    ‘Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.7.10) Gecko/20050716 Firefox/1.0.6′

    Com 1024×768

  • http://www.papacidero.com Carlos Eduardo Papacidero

    Parabéns ! Ao contrário de vocês, estou esperando dia 1 para lançar meu novo site, gerenciado com esta ótima ferramenta que é o WordPress ! Ficou muito bom o Layout e não teve nenhum problema em meus navegadores (Firefox, Ie, Opera, Konqueror). Está ocorrendo um erro com os links dos seus Feeds (Rss), devido a codificação (UTF-8), se não me engano para resolver o problema é só mudar para ISO-8859-1 no próprio WordPress em Options/Reading/(Encoding for pages and feeds:) …

    Bom é isso parabéns e um ótimo fim de ano pra vocês ! Abraços e até + !

  • Leidiane

    Eita, ta dando um pau danado pra abrir aqui, na tela principal o fundo vermelho com essa fonte cinza ta impossivel de ler. Lá embaixo, em topicos ta invisivel. O recomendados deu erro, e tem um monte de codigo embaixo.
    A idéia do site ta bem legal.. so falta arrumar os problemas :)

  • Leidiane

    ah.. descobri é q os códigos estao esticando a largura da pagina e o background ta indo la pro meio e o texto ficando no canto… por isso q ta dificil ler… dificil nao, quase impossivel!

  • erro

    System error
    error: Can’t call method “prepare” on an undefined value at /www/del.icio.us/comp/user/get line 13.

    context:

    9: my $usedb = ‘master’;
    10: my $ret;
    11:
    12: if (!$auth_user) { $usedb = ‘user’ }
    13: if (!exists ($db->{$usedb})) { $usedb = ‘master’ }
    14: $user_name_q->{$usedb} = $db->{$usedb}->prepare(‘select * from users where user_name = ?’);
    15: my $query = $user_name_q->{$usedb};
    16: $query->execute(lc($user_name));
    17:

    code stack: /www/del.icio.us/comp/user/get:13
    /www/del.icio.us/site/html/dhandler:63
    /www/del.icio.us/site/autohandler:110

    raw error

  • http://www.desigactive.com.br juan

    fala pessoal!, olha só… tem algum problema na renderização do código no WP… no IE esta ruim (mas não é raro isso acontecer..rs) mas no FIREFOX ..aff, nao dá nem pra ler os artigos..

    acho que algum erro na chamada ao banco de dados…verfica isso pessoal.

    Abraços (o layout está maneiro)

  • Simei

    Té que enfim em diego ;)

    Muito bom, embora vc não largue esse menu à esquerda jamais…

  • http://www.facsal.br/junio Junio Vitorino

    Ah para galera!! Que isso, ficou show de bola cara putz! Ta bonitasso além do código que está empecável conferi o xhtml (para aqueles que gostam de estudar) sou um deles :) hehehhe
    Mas é isso galera parabéns pelo belo trabalho e pelo lindo design do site, vou ver se arrumo um tempo e implemento o word press no meu site, tenho ouvido falar que é uma ótima ferramenta.

    Abração galera! :P

  • Bruno

    Também gostei. Meus parabéns!

  • http://elcio.com.br/ Elcio

    Sobre o problema: http://del.icio.us/

    Triste, no dia em que a gente bota no ar um site usando isso, o negócio sai do ar :-(

    Já consertei, obrigado pessoal.

  • http://www.renepinheiro.com René Pinheiro

    Muito bom melhorou bastante. Parabéns a todos!

    Abraços,

    René Pinheiro

  • http://www.mastro.com.br Robsonrg

    Muito bom mesmo, gostei bastante.
    A hora que der um tempinho, vou estudar o code :D

    abraço
    Belo trabalho!

  • Adeonir

    Gostei muito da surpresa antecipada. Ficou bem organizado e o menu é fácil de achar o que procuramos.
    Só não gostei de uma coisa: uso o Firefox em 800×600 e a largura do layout está maior que isso. Se fosse só a barra de rolagem horizontal tudo bem, mas é que o background vermelho sai da posição e fica por baixo do texto, ficando impossível de ler.

    Abraços.

  • Diego Dacal

    Gostei muito das alterações, o layout ficou bonito também.
    Mas o que eu mais gostei foi dos cometarios no xhtml e no css. Aquele “*” do css foi uma maravilha, isso me ajudou muito!!!!

    Muito bom esse site/blog! Continuem assim!

  • Diego Dacal

    Só uma coisinha só….
    Ali naqueles Tópicos, bem ali do lado

  • Diego Dacal

    Desculpa, mas não querendo ser chato… eu tinha o rss de vcs neh.. daih levei um susto qdo vi q naum tinha nada lah.. daih vim no site e vi essa reformulação. Daih fui tentar reassinar o rss e veio um errinho..

    XML Parsing Error: xml processing instruction not at start of external entity
    Location: http://tableless.com.br/feed/
    Line Number 1, Column 2:
    -^

    To parecendo chato, me desculpa… mas eu sou frequentador assiduo do site de vcs a quase 1 ano. e quase todos os dias eu acesso! Abraços.

  • http://underconstruction TIGOS

    FINALMENTE!!!

    Belo trabalho heim Diego… adorei o site novo… muito bom mesmo!

    Ah!!! e ATÉ QUE ENFIM vocês ouviram minhas presses e colocaram o PHPBB como fórum para o pessoal… Também… eu ja havia dito trocentas vezes para o Elcio… hehehehe

    T+

  • http://www.japs.etc.br Flávio Theruo Kaminisse

    Muito legal o novo layout… Muito melhor que o anterior… E ainda com o WordPress… nem se fala…
    Continuem melhorando sempre…
    Parabéns…

  • http://www.dpartamentos.com.br dvd

    legal cara! só dou esses conselhos… vc vai mudar +, como disse, mas so pra constar:

    - não use apenas cores p/ diferenciar os links do resto do texto! é uma das recomendações do WCAG 1
    - links do rss + podcast tao mto grandes! …eu gosto de coisa grande (me inspiro mto no layout do wordpress), mas esse ficou mto eheh…
    - to achando bem legal, principalmente a divisão de assuntos do WP… isso eh joia!

  • http://rockgrafia.com/rs Fellipe Cicconi

    Nossa,

    Sincronizado. Mudei o meu blog pra WP esses dias também. Sem comparação. Simplesmente bom demais.

    Gostei do layout.

    Continuando a luta, valew!

  • http://www.cartaaberta.com/efrain Efrain

    Caralho, ficou fera! O wordpress é muito bom. Alias, tem como disponibilizar o tema que vc usou! hua hua hua!

  • http://www.ddweb.kit.net Douglas d’Aquino

    Nossa, achei muito melhor pessoal, parabéns. E o fórum em PhpBB realmente vai me incentivar a participar do fórum (o antigo me dava nos nervos heheh )

    abraço, e muito boa sorte nesse final de ano ;)

  • http://rodrigomuniz.com/blog Rodrigo Muniz

    Bom, muito bom! Só acho que quem usa 800×600 é que não vai gostar muito, pois tem gente que usa porque não tem escolha mesmo…
    Bom esse layout Diego! Ótimo trabalho de migração! A divisão em categorias e as pages… Arquitetura ótima! O código está muito bom, quando tiverem mais tempo coloca mais tags desconhecidas como ‘cite’ pra galera aprender a usar semanticamente. Parabéns ao Bruno, a você e ao Elcio, orgulho da comunidade geek brasuca.
    Demorou demais, mas agradou! Surpresa boa, presente de Natal pra comunidade hehehehe… Vamos comemorar! :D

  • http://cirofeitosa.com.br/ Ciro Feitosa

    O layout está apresentando scroll horizontal (bad) em resolução 800×600 :-(

  • http://jaymeayres.orgfree.com jayme

    Muito bom!! parabéns pelo layout!

  • http://tatanka.com.br/ Sérgio Lopes

    To querendo migrar para o DreamHost tambem mas estou com duvidas em relacao ao Google Adsense. Como vcs fizeram para regularizar a situacao fiscal do Tableless e continuar no Adsense?

    Acho que seria bem legal explicar pp mta gente tem interesse nisso. E eu nao faço a menor ideia de como conseguir um um TIN (Tax Identification Number) dos EUA.

    Valeu!

    Infos: https://www.google.com/adsense/taxinfo#nonus_uspresence

  • digito8

    Ainda falta definir o estilo das tabelas…
    Estava olhando um post de dezembro sobre acessibilidade e vi as tabelas relacionando browsers mal configuradas…

  • http://www.datasul.com.br Allan Felipe Santos

    Muito bom, continuem assim melhorando o design, bem limpo e simples. teste

  • Pingback: » Tableless.com.br 2006! - Rodrigo Muniz + Tecnologia, Webstandards, CSS, Internet, Web design, Cultura, Fotografia, Música...

  • http://www.guilhermebelesso.com GBK

    O RSS nada de funcionar no firefox, de uma revisada ai, estou terminando a minha página usando o wordpress tbm. Dê uma olhada ta ficando legal (pelo menos eu acho)
    Abraço

  • Marlon Quandt

    Gostei do novo site, mas e agora onde fica os Estudos que tinha no antigo tableless?!? Mais precisamente o tableless.com.br/estudo/divcentrotela/ ?!?

  • http://www.desvelare.com Ricardo

    Semântica – hierarquia da informação: onde está o H3? Vi que o código pula de H2 direto pra H4.

  • http://www.rebit.com.br Ricardo Franzen

    O site ficou bem legal, só percebi uma coisa, não sei se só está acontecendo comigo, uso Firefox 1.5 com Suse Linux. No menu superior a opção contato está quebrando na linha e está logo abaixo do link Home. Percebi que no FF algumas fontes estão bem maiores que no IE. Talvez seja algo do linux. Vou conferir em casa onde utilizo outra distribuição.

  • http://renatosantos.blogspot.com Renato Santos

    Pessoal do Tableless, alguns links da seção Aprenda não funcionam.

  • http://www.glacial.cjb.net/weblog/ Glacial

    Ficou bem legal. Só imagino o trabalho que deve ter dado pra importar os posts. :)

  • http://www.virtual.br22.com Marcus Siqueira | Virtual

    Ficou muito legal. O logo com um reflexo estilo vidro, o vermelho da borda da página, a separação de conteúdo via tópicos, etc…

    O que não gostei é que em 800×600 a página fica ruim de se ver. Ela gera um scroll na horizontal que a maioria das pessoas detestam. Em 1024X765 ficou muito bom.

    Uma dica. Poderia colocar um calendário mostrando os dias em que houve um post.

  • http://www.theducks.com.br/silas Silas Ribas

    Salve,

    Parbéns, e como vai ficar o blog ‘eyesmiles’?

    Valeu!!

  • felipe tonello

    Gostei muito do site novo.. o layout ficou bem melhor..
    gosto muito de layouts simples mas completos!

    MUITO BOM parabéns!!

  • http://www.fatorw.com Walmar Andrade

    Professores, vocês lançaram no mesmo dia que o meu só pra ofuscar foi? hehehe, brincadeira, ficou muito bom.

  • http://www.renatocruz.com.br renato cruz

    Gostei do novo visual! limpo e MUITO mais organizado! Até parece que o site cresceu! :)
    Não, ele não deve ter crescido, vcs somente organizaram as informações… muito legal. Mas o site está projetado para uma visualização apartir de 1024px ??

    Porque da exclusão do pessoal a 800×600 ?

    Valeu

  • http://dudufigueiredo.com Dudu Figueiredo

    Ta bem legal mesmo, tb to usando o WordPress, ja faz uns 3 meses, bem satisfatório.

    Só tem um problema, o que é aquele botão de Buscar ??? Tá quebrando totalmente o layout, chega a encomodar os ólhos.

    De resto ta aprovado =]

  • http://www.eliminarspam.com Ricardo

    Os meus parabéns pelo redesign. Os posts estão cada vez melhores e também acompanha esse ritmo ascendente.

    Boa disposição dos dados e simplicidade a nível geral demonstrando realmente que o conteúdo aqui é “Rei”.

    :)

  • http://www.dotpix.com.br/~wendel wendel

    Parabéns, muito bom mesmo o novo site. Gostei muito do design e o estilo de codificação, identação e comentários.

    Parabéns pelo ótimo trabalho!

  • Diego Carneiro

    Ficou mto bom, parabéns pro pessoal do tableless

  • http://www.cico.org.br Mike

    Caras, tá nove, mas meus pontos negativos são:
    - Layout não flexivel, ou seja, isto força a pessoa a usar a resolução que você quer, acho que não deveria ser assim. Tenta passar pra layout líquido (porcentagens ao invés de px ou em, sei lá, ainda não vi o código)
    - Os botões do PodCast e do RSS estão um pouco grandes, vai colocar mais alguma coisa lá? ou propaganda?
    - Arranca aquele Buscar Azul que dá nos nervos…
    - Coloca um menu com os Smiles pra galera nova no tableless sei la’ tipo assim, um emotion com o simbolo do tableless quando alguém escrever :tableless: :)
    - Odiei este cobão de enviar simples, sem cor (ou melhor, cinza no meu Win98)
    - Cadê a separação do conteúdo com o rodaé, isto me dá a impressão de embolação.. sei lá…
    - Talvez devido ao layout antigo que me deixa na cabeça, mas acho que poderia diminuir um pouquinho o cinza dos comentários…