Recentemente, o site americano BoingBoing completou 10 anos e decidiu inovar no seu layout. Decidiram usar da nova tecnologia e utilizar CSS3 e o código @font-face, que permite utilizar uma fonte personalizada nos sites. Mas algo deu muito errado.
BoingBoing antes e depois da atualização de visual. Estilo mais retrô.
Embora a função @font-face do CSS3 seja suportado pelas versões mais novas do Safari, Firefox, Opera e Chrome, usuários do Windows XP não possuem a opção de anti-aliasing ligada (já que não é padrão no sistema operacional). Sem levar em conta que o @font-face ainda é um rascunho do CSS3 e ainda não é suportado por nenhuma versão do Internet Explorer. Levando tudo isso em conta, imagine se um site gigante decide reformular seu site inteiro usando CSS3.
A BoingBoing redesenhou seu site inteiro, mas os títulos dos textos apareciam de forma diferente em cada navegador de cada sistema operacional, principalmente em Internet Explorer no Windows XP – que ainda era uma das maiores parcelas do padrão de usuários que acessam aquele site. Muita gente gritou e esperneou que o site ficou “terrível”, sendo que na verdade era o navegador e sistema operacional delas que estava interpretando de forma errônea o código CSS.
Após muita gritaria, os donos do site decidiram remover aquela fonte que estava causando problemas e substituíram pela boa e velha Helvetica. Isto levanta a discussão: será que a web não está pronta pro HTML5 e CSS3?
Você, web designer, acha que já dá pra começar a implementar códigos CSS3 em seus sites?
Gostou do artigo?
Aproveite então para assinar nosso feed RSS ou seguir o Design Blog no Twitter para sempre ficar ligado nas novidades no mundo do design!
Loading ...
7 comentários
“Sem levar em conta que o @font-face ainda é um rascunho do CSS3 e ainda não é suportado por nenhuma versão do Internet Explorer.”
Na verdade, @font-face é suportado desde o Internet Explorer 4…
Aqui tem um artigo bem legal sobre @font-face em geral:
http://snook.ca/archives/html_and_css/becoming-a-font-embedding-master
E aqui mais sobre o suporte dos browsers:
http://webfonts.info/wiki/index.php?title=@font-face_browser_support
[]’s
Eu já fiz uns testes com @font-face e dependendo do navegador fica horrível mesmo. Além do que as fontes legais e gratuitas são poucas. Mas… tem muita coisa legal para ser usada com CSS3. Sempre que posso coloco um pouco dele nos meus trabalhos.
Como o Marcio disse, dá para usar um pouco de CSS 3 sim, desde que exista bom-senso. Tem que funcionar como um brinde para o visitante que usa um navegador melhor e não como um castigo para o usuário do IE.
Alguns dos recursos que acredito poderem ser usados sem traumas são as bordas arrendondadas, sombras e opacidade.
No caso do BoingBoing, além de faltar bom-senso, sobrou preguiça. Testar no IE antes pode ser chato, mas nunca matou ninguém.
É eu ainda uso o CSS3 com moderação e tenho o mesmo pensamento da Helen
A maior questão ainda é que o CSS 1 é suportado a pouco menos de um ano por todos os navegadores (em suas versões mais atualizadas), o CSS 2 ainda está longe de ser suportado por todos e o CSS3 ainda nem foi definido por completo. Logo não faz sentido utilizar ainda, o CSS 2 ainda vai , mas o CSS 3 é desperdício de tempo atualmente.
Rapaz! Eu acho que deve ter sido horrível. Acho que a equipe desse BoingBoing aí não teve competência. Era pra ter feito testes e mais teste antes de acabar com tudo duma vez (entre aspas).
Abraços.
eles não substituíram pela helvetica. aqui em casa abriu com arial, mesmo tendo a helvetica instalada.
Regras
Antes de comentar, por favor atente-se as regras abaixo:
Os comentários neste artigos assim como em qualquer artigo deste blog não necessáriamente refletem a opinião dos autores e donos deste blog, como consta na Política de Privacidade e Uso deste blog.