HackerNews – agora sem elementos de tabela ou centro!

Eu estou brincando, eu estou brincando.

Na semana passada, postei um tópico no HackerNews perguntando por que o site usava tabelas para layout. Eu até percebi que eles estavam usando a <center>tag.

http://news.ycombinator.com/item?id=4370206

Pareceu-me muito estranho que um site tão avançado para desenvolvedores usasse construções da web retiradas diretamente de um site geocities.

Tudo o que HN precisava agora era de alguns GIFs de caveira giratória e era Angelfire City.


Esta manhã foi um dia lento no trabalho, então, em vez de andar pelo escritório, decidi reescrever o site Hacker News usando HTML e CSS – do jeito certo. (Ou então eu tentei! – Se eu errar, me avise!)

http://jsbin.com/ewufof/3/edit

A razão por trás disso foi um comentarista no tópico original da HN que perguntou qual era o motivo de não usar tabelas. “As tabelas apenas fazem com que pareça certo e é mais fácil de posicionar.” O antigo argumento. Concedido, ele disse que não era um desenvolvedor web; ele era mais voltado para o desenvolvedor de metal, lutando com C em sistemas embarcados.

Já que ele (e tantos outros) são todos sobre os números, como é isso para um número:

Site original da HN: 2.6087 caracteres.
Minha reescrita: 3587 caracteres.

Isso é uma economia enorme. Isso não apenas ficará mais leve no fio, mas o navegador o tornará mais rápido porque tem menos tarefas.

E pode ser ainda mais curto com um pouco de magia mais avançada.


O que estou tentando enfatizar é que usar <table>elementos para layout é ruim e você deve se sentir mal por usá-los. Se você tentasse modificar algo no HN original, demoraria muito.

No meu exemplo, apenas altere alguma regra CSS e ela se propagará para todas as que se aplicam.

Você acha que pode torná-lo mais curto?