Início > CSS, Inspiração, Tutoriais > CSS – Inovações X Originalidade

CSS – Inovações X Originalidade

Acho que tanto a inovação como a originalidade são extremamente importantes.  Mas a dose que você vai usar de cada um no projeto depende da imagem que você quer passar.

Ninguém pode jogar 20 anos de história de uma empresa no lixo, mas também não podemos ficar presos há esses 20 anos. O segredo é o bom senso.

Já reformulei dezenas de sites, e muitos deles os clientes ainda queriam um aviso vermelho “piscante”. Confesso que até cedi uma vez, foi algo que me arrependo até hoje, mas tudo é aprendizado. Agora, muitas vezes olhava um logotipo horrível, nada a ver com a empresa, ou com a imagem que ela queria passar na web, mas o que eu 50 anos depois da fundação da empresa poderia fazer? Um layout de bom senso. Algo que faça com que você entre no site e não dê tanta importância para aquele logo, porque ele até fica bonito dentro do contexto. Esse é o desafio.

Pesquisando na internet, encontrei uma série de exemplos de inovações em CSS, mas também muita coisa que nos remete para a originalidade. Pena que os browsers atrapalham um pouco. Clique e inspire-se.

1) Transformações em 3D ( Safari 5 e Chrome 7 ):http://www.is-real.net/experiments/css3/wonder-webkit/

2) Uso de sombras – Esse site traz excelentes experiências com sombras. http://www.zurb.com/playground/css-boxshadow-experiments

3) Blur em texto – Simplesmente lindo. Impressionante. http://shakenandstirredweb.com/playground/blur/

4) Efeitos em texto selecionado. Certamente MUITO inovador e lindo resultado. http://manufacturaindependente.com/colorfont/

5) Toggle Button sem o uso de Java Script –http://lab.simurai.com/css/toggle/#box

6) Slideshow em CSS – http://www.designmadeingermany.de/slideshow/#a1

7) Animação de um homem andando usando só CSS e HTML http://www.andrew-hoyer.com/experiments/walking/

8) Alguns efeitos em botões – http://blog.typekit.com/2011/02/10/type-study-an-all-css-button/

9) Small Icons usando só CSS – Fantástico –http://inspectelement.com/articles/spin-those-icons-with-css3/

10) Formas geométricas e curvas em CSS – http://css-tricks.com/examples/ShapesOfCSS/

11) Efeito de página com sombra – http://www.matthamm.com/box-shadow-curl.html

12) Aquela pequena dobra no canto da página ainda pode ser útil – http://nicolasgallagher.com/pure-css-folded-corner-effect/

13) Ribbons – Efeito muito usado ultimamente, bem interessante – http://csswizardry.com/2011/02/css-powered-ribbons-the-clean-way/

14) Efeito neon usando só CSS – http://line25.com/articles/using-css-text-shadow-to-create-cool-text-effects

Anúncios
  1. Nenhum comentário ainda.
  1. No trackbacks yet.

Deixe um comentário

Preencha os seus dados abaixo ou clique em um ícone para log in:

Logotipo do WordPress.com

Você está comentando utilizando sua conta WordPress.com. Sair / Alterar )

Imagem do Twitter

Você está comentando utilizando sua conta Twitter. Sair / Alterar )

Foto do Facebook

Você está comentando utilizando sua conta Facebook. Sair / Alterar )

Foto do Google+

Você está comentando utilizando sua conta Google+. Sair / Alterar )

Conectando a %s

%d blogueiros gostam disto: