Ubuntu 8.10
31 de outubro de 2008
About me wordpress plugin
27 de dezembro de 2008

O Yahoo! tem se mostrando um ótimo companheiro para desenvolvedores, mas ao contrário do Google (que tem vários, milhares de ferramentas).

O Yahoo! User Interface ou simplesmente YUI, é uma ótima parte do Yahoo! para desenvolvedores de front-end, hoje eu percebi que simplesmente não desenvolvo mais sem antes colocar o link do “grids-fonts-reset.css”.

Aqui eu vou simplesmente falar desse CSS, mesmo que só isso é bastante coisa. Mas existem muitas outras coisas legais para se dar uma olhada.

Esse CSS é um apanhado de três arquivos dentro do Yahoo!. O grids, fonts e reset.

Vou dividir cada um deles em um post diferente, assim quando quiser saber sobre somente um, você não vai precisar ficar procurando num texto enorme.

O reset

Como todo mundo que já desenvolveu HTML, algumas vezes você precisa resetar as configurações do browser para que você possa definir as suas próprias, mas às vezes fica faltando alguma propriedade para resetar. OK, faltava. O reset do Yahoo! procura resetar TODAS as propriedades de TODAS as tags.

Tudo bem que é estranho você colocar a tag strong e o negrito não aparecer 😛

Mas a intenção é essa. Imagine. Tudo o que você escrever, do mesmo jeito… Até os headings (h1, h2, h3, h4…) terão o mesmo tamanho. No começo é dificil se adaptar, mas com o tempo você acaba até gostando das coisas assim.

Um exemplo de página sem o reset:

semreset

Agora o mesmo exemplo com o reset:

comreset

A unica coisa que se manteve como normal foi a cor do link, pois as margins e paddings, já eram xD

Para começar a usar é só colocar esse CSS na página:

<link rel=“stylesheet” type=“text/css” href=“http://yui.yahooapis.com/2.6.0/build/reset/reset-min.css”>

O CSS RESET está na sua versão 2.6.0 hoje. Logo seria mais interessante você entrar no site do Yahoo! User Interface Library: CSS Reset

Lendo essa biblioteca, eu posso dizer que quando você ver a minha versão, ela vai continuar do mesmo jeito, pois o Yahoo! se compromete a deixar esses arquivos no servidor deles.

Por hoje é só, senão esse post vai ser enorme, prometo que amanhã eu falo sobre o fontes.

Update – O Pedro Rogério do pinceladas da Web, mostrou algumas ótimas dicas para o Reset do CSS. Confira

Abraços e obrigado pela atenção

2 Comentários

  1. DGmike disse:

    Legal!

    Normalmente não costumo usar frameworks para CSS, costumo usar o padrão * para resetar:

    * {margin:0;padding:0;list-style:none:border:0;font:normal normal 97% arial, tahoma, verdana, sans-serif;}

    Mas essa biblioteca é muito mais completa (e complexa) que isso, inclusive resolve problema da tag “q” que a porcaria do IE não coloca aspas automáticamente, então ele retira para os outros browsers.

    Muito bom artigo!

  2. Hi there I like your post “Yahoo User Interface ou YUI” so well that I like to ask you whether I should translate and linking back. Please give me an answer. Your Preiserhhung