Revolução é uma alteração radical do status quo. Revoluções foram feitas por diversas razões, em diversas épocas e representando diversos interesses. Revoluções alteraram regimes políticos, economia, comportamento, métodos científicos, liturgia e conceitos religiosos, sentimentos, fronteiras geográficas , etc. Revoluções são oportunidades de reflexão e alteração das nossas atitudes e de rever conceitos, posturas, opiniões, cultura, decisões, caminhos e planos.
Costuma-se pensar em revolução apenas em um macrocosmo, que afeta milhares de vidas em uma nação ou continente. Uma revolução pode começar pela sua postura profissional, em prezar pela qualidade daquilo que é publicado na web. Esta página foi criada para estimular e encorajar todos os desenvolvedores e webdesigners a levantarem a bandeira dos padrões web, na Revolução do CSS! Dramaticidade à parte, esta é uma oportunidade de aprender e de ensinar o que você sabe de CSS, compartilhando seu trabalho neste espaço.
Como possivelmente centenas de outros sites espalhados pelo mundo foram inspirados no CSS Zen Garden de Dave Shea também me inspirei nele para fazer o Revolução do CSS. Pensando que poderia contribuir e estimular a utilização dos padrões da web no Brasil, resolvi escrever o código desta página de modo que pudesse utilizar o maior número de tags possível, instigando a curiosidade daqueles que querem o desafio de desenvolver um design para esta página utilizando apenas CSS.
Para publicar seu trabalho, seria bom que você fosse webdesigner. Não devo ser rígido com o material que receber, mas não se entristeça se eu não publicar seu trabalho. Procure ser criativo com o CSS o máximo que puder e não altere nada do XHTML 1.0 Strict .
Sua folha de estilos deve ser 100% validada pela W3C. Não me envie nenhuma trabalho com erros, inacabado ou ainda no layout. Valide sua folha de estilos antes de submeter seu trabalho. Para desenvolver sua própria versão da Revolução do CSS, baixe o arquivo de XHTML aqui, se quiser baixar meu CSS principal para estudo clique aqui, e após a conclusão do seu trabalho, coloque-o em um servidor e me envie a URL por e-mail. Se quiser um CSS com todas as classes já digitadas para te poupar trabalho extra, você pode baixar esta sugestão de CSS sem nenhum atributo. Nunca envie seu trabalho por e-mail, mesmo que esteja compactado.
Após avaliação, vou solicitar que você me envie seu trabalho compactado para publicação. Todas as folhas de estilos dentro da pasta com o nome do tema, devem ter o nome de "estilos.css". Quero ter o mínimo de trabalho possível na hora de publicar seu trabalho. Imagens e arquivo de CSS devem ser salvos em uma pasta com o nome do tema do seu design, com exceção do XHTML que deve estar de fora desta pasta. Devo gastar algum tempo para avaliar e publicar os trabalhos. Se você me enviar um e-mail e eu demorar um pouco para responder não se entristeça. Eu posso demorar mas respondo todos os meus e-mails.
Utilizei várias tags para ampliar o trabalho e o desafio na hora de criar um layout. Nunca deixe de criar um estilo específico para cada tag, por isso será de grande importância para avaliar seu trabalho. Se você não sabe a função de alguma tag, me escreva para sugerir um post. No meu site tenho procurado postar artigos de dúvidas enviados por e-mail. Várias coisas podem ser encontradas na web em português como o Tableless do Diego Eis. Estude, pesquise e crie seu trabalho. Procurarei ser o mais atencioso quanto o tempo me permitir. Você pode utilizar minha folha de estilos para estudar, mas não pode copiá-la tecnicamente.
Mais Importante do que saber, é saber onde encontrar.Albert Eisntein
Essa frase diz tudo sobre como começar um trabalho. Talvez você não tem conhecimento sobre todas as tags usadas aqui, mas saber onde encontrar uma solução nesta hora pode ser muito importante.
Utilizei diversas tags pouco comuns como <code>, <cite>, <caption> e outras. Explore essas tags o quanto puder. No XHTML, inseri as seguintes divs:
<div class="background1">
<div class="background2">
<div class="absoluto1">
<div class="absoluto2">
<div class="absoluto3">
Elas foram inseridas para que você possa usá-las para inserir backgrounds e imagens com pocisionamento absoluto. Aproveite-as.
O código desta página foi escrito em XHTML 1.0 Strict. Validei este documento de acordo com as diretrizes da W3C especificadas através do Web Content Accessibility Guidelines (WCAG - Normas de Acessibilidade de Conteúdo para Internet) validados no mecanismo Cynthia Says nas modalidades Section 508 e WCAG 1,2,3 , bem como o XHTML e o CSS. Submeti este trabalho também ao validador de acessibilidade brasileiro, Da Silva, produzido pela Acessibilidade Brasil.
Para a navegação, eu utilizei o recurso de Access Keys (Tecla de Acesso) suportado por alguns browsers como o Mozilla Firefox, que permite saltar para links específicos do site através dessas teclas previamente especificadas. No Windows você pode apertar ALT + TECLA DE ACESSO e para o Macintosh a combinação é CONTROL + TECLA DE ACESSO.
Esta postura está vinculada aos recursos utilizados nesta página está relacionada com as seguintes definições:
Inspirado também no trabalho de Chris Heillman, o CSS Table Gallery, membro do Webstandards Project e ocupado com a parte de DOM Scrip, resolvi inserir uma tabela abaixo onde você pode selecionar outros layouts disponíveis nesta página. Com isso você também poderá exercitar sua criatividade manipulando uma tabela 100% por CSS.
| Tema: | Autor: | Imagens + CSS: | Download do CSS |
|---|---|---|---|
| Total: | 6 Layouts | ||
| Tema | Autor | 100 kb | Download |
| Tema | Autor | 100 kb | Download |
| Tema | Autor | 100 kb | Download |
| Tema | Autor | 100 kb | Download |
| Tema | Autor | 100 kb | Download |
| Tema | Autor | 100 kb | Download |
Obrigado por enviar seu trabalho para o Revolução do CSS. Assim que concluir minha avaliação entro em contato com você.
Criei esta página com uma licença da Creative Commons e consequentemente todo o seu trabalho também estará sujeito à mesma licença, inclusive sua folha de estilos. Esta licença diz que você pode copiar, distribuir, exibir e executar esta obra e criar outras obras derivadas desta desde que não seja com fins comerciais e desde que compartilhe da mesma licença. Para cada novo uso ou distribuição, você deve deixar claro para outros os termos da licença desta obra. Você deve sempre dar crédito ao autor original da obra de forma clara.