<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>Zamana.eti.br &#187; yahoo! user interface library</title>
	<atom:link href="http://www.zamana.eti.br/blog/tag/yahoo-user-interface-library/feed/" rel="self" type="application/rss+xml" />
	<link>http://www.zamana.eti.br/blog</link>
	<description>Just my Blog</description>
	<lastBuildDate>Thu, 24 Jun 2010 16:21:49 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=abc</generator>
		<item>
		<title>Yahoo User Interface ou YUI</title>
		<link>http://www.zamana.eti.br/blog/2008/11/01/yahoo-user-interface-ou-yui/</link>
		<comments>http://www.zamana.eti.br/blog/2008/11/01/yahoo-user-interface-ou-yui/#comments</comments>
		<pubDate>Sat, 01 Nov 2008 15:15:04 +0000</pubDate>
		<dc:creator>Rafael Zamana</dc:creator>
				<category><![CDATA[Desenvolvimento]]></category>
		<category><![CDATA[Dicas]]></category>
		<category><![CDATA[biblioteca]]></category>
		<category><![CDATA[css]]></category>
		<category><![CDATA[pinceladas da web]]></category>
		<category><![CDATA[reset]]></category>
		<category><![CDATA[yahoo! user interface library]]></category>
		<category><![CDATA[yui]]></category>

		<guid isPermaLink="false">http://www.zamana.eti.br/blog/?p=31</guid>
		<description><![CDATA[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 &#8220;grids-fonts-reset.css&#8221;. Aqui eu [...]]]></description>
			<content:encoded><![CDATA[<link rel="stylesheet" href="http://www.zamana.eti.br/blog/wp-content/plugins/flickrimageman/flickrimageman.css" type="text/css" media="screen" /><p>O Yahoo! tem se mostrando um ótimo companheiro para desenvolvedores, mas ao contrário do Google (que tem vários, milhares de ferramentas).</p>
<p>O <a title="Yahoo! User Interface" href="http://developer.yahoo.com/yui/" target="_blank">Yahoo! User Interface</a> ou simplesmente YUI, é uma ótima parte do Yahoo! para desenvolvedores de <em>front-end</em>, hoje eu percebi que simplesmente não desenvolvo mais sem antes colocar o link do &#8220;grids-fonts-reset.css&#8221;.</p>
<p>Aqui eu vou simplesmente falar desse CSS, mesmo que só isso é bastante coisa. Mas existem muitas outras coisas legais para se dar uma olhada.<span id="more-31"></span></p>
<p>Esse CSS é um apanhado de três arquivos dentro do Yahoo!. O grids, fonts e reset.</p>
<p>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.</p>
<h2>O reset</h2>
<p>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.</p>
<p>Tudo bem que é estranho você colocar a tag strong e o negrito não aparecer <img src='http://www.zamana.eti.br/blog/wp-includes/images/smilies/icon_razz.gif' alt=':P' class='wp-smiley' /> </p>
<p>Mas a intenção é essa. Imagine. Tudo o que você escrever, do mesmo jeito&#8230; Até os headings (h1, h2, h3, h4&#8230;) terão o mesmo tamanho. No começo é dificil se adaptar, mas com o tempo você acaba até gostando das coisas assim.</p>
<p>Um exemplo de página sem o reset:</p>
<p><a href="http://www.zamana.eti.br/blog/wp-content/uploads/2008/11/semreset.html">semreset</a></p>
<p>Agora o mesmo exemplo com o reset:</p>
<p><a href="http://www.zamana.eti.br/blog/wp-content/uploads/2008/11/comreset.html">comreset</a></p>
<p>A unica coisa que se manteve como normal foi a cor do link, pois as margins e paddings, já eram xD</p>
<p>Para começar a usar é só colocar esse CSS na página:</p>
<p><span class="tag">&lt;</span><span>link </span><span class="attribute">rel</span><span>=</span><span class="attribute-value">&#8220;stylesheet&#8221;</span><span> </span><span class="attribute">type</span><span>=</span><span class="attribute-value">&#8220;text/css&#8221;</span><span> </span><span class="attribute">href</span><span>=</span><span class="attribute-value">&#8220;http://yui.yahooapis.com/2.6.0/build/reset/reset-min.css&#8221;</span><span>&gt; </span></p>
<p>O CSS RESET está na sua versão 2.6.0 hoje. Logo seria mais interessante você entrar no site do <a title="Yahoo! UI Library: CSS RESET" href="http://developer.yahoo.com/yui/reset/" target="_blank">Yahoo! User Interface Library: CSS Reset</a></p>
<p>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.</p>
<p>Por hoje é só, senão esse post vai ser enorme, prometo que amanhã eu falo sobre o fontes.</p>
<p><strong>Update &#8211; </strong>O Pedro Rogério do<a title="Pinceladas da Web" href="http://www.pinceladasdaweb.com.br/blog" target="_blank"> pinceladas da Web</a>, mostrou algumas ótimas dicas para o Reset do CSS. <a title="10 dicas para o Reset do CSS" href="http://www.pinceladasdaweb.com.br/blog/2008/11/10/10-tecnicas-para-reset-css/" target="_blank">Confira</a></p>
<p>Abraços e obrigado pela atenção</p>
]]></content:encoded>
			<wfw:commentRss>http://www.zamana.eti.br/blog/2008/11/01/yahoo-user-interface-ou-yui/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

<!-- Dynamic Page Served (once) in 0.335 seconds -->
