Bruno Torres ponto net

Revolução do CSS

• Tweetar

Se você se interessa pelo menos um pouco por web já deve ter, ao menos uma vez, visto o CSS Zen Garden. O Zen Garden foi uma das maiores iniciativas em prol da adoção dos padões web. Foi criado em 2003 pelo Dave Shea com o intuito de provar que é possível criar diversos layouts, completamente diferentes entre si, mudando apenas o CSS, ou seja, mantendo o X(HT)ML intocado.

Hoje o CSS Zen Garden tem nada menos que 785 layouts, de acordo com a página que lista todos os layouts submetidos até hoje. Todos aplicados a um único código XHTML.

Bom, lá se vão dois anos da criação do Zen Garden e a web tupiniquim continua muito atrasada em relação à “gringa”. Pra tentar mudar isso, nosso amigo Henrique criou o Revolução do CSS. O Maurício Samy Silva já havia criado algo semelhante, mas os designs submetidos até hoje não são nada empolgantes.

Acho que isso se deve ao próprio código XHTML, pouco flexível. No Zen Garden original, o Dave Shea diz:

This xhtml document is marked up to provide the designer with the maximum possible flexibility. There are more classes and extraneous tags than needed, and in a real world situation, it’s more likely that it would be much leaner.

However, I think we can all agree that even given that, we’re still better off than if this had been built with tables.

Ou seja, pra você poder ter os mais variados tipos de layouts aplicados a um mesmo código, é inevitável popular esse código com algumas classes e divs a mais do que seria necessário para apenas um ou alguns poucos layouts.

Pelo que vi do código do Revolução, esse problema não existe. O código tem elementos o suficiente para qualquer designer poder brincar a vontade. Ainda tem poucos layouts (apenas quatro enquanto escrevo este post) mas o potencial é muito grande. Mexam-se, designers!

As regras (tiradas do próprio site) são:

1. Você não pode alterar nada do XHTML.
2. Sua folha de estilos deve ser 100% validada pela W3C.
3. Não serão aceitos trabalhos que utilizem algum tipo de imagem que possa ser ofensivo.
4. Você não pode alterar o conteúdo textual desta página por qualquer outro utilizando técnicas de “image replacement”. Pode utilizar o quanto de imagem você conseguir, mas certifique-se de que o texto transposto se encontra na imagem.
5. Para criar sua versão do Revolução do CSS, dê o nome de sua folha de estilos de “estilos.css” e salve-a junto com as imagens que utilizar em uma pasta com o nome do tema do seu layout. Não use acentos!
6. Para submeter seu trabalho, coloque-o em um servidor de sua escolha e me envie apenas a URL por e-mail.

Bom, é isso aí. Mãos a obra. Crie o seu design e mande pro Henrique. E boa sorte!