<?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>Gabriel Mazetto a.k.a. BrodocK &#187; Desenvolvimento Web</title>
	<atom:link href="http://blog.gabrielmazetto.eti.br/categoria/desenvolvimento-web/feed/" rel="self" type="application/rss+xml" />
	<link>http://blog.gabrielmazetto.eti.br</link>
	<description>Ubuntu, Tecnologia e Ruby on Rails</description>
	<lastBuildDate>Thu, 02 Feb 2012 18:24:36 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>Gracefull Degradation, Progressive Enhancement e Fluid Layout</title>
		<link>http://blog.gabrielmazetto.eti.br/2009/05/02/gracefull-degradation-progressive-enhancement-e-fluid-layout/</link>
		<comments>http://blog.gabrielmazetto.eti.br/2009/05/02/gracefull-degradation-progressive-enhancement-e-fluid-layout/#comments</comments>
		<pubDate>Sat, 02 May 2009 03:09:28 +0000</pubDate>
		<dc:creator>Gabriel Mazetto</dc:creator>
				<category><![CDATA[Desenvolvimento Web]]></category>
		<category><![CDATA[acessibilidade]]></category>

		<guid isPermaLink="false">http://brodock.uocentral.com.br/?p=179</guid>
		<description><![CDATA[Já faz um tempo que não escrevo sobre coisas relacionadas a programação/desenvolvimento, então vou fazer a minha recomendação sobre alguns artigos interessantes.
A algum tempo atrás era comum ouvir por ai que &#8220;Internet Explorer&#8221; era um mal necessário. Ninguém que desenvolvia gostava, mas quando  [...]]]></description>
			<content:encoded><![CDATA[<p>Já faz um tempo que não escrevo sobre coisas relacionadas a programação/desenvolvimento, então vou fazer a minha recomendação sobre alguns artigos interessantes.</p>
<p>A algum tempo atrás era comum ouvir por ai que &#8220;Internet Explorer&#8221; era um mal necessário. Ninguém que desenvolvia gostava, mas quando chegava no contato com o cliente, ele podia nem saber direito pra que servia, mas estava esperneando se de alguma forma o seu site estivesse diferente (não estou nem cogitando a opção dele não funcionar direito, estamos falando de diferenças subjetivas, quase milimétricas).<span id="more-179"></span></p>
<p>O vilão ao qual me refiro é a versão 6.0, a talvez, mais odiada de todas. Digo isso, por que as que antecederam, eram tão incapazes que ficaram fadadas ao &#8220;de jeito nenhum, é impossível, não tem como&#8221;.</p>
<p>O problema aqui em questão é que pra muita gente leiga, o Internet Explorer é aquele &#8220;botãozinho azul que liga a internet&#8221;, some isso a realidade brasileira do final dos anos 90 em que windows original, quando existia, era uma única cópia pra empresa toda. E por essa realidade, todos tinham/tem medo de atualizar seu computador.</p>
<p>O resultado é um navegador que tem mais de <strong>8 anos de idade</strong> e ainda é bastante utilizado. Mas graças ao bom deus, essa realidade está mudando, e com o surgimento da versão 8.0 (amém) será possível escrever códigos mais próximos dos padrões internacionais da <a title="World Wide Web Consortium" href="http://www.w3.org/" target="_blank">W3C</a> e esperar que funcione razoavelmente bem em todos os navegadores.</p>
<p>Mas os artigos que venho propor aqui não tem muito a ver com o Internet Explorer 6, e sim com algumas técnicas que vamos ouvir falar muito ainda daqui pra frente.</p>
<p>Em resumo trata-se de uma maneira de você escrever códigos que funcionem bem em browsers antigos e funcionem melhor ainda em browsers modernos. E sem usar hacks ou artificios como prover códigos personalizados para cada navegador ou folhas de estilos especificas.</p>
<p>Tudo começa com o <a title="Liquid Web Design" href="http://www.digital-web.com/articles/liquid_web_design/" target="_blank">artigo de 1999</a> do <a href="http://www.nickfinck.com/" target="_blank">Nick Finck</a>, um veterano em desenvolvimento web, onde ele explica um pouco sobre o que é Liquid Web Desgin, que segundo ele, seria o exemplo máximo de um bom desgin. Aquele que se adaptasse ao tamanho da janela do cliente e mantivesse todas as suas características originais, ou se adaptasse o melhor possível.</p>
<p>Pela linha do templo, vamos agora para <a title="Digital Web Magazine: Fluid Thinking" href="http://www.digital-web.com/articles/fluid_thinking/" target="_blank">um artigo de 2002</a>, do <a href="http://www.digital-web.com/about/contributors/peterpaul_koch" target="_blank">Peter-Paul Kock</a>, o autor do site<a title="QuirksMode" href="http://www.quirksmode.org/" target="_blank"> QuircksMode</a>, um dos mais bem conceituados, durante muito tempo, website sobre informações de compatibilidade entre browsers. O artigo levanta a questão do <strong>Gracefull Degradation</strong> ou em uma tradução mais ao pé da letra seria <strong>Degradação Harmoniosa</strong>. Talvez o termo em português não ajude muito, mas o conceito é bem simples e baseia-se nas seguintes regras:</p>
<ol>
<li>Qualquer navegador <strong>deve</strong> ser capaz de ver o conteúdo do seu site</li>
<li>Qualquer navegador <strong>deve</strong> ser capaz de navegar pelo seu site.</li>
</ol>
<p>Para que isso seja alcançado, o seu site deve estar legível, mesmo que nenhuma imagem ou estilo CSS tenha sido carregado. Por legível entende-se que as coisas estejam organizadas logicamente e em uma sequência que faça algum sentido.</p>
<p>Uma maneira simples de testar isso é utilizando o navegador W3M do linux (navegador pro terminal).</p>
<p>Pegando um <a title="Progressive Enhancement with CSS3" href="http://dev.opera.com/articles/view/progressive-enhancement-with-css-3-a-be/" target="_blank">artigo mais novo</a>, do portal de desenvolvedores do Opera, de 2008, é sugerido um conceito novo. Ao invés de pensar pelo lado do <strong>Gracefull Degradation</strong> (de cima para baixo) ele sugere que comecemos de baixo para cima, pelo angulo do <strong>Progressive Enhancement</strong> ou <strong>Melhoria Progressiva</strong>.</p>
<p>Devemos desenvolver o nosso site, pensando na menor tecnologia (a mais antiga) que vamos suportar, e então ir adicionando progressivamente recursos das mais novas. O importante é que esses recursos não entrem em conflito com as tecnologias antigas. Dessa forma um site visualizado com o Internet Explorer 6 tera um visual &#8220;meia boca&#8221; ou uma versão &#8220;simplificada&#8221; visualmente falando do que seria visualizado por alguém utilizando o Internet Explorer 7, e progressivamente o Internet Explorer 8.</p>
<div id="attachment_183" class="wp-caption aligncenter" style="width: 310px"><a href="http://brodock.uocentral.com.br/wp-content/uploads/2009/05/example_6.png"><img class="size-medium wp-image-183  colorbox-179" title="Progressive Enhancement" src="http://brodock.uocentral.com.br/wp-content/uploads/2009/05/example_6-300x75.png" alt="Progressive Enhancement" width="300" height="75" /></a><p class="wp-caption-text">Exemplo de Melhoria Progressiva</p></div>
<p>A idéia é que se a pessoa ainda utiliza uma tecnologia antiga, devemos entregar para ela, algo que seja bem suportado para a tecnologia dela, sem tentar fazer milagres, e para aqueles que utilizam browsers mais avançados (vamos citar aqui todos eles: <strong>Safari 4</strong>, <strong>Opera 10</strong>, <strong>Firefox 3.5, Google Chrome</strong>), que também possam desfrutar das inovações.</p>
<p><a href="http://brodock.uocentral.com.br/wp-content/uploads/2009/05/best-browser.jpg"><img class="aligncenter size-full wp-image-186 colorbox-179" title="Melhores Browsers" src="http://brodock.uocentral.com.br/wp-content/uploads/2009/05/best-browser.jpg" alt="Melhores Browsers" width="477" height="171" /></a></p>
<p>O momento é de dizer um basta, para a seguinte frase: &#8220;Isso é legal, é uma pena que só vamos poder usar daqui uns 5 ou 6 anos, quando todo mundo resolver atualizar o seu Internet Explorer 6 pra uma versão melhor&#8221;.</p>
<p>Para quem não domina o inglês e gostaria de uma segunda opinião, eu <a title="Gracefull Degradation é sobre Acessibilidada" href="http://www.tableless.com.br/graceful-degradation-e-tudo-sobre-acessibilidade" target="_blank">indico um artigo do Diego Eis</a>, do site <a href="http://www.tableless.com.br" target="_blank">Tableless</a>, em que faz uma abordagem sobre o mesmo assunto, e por coincidência, encontrei enquanto estava escrevendo esse artigo. Fica a dica.</p>
]]></content:encoded>
			<wfw:commentRss>http://blog.gabrielmazetto.eti.br/2009/05/02/gracefull-degradation-progressive-enhancement-e-fluid-layout/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
	</channel>
</rss>

