<?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>Mais Tráfego &#187; webdesign</title>
	<atom:link href="http://www.maistrafego.pt/tag/webdesign/feed" rel="self" type="application/rss+xml" />
	<link>http://www.maistrafego.pt</link>
	<description>Mais Tráfego - Criamos Webmasters. Comunidade de webmasters de Portugal</description>
	<lastBuildDate>Fri, 27 Jan 2012 20:01:37 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
			<item>
		<title>Como criar uma proposta de WebDesign</title>
		<link>http://www.maistrafego.pt/como-criar-proposta-webdesign</link>
		<comments>http://www.maistrafego.pt/como-criar-proposta-webdesign#comments</comments>
		<pubDate>Wed, 12 Oct 2011 17:33:44 +0000</pubDate>
		<dc:creator>AnaMartelo</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[Destaques]]></category>
		<category><![CDATA[freelance]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[apresentacao]]></category>
		<category><![CDATA[freelancer]]></category>
		<category><![CDATA[guideline]]></category>
		<category><![CDATA[propostas]]></category>
		<category><![CDATA[publico]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=4723</guid>
		<description><![CDATA[Lidar com clientes é provavelmente uma das tarefas mais complicadas de quem trabalha na área criativa. Trabalhar arduamente num projecto, apresentá-lo ao cliente e receber críticas sem qualquer fundamento é algo que os WebDesigners estão bastante habituados. Apresentar um projecto e receber comentários e sugestões completamente disparadas é algo que um artista tem que saber [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center;"><a href="http://www.maistrafego.pt/wp-content/uploads/2011/10/apresentacao.jpg"><img class="aligncenter size-full wp-image-4725" src="http://www.maistrafego.pt/wp-content/uploads/2011/10/apresentacao.jpg" alt="" width="600" height="248" /></a></p>
<p style="text-align: justify;">Lidar com clientes é provavelmente uma das tarefas mais complicadas de quem trabalha na área criativa. Trabalhar arduamente num projecto, apresentá-lo ao cliente e receber críticas sem qualquer fundamento é algo que os <a href="http://forum.maistrafego.pt/" target="_blank">WebDesigners</a> estão bastante habituados. Apresentar um projecto e receber comentários e sugestões completamente disparadas é algo que um artista tem que saber lidar, para isso, seguem algumas dicas de como apresentar uma <a href="http://forum.maistrafego.pt/index.php?board=116.0" target="_blank">proposta de WebDesign</a> de forma a que o cliente vá ao encontro do que o artista criou (desde que todas as funcionalidades e pedidos estejam presentes).</p>
<h2 style="text-align: justify;">Apresentação do Projecto</h2>
<p style="text-align: justify;">Em primeiro lugar é imprescindível que a apresentação do projecto seja feita com muita fluidez e com total conhecimento de causa, isto é, o cliente tem que sentir a sua confiança a apresentar a proposta, mostrando que sabe exactamente o que está a falar.</p>
<p style="text-align: justify;">Antes de iniciar o projecto deverá fazer todo o tipo de pesquisa necessária para conseguir corresponder às necessidades e desejos do próprio cliente. Com essa pesquisa, mostra também, durante a apresentação do projecto final, que se interessou o suficiente para pesquisar sobre a empresa e as suas necessidades.</p>
<p style="text-align: justify;">Durante a própria apresentação do projecto do cliente, é importante que realce as suas próprias potencialidades, mostrando ao pormenor tudo aquilo que fez para que o cliente tenha o que de melhor existe. Realce a sua criatividade, originalidade, experiência e técnica, não exagerando para denegrir a sua própria imagem.</p>
<h2 style="text-align: justify;">Suporte de Apresentação</h2>
<p style="text-align: justify;">A forma de apresentar o projecto vai depender muito de como vai proceder a própria apresentação, isto é, se vai dirigir-se aos escritórios do seu cliente, prepare uma apresentação em vários suportes, podendo apresentar as potencialidades do website através de um suporte estático (vulgo, apresentação em power point).</p>
<p style="text-align: justify;">Deverá ainda mostrar o projecto a funcionar, isto é, mesmo que não queira colocar o website online, aloje-o no seu localhost e apresente-o todo em funcionamento, mostrando ao vivo o funcionamento do website (até porque é uma excelente forma de tentar “convencer” o cliente das suas potencialidades).</p>
<h2 style="text-align: justify;">A venda do projecto</h2>
<p style="text-align: justify;">Tudo o que esteve a fazer até agora já entrou no campo da “venda” do projecto, isto é, mostrou todas as qualidades e vantagens de utilizar o seu resultado final em detrimento da procura de uma outra solução. Porém, é importante que essa venda do projecto seja feita sem qualquer relutância ou dúvida. Mostre a sua posição, a sua confiança e dê várias razões e motivos para o cliente ficar com o projecto que está a apresentar.</p>
<p style="text-align: justify;">Poderá ainda dar exemplos concretos de marcas de renome ou equiparar de alguma forma o seu trabalho (nunca exagerando), mostrando assim que o cliente terá o website que realmente necessita para vender o seu produto/serviço.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/como-criar-proposta-webdesign/feed</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
		<item>
		<title>Experiência Do Utilizador: Persuasão, Emoção e Confiança</title>
		<link>http://www.maistrafego.pt/experiencia-do-utilizador-persuasao-emocao-e-confianca</link>
		<comments>http://www.maistrafego.pt/experiencia-do-utilizador-persuasao-emocao-e-confianca#comments</comments>
		<pubDate>Tue, 09 Aug 2011 15:30:00 +0000</pubDate>
		<dc:creator>Wanderley</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[Destaques]]></category>
		<category><![CDATA[escola]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[usabilidade]]></category>
		<category><![CDATA[webdesign]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=4515</guid>
		<description><![CDATA[A reflexão ou o estudo são muitas vezes colocados de parte pelo webmaster, isso não acontece por ele não reconhecer o seu valor, pelo contrário está relacionado com a sua natureza extremamente ativa e pouco propensa a paragens ou abrandamentos. Sim, o webmaster moderno deve ser inclinado para a ação mas tal como em todas [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/08/persuasao.jpg"><img class="alignnone size-full wp-image-4517" src="http://www.maistrafego.pt/wp-content/uploads/2011/08/persuasao.jpg" alt="" width="560" height="260" /></a></p>
<p>A reflexão ou o estudo são muitas vezes colocados de parte pelo webmaster, isso não acontece por ele não reconhecer o seu valor, pelo contrário está relacionado com a sua natureza extremamente ativa e pouco propensa a paragens ou abrandamentos. Sim, o webmaster moderno deve ser inclinado para a ação mas tal como em todas as outras áreas de negócio, às vezes é bom parar, respirar fundo e tentar compreender o que se passa à sua volta.</p>
<p><strong>Persuasão</strong>, <strong>emoção</strong> e <strong>confiança</strong> são todas palavras-chave a ter em conta quando se cria um website. Como eu já disse várias vezes no passado, para mim um website perfeito é aquele que foi planeado; pensado até ao mais ínfimo pormenor; que comunica de forma eficaz; que guia o utilizador com uma mestria tal que ele nem nota que está a ser guiado.</p>
<p style="text-align: center"><img class="alignnone size-full wp-image-4528" src="http://www.maistrafego.pt/wp-content/uploads/2011/08/guiar.jpg" alt="guiar o utilizador" width="520" height="321" /></p>
<p>Infelizmente a perfeição não existe e nós só nos podemos contentar com a sua perseguição, o que já não é nada mau. Voltando ao tema propriamente dito, por esta altura já devem ter compreendido que eu vou voltar a tocar na mesma tecla, na usabilidade. A única forma de tornarmos um website melhor é trabalhando a sério na usabilidade e isso meus amigos qualquer pessoa pode fazer.</p>
<p>O que é super-interessante nesta temática, é que o webmaster quando dá por si acaba por estar a analisar o comportamento humano. Consequentemente vamos adaptando o nosso projeto de acordo com esse mesmo estudo e a boa notícia é que às vezes nós fazemos isso sem sequer nos apercebermos que o estamos a fazer.</p>
<p>Ao contrário de um especialista em usabilidade, o webmaster com poucos conhecimentos na área não possui os automatismos para trabalhar a usabilidade com maior diligência e eficácia. Apesar disso ele pode sempre tomar a iniciativa e tentar aprender algo novo, bem como aproveitar os seus próprios utilizadores para realizar estudos e todo o tipo de testes que incidam sobre a usabilidade.</p>
<p>O vídeo que apresento aqui hoje vem da <a href="http://www.humanfactors.com/home/usability.asp"><strong>Human Factors International</strong></a> no qual a <strong>Dra. Susan Weinschenk</strong> explica um pouco a importância da <strong>persuasão</strong>, <strong>emoção</strong> e <strong>confiança</strong> num website e como nós podemos seguir um conjunto de princípios para melhorarmos a eficácia comunicativa do mesmo.</p>
<p>Antes de verem o vídeo é importante perceber que isto é apenas uma breve abordagem a alguns aspetos da usabilidade, existem muitos mais a ter em conta. Lembrem-se também de que as regras existem, mas que a sua aplicação pode variar consoante o projeto que têm em mãos. Há exceções, ideias que resultam em <strong>X</strong> e fracassam em <strong>Y</strong>,  mas o importante a retirar daqui é que parte do tempo de um webmaster deve ser perdido a analisar, estudar e a compreender como ele pode melhorar a experiência do utilizador.</p>
<p><object width="500" height="306"><param name="movie" value="http://www.youtube.com/v/3J85SUZFXNM?version=3"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/3J85SUZFXNM?version=3" type="application/x-shockwave-flash" width="500" height="306" allowscriptaccess="always" allowfullscreen="true"></embed></object></p>
<p style="text-align: left">Se estão interessados em saber mais sobre usabilidade então visitem também os seguintes artigos já aqui publicados:</p>
<ul>
<li><strong><a href="http://www.maistrafego.pt/um-bom-design-deixa-nos-felizes">Um Bom Design Deixa-nos Felizes</a></strong></li>
<li><strong><a href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro">Um Excelente Design Vale O Seu Peso Em Ouro?</a></strong></li>
<li><strong><a href="http://www.maistrafego.pt/venha-dai-o-scroll">Venha Daí O Scroll!</a></strong></li>
<li><strong><a href="http://www.maistrafego.pt/usabilidade-porque-a-ignoramos">Usabilidade: Porque A Ignoramos?</a></strong></li>
</ul>
<p style="text-align: left">Até à próxima</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/experiencia-do-utilizador-persuasao-emocao-e-confianca/feed</wfw:commentRss>
		<slash:comments>5</slash:comments>
		</item>
		<item>
		<title>Desmistificando O Logótipo</title>
		<link>http://www.maistrafego.pt/desmistificando-o-logotipo</link>
		<comments>http://www.maistrafego.pt/desmistificando-o-logotipo#comments</comments>
		<pubDate>Mon, 25 Apr 2011 20:41:37 +0000</pubDate>
		<dc:creator>Wanderley</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[Destaques]]></category>
		<category><![CDATA[escola]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[logo]]></category>
		<category><![CDATA[logotipo]]></category>
		<category><![CDATA[webdesign]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=4055</guid>
		<description><![CDATA[Uma identidade, uma representação gráfica, um símbolo. A velha lengalenga do logótipo é conhecida por todos, uns preocupam-se com eles outros nem por isso, mas até que ponto o logótipo pode ser importante para um projecto? Mais uma vez a minha intenção não é complicar a tarefa ao webmaster, vou desta forma evitar o jargão [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/04/logotipo.jpg"><img class="alignnone size-full wp-image-4063" src="http://www.maistrafego.pt/wp-content/uploads/2011/04/logotipo.jpg" alt="" width="577" height="260" /></a></p>
<p style="text-align: left;"><strong>Uma identidade, uma representação gráfica, um símbolo. A velha lengalenga do logótipo é conhecida por todos, uns preocupam-se com eles outros nem por isso, mas até que ponto o logótipo pode ser importante para um projecto?</strong></p>
<p style="text-align: left;">Mais uma vez a minha intenção não é complicar a tarefa ao webmaster, vou desta forma evitar o jargão técnico e tentar que este artigo seja acessível a todos, sejam eles webmasters avançados ou meros curiosos. Desmistificar o logótipo é tentar perceber o que ele significa para um projecto online, determinar a sua influência e no fundo realizar um pequeno processo de reflexão sobre esta temática.</p>
<p style="text-align: left;">Num excelente website nada é feito ao acaso, ou pelo menos quase nada é feito ao acaso. Esta é de resto uma das razões pelas quais eu gosto do webmastering, há sempre um caminho aberto para a experimentação, para testar novas ideias até se obter o resultado desejado. Tudo isto faz com que o webmaster passe também parte do seu tempo simplesmente a pensar.</p>
<blockquote>
<p style="text-align: center;">&#8220;Those who know how to think need no teachers.&#8221; (Mahatma Gandhi)</p>
</blockquote>
<p style="text-align: left;">É incrível como a frase de cima se adapta na perfeição ao webmastering, porque de certa forma nós estamos numa área onde não existem muitos professores e é a nossa disponibilidade individual para pensar, tentar aprender e testar coisas novas que irá determinar o nosso sucesso. Então se nada ou quase nada deve ser feito ao acaso num website, naturalmente que o logótipo, apesar de ser apenas um dos aspectos a ter em conta num projecto online, é bastante importante.</p>
<p style="text-align: left;">Deixem-me dizer-vos que este não é um artigo que pretende glorificar os designers nem considerar o seu papel irrelevante. Não, o objectivo é o de munir o webmaster de informação relevante para que no futuro, quando for altura de tomar uma decisão, ele esteja convenientemente preparado.</p>
<h3 style="text-align: justify;">1º- O Que É Um Logótipo?</h3>
<p style="text-align: left;">O logótipo é &#8220;<strong>A</strong>&#8221; representação visual da nossa marca porque é nele que se traduzem os valores da mesma. Nesta medida pode-se dizer que o logótipo é fundamental e que sem ele o conceito de marca dificilmente faria sentido.</p>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/04/coca-cola.jpg"><img class="alignnone size-full wp-image-4057" src="http://www.maistrafego.pt/wp-content/uploads/2011/04/coca-cola.jpg" alt="" width="620" height="323" /></a></p>
<p style="text-align: center;"><strong>Fonte Da Imagem: <a href="http://www.thecoca-colacompany.com/">Coca Cola</a></strong></p>
<p style="text-align: left;">Vamos tentar imaginar a <strong>Coca Cola</strong> sem o seu logótipo simples mas também inconfundível. É uma tarefa quase impossível porque a sua importância na história da marca é quase tão grande como o sabor da bebida. Isto não significa obviamente que o logótipo sozinho determinou o sucesso da Coca Cola, pelo contrário é importante compreender desde já que ele é apenas um dos elementos da identidade da marca, no entanto não deixa de ter o seu peso.</p>
<p style="text-align: left;">Um website é uma marca, uma potente ferramenta da comunicação que quando bem utilizada é capaz de fazer maravilhas. Como qualquer outra marca digna desse nome, também ela precisará de um logótipo, da tal representação visual forte. Em várias conversas que vou tendo com designers, é muito comum ouvir da parte deles a seguinte frase:<strong> </strong></p>
<blockquote>
<p style="text-align: center;">&#8220;O Logótipo é a marca.&#8221;</p>
</blockquote>
<p style="text-align: left;">É uma resposta demasiado simplista e até um pouco exagerada, mas apesar disso não deixa de ser válida e de fazer sentido. Por um lado já estabelecemos que a marca no seu todo não se resume apenas a um logótipo, pelo outro também chegámos à conclusão de que uma marca sem um logótipo dificilmente pode merecer esse título.</p>
<p style="text-align: left;">Vamos reformular a frase de cima e escrever antes que: &#8220;<strong>O logótipo é a representação visual perfeita da identidade da marca</strong>&#8221; ou se quisermos ser mais precisos podemos dizer que &#8220;<strong>Um excelente logótipo deve ser a representação visual perfeita da identidade da marca</strong>&#8221; porque é no fundo a isto que o designer se está a referir.</p>
<p style="text-align: center;"><a href="http://www.jersonwanderley.com/wp-content/uploads/2011/03/logo-amazon.jpg"><img class="size-full wp-image-1852 aligncenter" src="http://www.jersonwanderley.com/wp-content/uploads/2011/03/logo-amazon.jpg" alt="" width="559" height="164" /></a></p>
<p style="text-align: center;"><strong>Fonte da imagem: <a href="http://www.amazon.com/">Amazon</a></strong></p>
<p style="text-align: justify;">Num mundo ideal todos os logótipos seriam tão perfeitos como o da <strong>Amazon:</strong></p>
<ul>
<li>1º- Diz-nos que naquele local podemos comprar de tudo, deste a letra &#8220;A&#8221; até à letra &#8220;Z&#8221;;</li>
</ul>
<ul>
<li>2º- A mensagem é transmitida com recurso a uma seta, que para além de transmitir a sensação de movimento, quando combinada com as letras &#8220;M&#8221; e &#8220;A&#8221; forma um pequeno sorriso.</li>
</ul>
<p>Mas nós não vivemos num mundo ideal e verdade seja dita, a importância do logótipo pode variar consoante o projecto que temos em mãos.</p>
<h3 style="text-align: justify;">2º- Nunca Subestimes O Poder De Um Logótipo</h3>
<p>Um dos grandes erros que um webmaster pode cometer é subestimar o poder de um logótipo. Aliás a subestimação é uma daquelas palavras que não devem fazer parte do vocabulário de um webmaster, ou já agora de qualquer profissional que se preze. Como eu já referi em cima, uma marca sem um logótipo dificilmente pode ser apelidada de marca.</p>
<p>Sim o logótipo é apenas um elemento da identidade da marca e sim, é um tremendo erro julgar que ele pode ser dispensável ou insignificante. É importante esclarecer que apesar de no final do primeiro ponto eu ter escrito que &#8220;<strong>a importância do logótipo pode variar consoante o projecto que temos em mãos</strong>&#8220;, isso não significa que ele deixa de importar. E porquê?</p>
<ul>
<li>1º- Porque o logótipo vai fazer parte de tudo o que tem a ver com o nosso website;</li>
</ul>
<ul>
<li>2º- Porque o logótipo representa o nosso website mesmo quando, ele (o website) não está visível:</li>
</ul>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/04/merchandising.jpg"><img class="alignnone size-full wp-image-4058" src="http://www.maistrafego.pt/wp-content/uploads/2011/04/merchandising.jpg" alt="merchandising" width="560" height="420" /></a></p>
<p>O logótipo ajuda a identidade da marca, contribui para a sua distinção e facilita a sua identificabilidade. É por estas e por outras razões que ele não pode ser colocado de parte, especialmente se estivermos a falar de projectos sérios e ambiciosos.</p>
<blockquote>
<p style="text-align: left;">&#8220;O que  as pessoas querem é uma identidade e não um logótipo, uma        identidade  completa que identifique o site, os seus ideais, tema,        funcionalidades,  cores, sensações&#8221;</p>
<p style="text-align: right;"><a href="http://www.maistrafego.pt/author/admin">Nuno</a> (Mais Tráfego)</p>
</blockquote>
<p style="text-align: left;">A frase do Nuno resume na perfeição aquilo que nós enquanto webmasters devemos querer que um logótipo seja. É uma frase escrita por alguém que naturalmente reconhece a importância do logótipo e que acima de tudo tem uma noção perfeita do que ele significa e como pode ser preponderante no reforço da identidade da marca. Nunca se esqueçam que um website é também uma marca.</p>
<h3 style="text-align: left;">3º- O Bom Logótipo É Cada Vez Mais Importante</h3>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/04/ruido-visual.jpg"><img class="alignnone size-full wp-image-4059" src="http://www.maistrafego.pt/wp-content/uploads/2011/04/ruido-visual.jpg" alt="ruido-visual" width="560" height="253" /></a></p>
<p style="text-align: left;">Sejam muito bem vindos à sociedade do ruído visual, se ainda não repararam que vivem nela, por favor visitem uma grande cidade, parem durante alguns segundos e olhem à vossa volta. Em tom de brincadeira um amigo meu diz que ele já não é preciso tomar estupefacientes ou ser-se louco para se saber como é ter alucinações, porque hoje os estímulos visuais são tantos que basta uma desatenção para embarcarmos acordados em viagens surreais.</p>
<p style="text-align: left;"><strong>Porquê que um bom logótipo é importante numa sociedade assim? </strong></p>
<ul style="text-align: left;">
<li>Porque quando há muita confusão aumenta a necessidade de distinção.</li>
</ul>
<p style="text-align: left;">Esqueçam os logótipos das grandes marcas como a <strong>Nike </strong>ou <strong>Mcdonalds</strong>, esses são brilhantes mas foram criados há muitos anos atrás numa realidade completamente diferente. Em qualquer mercado é sempre difícil comparar realidades distintas e dizer que hoje em dia esses logótipos resultariam não é necessariamente verdade. É como aquelas pessoas que discutem futebol e dizem que o <strong>Eusébio </strong>ou o <strong>Pelé </strong>continuariam a ser os melhores do mundo se jogassem hoje, mas bem lá no fundo sabem que não é bem assim.</p>
<p style="text-align: left;">Actualmente não é fácil fazer com que um logótipo funcione, em parte devido à tal quantidade absurda de estímulos visuais a que estamos sujeitos e também porque o mercado de hoje está muito saturado. Costuma-se dizer que nos dias que correm já tudo já foi inventado e não há nada que não possa ser reinventado. Um ponto de vista divertido e talvez um pouco absurdo mas que espelha bem uma sociedade que há uns anos para cá tem vivido à custa de &#8220;<strong>remixes</strong>&#8221; ardilosos ousadamente apelidados de originais.</p>
<p style="text-align: left;">É claro que o webmaster moderno; aquele que percebe a importância do logótipo; aquele que estudou todas as formas e mais algumas de comunicar com os seus utilizadores; aquele que luta diariamente para que os seus projectos sejam cada vez melhores; aquele que reconhece que nós vivemos numa sociedade visualmente cada vez mais confusa, pretende um bom logótipo.</p>
<p style="text-align: left;">Ele procura a identidade, o tal conjunto de ideias, valores e princípios pelo qual se rege o seu projecto. Algo simples e que se destaque pela qualidade e se possível também pela originalidade.</p>
<p style="text-align: center;"><a rel="attachment wp-att-4060" href="http://www.maistrafego.pt/desmistificando-o-logotipo/empire-logo"><img class="alignnone size-full wp-image-4060" src="http://www.maistrafego.pt/wp-content/uploads/2011/04/empire-logo.png" alt="empire-logo" width="325" height="260" /></a></p>
<p style="text-align: center;"><strong>Fonte Da Imagem: <a href="http://logopond.com/gallery/detail/111865">Logopond</a></strong></p>
<p style="text-align: left;">O simples costuma funcionar, em usabilidade adora-se a frase &#8220;<strong>Less Is More</strong>&#8221; que foi proferida pela primeira vez por um poeta, &#8220;<strong>roubada</strong>&#8221; por um arquitecto, reutilizada pelos apreciadores do minimalismo e no fundo pode-se aplicar a praticamente tudo nas nossas vidas (heeee frase potente!!). Isto significa que eu não estou a exigir o logótipo mais original do mundo, porque em abono da verdade isso é extremamente difícil de se conseguir. Não, eu refiro-me a outro aspecto muito importante que a esse sim, nós todos podemos recorrer e ele pode funcionar como factor distintivo, chama-se <strong>qualidade</strong>.</p>
<p style="text-align: center;"><a rel="attachment wp-att-4061" href="http://www.maistrafego.pt/desmistificando-o-logotipo/logomotive"><img class="alignnone size-full wp-image-4061" src="http://www.maistrafego.pt/wp-content/uploads/2011/04/logomotive.png" alt="logomotive" width="325" height="260" /></a></p>
<p style="text-align: center;"><strong>Fonte Da Imagem: <a href="http://logopond.com/gallery/detail/63984">Logopond</a></strong></p>
<p style="text-align: left;">Não é por acaso que eu decidi dedicar um artigo a esta temática, porque actualmente na web nacional o logótipo ainda é muito negligenciado. Isto é uma má notícia por um lado, mas é uma boa notícia pelo outro, porque significa que nós podemos apostar num logótipo de qualidade para nos distinguirmos da concorrência.</p>
<blockquote>
<p style="text-align: left;">&#8220;Aproveita todas as oportunidades que tiveres para diferenciares o teu projecto&#8221;</p>
</blockquote>
<p style="text-align: left;">Uma das melhores formas de melhorar um projecto é trabalhar nos pormenores, é assim que com o tempo o vamos solidificando e tornando melhor. A preocupação com o logótipo pode parecer desnecessária mas a longo prazo podemos apanhar uma surpresa e perceber que afinal ela até foi determinante.</p>
<h3 style="text-align: left;">4º- Designer, Baixo Custo, Concursos, Amigo?</h3>
<p style="text-align: center;"><a rel="attachment wp-att-4062" href="http://www.maistrafego.pt/desmistificando-o-logotipo/decisao"><img class="alignnone size-full wp-image-4062" src="http://www.maistrafego.pt/wp-content/uploads/2011/04/decisao.jpg" alt="decisao" width="560" height="255" /></a></p>
<p style="text-align: left;">Chegámos então ao quarto ponto, por esta altura já percebemos perfeitamente o que significa e o quão importante pode ser um logótipo para um projecto. Falta agora decidir como vamos obter o logótipo para o nosso projecto. Será necessário gastarmos balúrdios com um profissional? Devemos pedir a um amigo que dê &#8220;<strong>uns toques</strong>&#8221; em design ou será prudente recorrer aos cada vez mais populares websites de concursos como o <a title="Logo My Way" href="http://www.logomyway.com/"><strong>Logo My Way</strong></a>?</p>
<p style="text-align: left;">Vou tentar abordar estas questões de forma objectiva e tendo em conta as necessidades de cada um.</p>
<ul>
<li>
<h3>4.1º- Recorrer Aos Serviços De Um Profissional</h3>
</li>
</ul>
<p style="text-align: left;">Se estivermos perante um projecto sério, com ambições, um projecto de longa duração, então é óbvio que a hipótese de contratar um profissional deve ser ponderada.</p>
<ul>
<li>E porquê que é tão importante que seja um profissional?</li>
</ul>
<p style="text-align: left;">Porque ele sabe o que faz, porque ele tem experiência e porque para qualquer tarefa existe o profissional certo e um designer é o ideal para criar um logótipo. Mais uma vez não vamos complicar o que é simples, quando nós temos um problema na canalização chamamos o canalizador, quando o carro tem problemas chamamos o mecânico e quando queremos um logótipo de qualidade, então um designer é a escolha acertada.</p>
<blockquote>
<p style="text-align: left;">Mas qualquer designer é capaz de criar um logótipo de qualidade?</p>
</blockquote>
<p style="text-align: left;">É como em tudo na vida, eu tenho a certeza que existem por aí designers a pedir preços elevados por trabalhos medíocres, mas também tenho a certeza que existem profissionais cujo portefólio e carteira de clientes são prova do seu valor. Cabe ao webmaster procurar pela pessoa ideal para o trabalho, sendo certo que se nós queremos um trabalho bem feito, então o melhor é colocar alguém capaz a fazê-lo.</p>
<p style="text-align: left;"><strong>Se vai sair muito caro?</strong> Depende dos nossos objectivos, depende até que ponto o designer é flexível. Mas lembrem-se de que um logótipo a sério vai necessariamente ter um preço justo e algumas pessoas podem achá-lo demasiado elevado. Felizmente nós podemos analisar, comparar trabalhos e decidir de acordo com as nossas possibilidades.</p>
<p style="text-align: left;">Não se esqueçam é de serem meticulosos na análise do mercado. A escolha de um profissional para a criação de um logótipo não deve ser feita de ânimo leve, tenham a <strong>CERTEZA ABSOLUTA</strong> de que aquela pessoa vai fazer um bom trabalho. Examinem exaustivamente o seu portefólio, se for preciso contactem até antigos clientes para receberem algum feedback.</p>
<ul>
<li>
<h3>4.2º- Logótipos De Baixo Custo</h3>
</li>
</ul>
<p style="text-align: left;">Refiro-me obviamente aos logótipos a 5, 10 ou 15 euros. Desde já informo que não tenho nada contra quem faz estes trabalhos, é simplesmente mais uma forma de ganhar dinheiro que pode desagradar alguns designers, mas é vista como uma oportunidade por webmasters.</p>
<ul style="text-align: left;">
<li>São os logótipos de baixo custo uma alternativa viável?</li>
</ul>
<p style="text-align: left;">Difícil de responder, mas à partida não porque o cliente está longe de receber um trabalho com o mesmo nível de algo desenvolvido por um profissional como ditam as regras. Mas eu reconheço também que determinados projectos não se podem dar ao luxo de gastar muito dinheiro e em tempos de crise compreende-se perfeitamente que recorram a estes serviços.</p>
<ul style="text-align: left;">
<li>E mesmo assim há alguma qualidade nos trabalhos?</li>
</ul>
<p style="text-align: left;">Há talvez uma qualidade limitada que depende muito da experiência da pessoa em questão. Quando falamos de logótipos de baixo custo é preciso compreender que na maior parte das vezes eles não são feitos por profissionais da área. Costumam ser curiosos ou até auto-didactas e existem sempre lacunas naturais de quem não obteve uma formação académica. Mas dito isto, não quer dizer que não seja possível encontrar profissionais minimamente capazes a realizar este tipo de trabalho, até porque formação académica não é garantia de talento que nestas coisas artísticas tem o seu peso.</p>
<p style="text-align: left;">A minha experiência pessoal diz-me que se alguém está disposto a gastar algum dinheiro num logótipo, então talvez seja uma boa ideia ir juntando mais algum e em vez de comprar algo a preço de feira, podem optar por um serviço mais acessível mas já com alguma qualidade. Eu sei que existem empresas que fornecem esses serviços mas infelizmente não tenho dados aqui comigo, pelo que agradeço que nos comentários os responsáveis por essas empresas deixem informação sobre os vossos serviços.</p>
<h3>4.3º- Concursos De Logótipos</h3>
<p style="text-align: left;">Para quem não sabe existem websites especializados em concursos de logótipos. Basicamente o webmaster submete a informação sobre o que deseja, paga uma quantia e aguarda pelas propostas de designers. O<strong> </strong><a title="Logo My Way" href="http://www.logomyway.com/"><strong>Logo My Way</strong></a> é provavelmente o mais popular destes websites, se o visitarem vão perceber como funciona.</p>
<p><strong>Quais as vantagens?</strong></p>
<ul>
<li>O preço não é elevado;</li>
<li>Podemos analisar várias propostas;</li>
<li>Existem algumas propostas de qualidade.</li>
</ul>
<p><strong>E as desvantagens?</strong></p>
<ul>
<li>Grande número de propostas sem qualidade;</li>
<li>Possibilidade de não ficarmos satisfeitos com as propostas e de perdermos dinheiro.</li>
</ul>
<p style="text-align: left;">Eu não sou contra os concursos de logótipos e mais uma vez depende das necessidades do projecto em questão. É mais uma forma económica de se conseguir um logótipo com alguma qualidade, ou pelo menos é uma possibilidade para que isso aconteça. Na minha opinião é uma alternativa bem melhor do que os logótipos de baixo custo, porque apesar de tudo existem algumas regras obrigatórias seguidas pelos designers que participam.</p>
<h3>4.4º- Vou Pedir Ao Meu Amigo Que Dá &#8220;Uns Toques&#8221;</h3>
<p style="text-align: left;">A resposta é não a não ser que o vosso amigo seja um designer a sério, com um currículo de respeito e esteja disposto a trabalhar de borla por amizade. Já agora metam também uma cunha por mim que eu preciso de amigos assim.</p>
<p style="text-align: justify;"><strong>Finalmente:</strong></p>
<p style="text-align: left;">O logótipo é um dos elementos da identidade da marca, tem o seu peso e não deve ser negligenciado. Mas no final do dia só o webmaster é que sabe até que ponto o seu projecto necessita de um logótipo profissional ou não. Quando há ambição é lógico que um logótipo profissional deve ser um dos objectivos, mas com a crise o os orçamentos a ficarem cada vez mais apertados, é normal que os projectos pequenos procurem alternativas económicas. Existem tantos elementos a ter em conta num projecto online, tantos investimentos para fazer que às vezes o dinheiro não chega para tudo. O melhor conselho que vos posso dar é que trabalhem com seriedade, sejam pacientes e inteligentes na forma como investem. Não se esqueçam também que nós estamos aqui para ajudar.</p>
<p style="text-align: justify;">Até à próxima</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/desmistificando-o-logotipo/feed</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>Vídeo tutorial &#8211; Introdução ao CSS &#8211; parte 2</title>
		<link>http://www.maistrafego.pt/video-tutorial-introducao-ao-css-parte-2</link>
		<comments>http://www.maistrafego.pt/video-tutorial-introducao-ao-css-parte-2#comments</comments>
		<pubDate>Wed, 02 Mar 2011 15:29:52 +0000</pubDate>
		<dc:creator>jota</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[CSS]]></category>
		<category><![CDATA[Destaques]]></category>
		<category><![CDATA[HTML]]></category>
		<category><![CDATA[tutorial]]></category>
		<category><![CDATA[video]]></category>
		<category><![CDATA[webdesign]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=3865</guid>
		<description><![CDATA[Olá a todos, no seguimento do tutorial de CSS, coloco aqui hoje a segunda parte. Continuamos com o mesmo formato de screencast, sugestões para melhorar são bem-vindas. Vamos continuar a abordar os elementos do CSS, nesta segunda parte passamos uma vista de olhos pelo universal selector, element type selector e as class selector. Espero que [...]]]></description>
			<content:encoded><![CDATA[<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/01/css.png"><img src="http://www.maistrafego.pt/wp-content/uploads/2011/01/css.png" alt="" title="css" width="590" height="250" class="alignnone size-full wp-image-3674" /></a><br />
<br />
Olá a todos, no seguimento do <a href="http://www.maistrafego.pt/video-tutorial-introducao-ao-css" target="_blank">tutorial de CSS</a>, coloco aqui hoje a segunda parte. Continuamos com o mesmo formato de screencast, sugestões para melhorar são bem-vindas. Vamos continuar a abordar os elementos do CSS, nesta segunda parte passamos uma vista de olhos pelo universal selector, element type selector e as class selector. Espero que gostem.</p>
<p><strong>Neste vídeo: </strong></p>
<ul>
<li>Universal selector;</li>
<li>Element Type Selector;</li>
<li>Class Selector.</li>
</ul>
<p><iframe title="YouTube video player" width="590" height="390" src="http://www.youtube.com/embed/FlZdMUN8wcE" frameborder="0" allowfullscreen></iframe><br />
<br />
Espero que tenham gostado. Qualquer sugestão que tenham sobre o formato, de modo a poder melhorar a qualidade do screencast, ou qualquer dúvida, deixem nos comentários. Obrigado e até à próxima.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/video-tutorial-introducao-ao-css-parte-2/feed</wfw:commentRss>
		<slash:comments>13</slash:comments>
		</item>
		<item>
		<title>Banner animado em Photoshop</title>
		<link>http://www.maistrafego.pt/banner-animado-em-photoshop</link>
		<comments>http://www.maistrafego.pt/banner-animado-em-photoshop#comments</comments>
		<pubDate>Mon, 28 Feb 2011 15:45:05 +0000</pubDate>
		<dc:creator>Guest Post</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[Destaques]]></category>
		<category><![CDATA[escola]]></category>
		<category><![CDATA[banners]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[photoshop]]></category>
		<category><![CDATA[webdesign]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=3838</guid>
		<description><![CDATA[Neste tutorial decidi ensinar algo de que muitos webmasters necessitam com muita frequência, proponho-me a ensinar-vos a produzir um banner animado com recurso ao conhecido software Adobe Photoshop. Um banner é de extrema importância para ajudar um projeto ou campanha a seguir um caminho de sucesso. É lógico que não depende apenas da qualidade dos [...]]]></description>
			<content:encoded><![CDATA[<p>Neste tutorial decidi ensinar algo de que muitos<strong> webmasters</strong> necessitam com muita frequência, proponho-me a ensinar-vos a produzir um banner animado com recurso ao conhecido software <strong>Adobe Photoshop</strong>.</p>
<p>Um banner é de extrema importância para ajudar um projeto ou campanha a seguir um caminho de sucesso.<br />
É lógico que não depende apenas da qualidade dos efeitos criados no banner, mas de todo o trabalho gráfico inerente à promoção para que o banner traga um maior numero de visitas ou converta num maior numero de vendas.</p>
<p>Apesar de ser possível produzirmos banners animados em várias aplicações vou ensinar-vos a construir apenas um banner simples em<strong> Photoshop</strong>.</p>
<h3>Criação do ficheiro</h3>
<p>Vamos precisar de criar um ficheiro com 72 dpi sendo que o banner apenas será usado em monitores (screen)</p>
<p><strong>1.</strong> Criar ficheiro com 125px por 125px (<strong>PC</strong>: crtl+n <strong>MAC</strong>: cmd+n)<br />
<strong> </strong></p>
<p><strong>2.</strong> Criar novo layer para o nosso documento. (<strong>PC:</strong> shift+crtl+n <strong>MAC:</strong> shift+cmd+n)</p>
<h3>Criação do design</h3>
<p>Criámos o exemplo usando o nosso logotipo e uma cor sólida de fundo, mas podem (e devem) sentir-se livres e criativos na hora de conceber o design do vosso banner, principalmente mantendo coesão gráfica com o resto do projeto / site / produto que visa publicitar.</p>
<p><strong>1.</strong> No nosso background aplicamos uma cor sólida (<strong>ATALHO</strong>: G)<br />
<strong> </strong></p>
<p><strong>2.</strong> No layer 1 vamos colocar o nosso logotipo. ( <strong>PC</strong>: ctrl+o <strong>MAC</strong>: cmd+o &#8211; Para abrir o ficheiro com o logotipo a aplicar.)<br />
<strong> </strong></p>
<p><strong>3.</strong> No layer 2 colocamos os serviços ou nome do nosso projeto. (<strong>ATALHO</strong>: T)</p>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado1.png"><img class="alignnone size-full wp-image-3841" title="banneranimado1" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado1.png" alt="" width="123" height="124" /></a></p>
<h3>Criação de Frames</h3>
<p>Chegou a parte que muitos não estão familiarizados, a animação.</p>
<p>Em <strong>Photoshop</strong> a animação é controlada através da janela &#8220;<strong>Animation</strong>&#8221; em interação com os layers existentes no nosso documento.</p>
<p><strong>1.</strong> Abrir a janela Animations &#8211; Menu &#8211; <strong>Window&gt;Animation</strong></p>
<p><strong>2.</strong> Alterar a vista da janela de animação para &#8220;<strong>Frame animation</strong>&#8220;. Para isso basta premir o ícone no canto inferior direito da janela.<a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado2.png"><img class="alignnone size-full wp-image-3842" title="banneranimado2" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado2.png" alt="" width="26" height="12" /></a></p>
<p><strong>3.</strong> Vamos duplicar duas vezes o nosso primeiro frame, premindo o ícone similar ao da janela de layers para criar um novo layer. <a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado3.png"><img class="alignnone size-full wp-image-3843" title="banneranimado3" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado3.png" alt="" width="15" height="13" /></a></p>
<p><strong><a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado4.png"><img class="alignnone size-full wp-image-3844" title="banneranimado4" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado4.png" alt="" width="590" height="538" /></a></strong></p>
<h3><strong> </strong><br />
<span style="background-color: #33cccc; color: #ffffff;"><strong></strong></span>Animação</h3>
<p>Na altura da animação existente várias técnicas e formas de fazer &#8220;aparecer&#8221; e &#8220;desaparecer&#8221; os nossos objetos.No exemplo apresento apenas a alteração em opacidade dos layers do nosso banner.</p>
<p><strong>1.</strong> Selecionar o segundo frame na nossa janela &#8220;Animation&#8221;.<br />
<strong></strong></p>
<p><strong>2.</strong> Ocultar o nome do nosso site premindo o icon com olho na janela de Layers.<br />
<strong></strong></p>
<p><strong>3.</strong> Neste passo vamos selecionar o terceiro frame da nossa animação e ocultar o logotipo &amp; nome na janela de Layers.</p>
<p>Por agora deverá aparecer assim:</p>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado5.png"><img class="alignnone size-full wp-image-3845" title="banneranimado5" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado5.png" alt="" width="588" height="143" /></a></p>
<h3>Temporizador &amp; Efeitos</h3>
<p><span style="background-color: #76c8b5; color: #ffffff;"><strong></strong></span>Podemos temporizar e aplicar como tinha referido anteriormente transições que tornam o nosso banner único.</p>
<p><strong>1.</strong> Antes de iniciarmos a temporização final vamos passar todos os frames para 0 segundos.<br />
Para isso basta clicarmos na seta abaixo do thumbnail do frame para abrir um pequeno menu com diferentes opções de tempo, devemos  escolher a opção &#8220;No delay&#8221; nos 3 frames.<br />
<strong></strong></p>
<p><strong>2.</strong> Agora avançamos para as transições.<br />
Selecionamos o primeiro frame e clicamos no ícone de transições que está posicionado a esquerda do ícone de duplicação de frames.<a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado6.png"><img class="alignnone size-full wp-image-3846" title="banneranimado6" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado6.png" alt="" width="27" height="15" /></a> Vai abrir um menu que define o numero de frames que se pretende criar e que tipo de transição vamos usar.</p>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado7.png"><img class="alignnone size-full wp-image-3847" title="banneranimado7" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado7.png" alt="" width="368" height="279" /></a></p>
<p><strong>3. </strong>O nosso segundo frame passou a ser  o 5º, vamos selecciona-lo e repetir o processo criando uma transição para o ultimo frame.<br />
<strong></strong></p>
<p><strong>4.</strong> Se pretendermos criar um loop devemos ter em atenção na hora da criação para a transição do nosso ultimo frame. Pois devemos criar uma transição com base no primeiro frame.</p>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado8.png"><img class="alignnone size-full wp-image-3848" title="banneranimado8" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/banneranimado8.png" alt="" width="373" height="283" /></a></p>
<p><strong>5.</strong> Podemos por fim colocar a nossa temporização nos nossos frames principais.<br />
Vamos seleccionar o 1º frame e escolher no menu de tempos 5.0 segundos, de seguida selecionamos o nosso 5º frame e escolhemos no menu de tempo a opção 2.0 segundos.</p>
<h3>Salvar</h3>
<p>Antes de salvar convém premir o <strong>play</strong> na janela Animation para termos <span style="text-decoration: underline;">100% de certezas</span> que está tudo como pretendido.</p>
<p>É importante dizer que para o nosso banner correr em loop deverá no canto inferior esquerdo da janela Animation ler-se <strong>Forever</strong>.</p>
<p><strong>1.</strong> Para salvar-mos um banner animado devemos ir ao menu <strong>File &gt; Save for Web &amp; Devices</strong><br />
<strong></strong></p>
<p><strong>2.</strong> Irá abrir uma nova janela onde podemos escolher várias pequenas definições que vão alterar o nosso *.gif final. Escolham <strong>*.gif</strong> a 256 cores e salvem.</p>
<p><a href="http://www.maistrafego.pt/wp-content/uploads/2011/02/Banner-tutorial.gif"><img class="alignnone size-full wp-image-3849" title="Banner-tutorial" src="http://www.maistrafego.pt/wp-content/uploads/2011/02/Banner-tutorial.gif" alt="" width="125" height="125" /></a></p>
<p>Posto isto está pronto a ser colocado num servidor e animar a campanhã que estão responsáveis.<br />
Espero que tenha sido útil para vocês. Se tiverem alguma dúvida não hesitem em colocar terei todo o gosto em ajudar-vos.</p>
<p><strong>Explorem, errem, melhorem e não desistam nunca.</strong></p>
<p>Artigo por: <a href="http://www.we-talk-about.com/" target="_blank">Ricardo Pereira</a></p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/banner-animado-em-photoshop/feed</wfw:commentRss>
		<slash:comments>17</slash:comments>
		</item>
		<item>
		<title>Um Bom Design Deixa-nos Felizes</title>
		<link>http://www.maistrafego.pt/um-bom-design-deixa-nos-felizes</link>
		<comments>http://www.maistrafego.pt/um-bom-design-deixa-nos-felizes#comments</comments>
		<pubDate>Fri, 14 Jan 2011 15:45:50 +0000</pubDate>
		<dc:creator>Wanderley</dc:creator>
				<category><![CDATA[Destaques]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[video]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=3534</guid>
		<description><![CDATA[A importância do design é, acho eu, inegável mas mesmo assim todos os dias nós vemos no fórum projectos que sistematicamente descuram este facto. E se eu vos dissesse que um bom design deixa os vossos utilizadores/leitores mais felizes? E se eu vos dissesse que contra toda a lógica vocês podem realizar uma modificação ao [...]]]></description>
			<content:encoded><![CDATA[<p><img class="size-full wp-image-3535 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2011/01/bom-design.jpg" alt="Beleza Design" width="560" height="260" /><br />
<strong>A  importância do design é, acho eu, inegável mas mesmo assim todos os dias  nós vemos no fórum projectos que sistematicamente descuram este facto. E  se eu vos dissesse que um bom design deixa os vossos  utilizadores/leitores mais felizes? E se eu vos dissesse que contra toda  a lógica vocês podem realizar uma modificação ao vosso website, não  porque ela se justifica mas apenas porque é mais divertida?</strong></p>
<p>Eu sou  (como muitos já devem saber) um apologista da usabilidade, mas sou  também um confesso apreciador da beleza artística do design. Não há  dúvidas que um bom design é aquele que respeita os princípios basilares  da usabilidade, mas para toda a regra existe uma excepção e o webmaster  moderno e independente pode e deve experimentar, mesmo que isso  signifique desviar-se um pouco do rumo habitual.</p>
<blockquote>
<p style="text-align: center;">&#8220;Decidi mudar X para Z porque é mais divertido assim!&#8221;</p>
</blockquote>
<p>À  partida esta é uma justificação absurda, mas dependendo do website em  questão ela pode fazer mais sentido do que a maioria de nós poderíamos  imaginar. Usabilidade e beleza podem andar de mãos dadas e em  determinadas alturas uma pode ser privilegiada em detrimento da outra,  foi a essa conclusão que chegou <strong>Donald Norman</strong> um dos grandes especialistas em usabilidade dos tempos modernos que tenta desvendar os segredos da mente do utilizador (<strong>vídeo no final do artigo</strong>).</p>
<blockquote>
<p style="text-align: center;">&#8220;Um bom design faz-nos felizes&#8221;</p>
</blockquote>
<p style="text-align: left;">O que é  importante compreendermos é que o utilizador reage emocionalmente  sempre que visita um website, que a beleza puramente estética é também  muito importante e finalmente que nós a podemos utilizar para &#8220;<strong>manipularmos</strong>&#8221; emocionalmente o utilizador. Sem exageros como é óbvio, quando refiro &#8220;<strong>manipulação</strong>&#8221; não é entrar na cabeça do visitante e plantar mensagens &#8220;<strong>inception-style</strong>&#8220;, mas é um facto de que todas as empresas neste mundo recorrem à beleza para tentarem colocar o utilizador na disposição ideal.<a href="http://www.jersonwanderley.com/wp-content/uploads/2011/01/Antonio-Vivaldi-Birthday-2010.gif"></a></p>
<p style="text-align: center;"><a rel="attachment wp-att-3536" href="http://www.maistrafego.pt/um-bom-design-deixa-nos-felizes/antonio-vivaldi-birthday-2010"><img class="size-full wp-image-3536 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2011/01/Antonio-Vivaldi-Birthday-2010.gif" alt="Google Aniversário Vivaldi" width="318" height="119" /></a></p>
<blockquote>
<p style="text-align: center;">&#8220;Vou mudar porque é mais bonito, vou mudar porque é mais divertido assim&#8221;</p>
</blockquote>
<p>A <strong>Google </strong>por exemplo não necessitava de transformar o seu logótipo desta forma espectacular para assinalar o aniversário do <strong>Vivaldi</strong>,  mas é muito mais divertido assim, é muito mais bonito! O utilizador  reage emocionalmente, fica feliz e receptivo a saber mais sobre o  compositor. Mas atenção, isto não significa que devemos colocar de parte  a usabilidade, até porque isso seria impensável, o que significa é que  nos devemos preocupar com a beleza estética e recorrer ao chamado design  emocional que basicamente significa criar algo tendo em conta as  emoções do utilizador.</p>
<blockquote>
<p style="text-align: center;">&#8220;Então um  website pode ser funcional, respeitar os princípios da usabilidade, mas  se for maçador e triste corre o risco de não comunicar tão bem?&#8221;</p>
</blockquote>
<p>No  geral eu diria que sim, até um website de uma funerária que por definição  não é um local muito alegre, pode valer-se de técnicas para tornar o  visitante &#8211; independentemente de tudo o que lhe aconteceu &#8211; um pouco  mais feliz, mesmo que seja apenas ao nível do subconsciente e isso meus  amigos é verdadeira inteligência no momento da criação.</p>
<p>Tudo isto para mostrar (a quem ainda não viu) uma palestra muito interessante do <strong>Donald Norman</strong> que explica um pouco esta &#8220;coisa&#8221; da beleza e das emoções e como a sua compreensão pode ser importante no design.</p>
<p><object width="580" height="345"><param name="movie" value="http://www.youtube.com/v/RlQEoJaLQRA?fs=1&amp;hl=pt_PT"></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/RlQEoJaLQRA?fs=1&amp;hl=pt_PT" type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="580" height="345"></embed></object></p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/um-bom-design-deixa-nos-felizes/feed</wfw:commentRss>
		<slash:comments>14</slash:comments>
		</item>
		<item>
		<title>Um Excelente Design Vale O Seu Peso Em Ouro?</title>
		<link>http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro</link>
		<comments>http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro#comments</comments>
		<pubDate>Mon, 01 Nov 2010 15:32:39 +0000</pubDate>
		<dc:creator>Wanderley</dc:creator>
				<category><![CDATA[Destaques]]></category>
		<category><![CDATA[escola]]></category>
		<category><![CDATA[Seo]]></category>
		<category><![CDATA[themes]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[webdevelopment]]></category>
		<category><![CDATA[avaliação]]></category>
		<category><![CDATA[design]]></category>
		<category><![CDATA[preço]]></category>
		<category><![CDATA[valor]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=2448</guid>
		<description><![CDATA[Eu já escrevi no passado que não existe desculpa para um mau design e fi-lo por diversas razões, mas principalmente porque o suporte hoje em dia no que diz respeito a design é gigantesco. Isto significa que mesmo sem grandes conhecimentos nesta área, é possível criar um website com um bom aspecto e que se [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center"><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/10/design.jpg"></a><a rel="attachment wp-att-2449" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-1"><img class="alignnone size-full wp-image-2449" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-1.jpg" alt="Design" width="560" height="235" /></a></p>
<p style="text-align: justify">Eu já escrevi no passado que não existe desculpa para um mau design e fi-lo por diversas razões, mas principalmente porque o suporte hoje em dia no que diz respeito a design é gigantesco. Isto significa que mesmo sem grandes conhecimentos nesta área, é possível criar um website com um bom aspecto e que se enquadre dentro dos parâmetros de qualidade do design moderno. Mas esta facilidade de acesso ao que eu estou aqui a chamar de &#8220;<strong>bom design</strong>&#8221; acabou por deixar uma questão muito importante no ar e que tem incomodado webdesigners um pouco por todo o mundo: <strong>Será que um excelente design vale o seu peso em ouro?</strong> <strong>Será que vale a pena pagarmos balúrdios por um trabalho de design?</strong></p>
<p style="text-align: justify">Com os clubes de temas como a <strong>ThemeForest</strong> a terem um sucesso estrondoso e a serem cada vez mais utilizados, são menos os colegas que recorrem aos webdesigners para a criação de visuais atractivos para os seus websites. <strong>Verdade seja dita, se por cerca de 40 euros é possível comprar uma theme com uma qualidade de design razoável, então para quê gastar centenas ou milhares com um webdesigner?</strong></p>
<p style="text-align: justify">É claro que eu comecei este artigo com uma abordagem simplista, e nesta abordagem parece que o trabalho do webdesigner tornou-se de certa forma obsoleto, ou seja, parece que já não precisamos de recorrer a estes serviços.</p>
<h3 style="text-align: center"><strong>Será verdade? </strong></h3>
<p><strong><br />
</strong></p>
<p style="text-align: justify"><strong>Eu acredito que não</strong>, acho que esta questão é de facto pertinente e muito interessante, mas a <strong>resposta </strong>vai depender da forma como olhamos para o mercado e acima de tudo, ela <strong>irá depender dos nossos próprios objectivos</strong>. A realidade é que o trabalho de um webdesigner nunca se vai tornar obsoleto, <strong>porque ele é</strong> tal como o pintor ou como o músico,<strong> um artista</strong>. E caros colegas, o trabalho de um artista muito dificilmente se torna obsoleto, porque ele possui uma característica que combate isso mesmo, <strong>a unicidade</strong>.</p>
<p style="text-align: justify">Durante os últimos anos, alguns webdesigners têm revelado publicamente o seu descontentamento para a forma como anda o mercado. Uns queixam-se da concorrência desleal de pseudo-profissionais que afastam os potenciais clientes de um trabalho bem feito, outros lamentam o facto da maior parte dos clientes ainda não conseguir compreender a importância que tem o seu trabalho.</p>
<p style="text-align: justify">O mercado de hoje encontra-se numa fase de evolução interessante, por um lado eu não tenho qualquer dúvida que o trabalho do webdesigner pode ser muito valioso, pelo outro também é verdade que é fácil para o webmaster que pouco ou nada percebe de webdesign, construir um projecto relativamente sólido nesse aspecto.</p>
<p style="text-align: justify">Mas depois da introdução a questão ainda continua por responder. <strong>Será que um excelente design é assim tão valioso? Será um absurdo pagar centenas, milhares, ou centenas de milhares pelo trabalho de webdesign?</strong></p>
<h3 style="text-align: justify"><strong>1º- Sim, O Design É Importante</strong></h3>
<p><strong><br />
</strong></p>
<p style="text-align: justify">Já chegou a altura de todos os webmasters compreenderem que <strong>o design é de facto importante</strong>. Em &#8220;<strong><a href="http://www.maistrafego.pt/conteudo-vs-design">Conteúdo VS Design</a></strong>&#8221; eu tentei deixar isso bem claro, nós precisamos de compreender que <strong>o design pode e deve fazer parte de uma estratégia de comunicação</strong>. A boa notícia é que hoje em dia muitos webmasters já começam a perceber que que é preciso investir nesta área, o que não significa que todos os websites devem ser autênticas &#8220;<strong>obras primas</strong>&#8220;, significa sim que é um dos elementos importantes no acto de comunicação com os visitantes e seguramente que no primeiro impacto pode ser fundamental.</p>
<p style="text-align: center"><strong>&#8220;O bom design (&#8230;) tem de ser  uma &#8220;arma&#8221; de comunicação extremamente eficaz entre o site e o público  alvo&#8230;&#8221; <a title="Posts de Carlos Gandra" href="http://www.maistrafego.pt/author/ac99/">(Carlos Gandra)</a></strong></p>
<p style="text-align: justify">A frase de cima resume bem a importância que tem o design nos websites modernos, eu vou um pouco mais longe e acrescento que sempre foi assim, mesmo antes de existir Internet já se percebia que o design podia de facto ser uma &#8220;<strong>arma</strong>&#8221; muito poderosa:</p>
<p style="text-align: center"><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/10/propaganda-nazi.jpg"></a><a rel="attachment wp-att-2450" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-2"><img class="alignnone size-full wp-image-2450" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-2.jpg" alt="Propaganda Nazi" width="481" height="688" /></a></p>
<p style="text-align: center"><strong>Fonte Da Imagem: <a href="http://www.ilord.com/">ilord</a></strong></p>
<p style="text-align: justify">Nos tempos da <strong>Segunda Guerra Mundial</strong> por exemplo, nos inúmeros folhetos espalhados quer pelos nazis quer pelas forças aliadas, já se notava uma grande preocupação com o design que era utilizado para transmitir a mensagem com maior eficácia. Isto não é nenhum segredo, por esta altura acho que todos os webmasters que estão a ler o artigo já dizem: &#8220;</p>
<blockquote>
<p style="text-align: center"><strong>&#8220;Ohhh sim, que grande novidade nos estás a dar!!&#8221;</strong></p>
</blockquote>
<p style="text-align: justify">Eu sei que me estou a repetir e sei que muitos colegas meus já disseram o mesmo, mas quando analisamos novos projectos que são apresentados todas as semanas no <a href="http://forum.maistrafego.pt/"><strong>fórum</strong></a>, parece que andamos a falar para o boneco. Nós ainda temos uma tendência para ignorar um pouco o design, isso acontece porque se costuma repetir por aí muito que &#8220;<strong>Content Is King</strong>&#8220;, uma frase que faz todo o sentido mas à qual não devemos acrescentar &#8220;<strong>and the rest isn&#8217;t anything</strong>&#8221; porque é um erro tremendo. O conteúdo é importante, mas o &#8220;<strong>pacote</strong>&#8221; também:</p>
<p style="text-align: center"><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/10/chocolate.jpg"></a><a rel="attachment wp-att-2457" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-3"><img class="alignnone size-full wp-image-2457" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-3.jpg" alt="Chocolate" width="560" height="376" /></a><br />
<span style="color: #000000"> </span></p>
<p style="text-align: center"><strong><span style="color: #000000">Fonte Da Imagem: <a href="http://www.flickr.com/photos/davidchief/3937482124">davidChief</a></span></strong></p>
<p style="text-align: justify">Um bom exemplo é o dos produtos alimentares, será que nós olhamos para um chocolate e julgamos que somos apenas atraídos pelo que está no interior da embalagem? É claro que se já estivermos fidelizados o design e impacto da apresentação visual não será tão determinante, mas e para quem nunca experimentou? É exactamente assim que devemos olhar para o nosso website, são só <strong>pensando nos utilizadores que já o visitam frequentemente mas pensando também naqueles que o visitam pela primeira vez</strong>:</p>
<p style="text-align: justify"><a href="http://www.barleysgville.com/"></a><a href="http://www.barleysgville.com/"><img class="size-full wp-image-2458 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-4.jpg" alt="Barley's Greenville" width="550" height="342" /></a></p>
<p style="text-align: justify">Na imagem de cima podemos ver que para o restaurante <a href="http://www.barleysgville.com/"><strong>Barley&#8217;s Greenville</strong></a>, uma boa comunicação com um novo visitante é muito importante. <strong>E porque não aproveitar até mesmo um website de um restaurante para comunicar?</strong> Isto é a prova de que até os pequenos negócios não só querem uma presença na <strong>Internet</strong>, como querem que ela seja eficaz.</p>
<p style="text-align: justify">Agora que já estabelecemos que o design é importante (mais uma vez, até me canso de repetir isto) já podemos adicionar um elemento de peso na construção da resposta à pergunta que faz o título deste artigo. Continuemos então para o segundo ponto.</p>
<h3 style="text-align: justify"><strong>2º- Um Bom Design Com Poucos Recursos</strong></h3>
<p><strong><br />
</strong></p>
<p style="text-align: center"><strong><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/10/exemplo.png"></a><a rel="attachment wp-att-2459" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-5"><img class="alignnone size-full wp-image-2459" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-5.png" alt="Tema WordPress" width="590" height="300" /></a><br />
</strong></p>
<p style="text-align: center"><strong>Imagem De Tema Premium Para WordPress: <a href="http://themeforest.net/item/time-for-food-for-wordpress/60079">Time For Food</a></strong><strong><br />
</strong></p>
<p style="text-align: justify">Nesta fase tu já sabes que o design é um elemento muito importante do teu projecto online, isto significa que parte do teu tempo vai ser perdido no sentido de conseguires encontrar o visual que melhor se adapta às necessidades dele. Aqui tens várias alternativas:</p>
<ul style="text-align: justify">
<li><strong>a) És um webdesigner com capacidade e skills suficientes para criares o teu próprio design;</strong></li>
</ul>
<p style="text-align: justify">Neste primeiro caso, parte do problema está resolvido, se és um webdesigner então basta muita investigação, questionar os leitores, realizar testes que mais cedo ou mais tarde vais conseguir obter o visual que pretendes.</p>
<ul style="text-align: justify">
<li><strong>b) Não és um webdesigner mas podes investir;</strong></li>
</ul>
<p style="text-align: justify">Não percebes nada de webdesign mas estás numa posição em que podes investir. Neste caso  tarefa também é mais fácil, apenas precisas de encontrar um profissional com capacidade para realizar o trabalho.</p>
<ul style="text-align: justify">
<li><strong>c) Não és webdesigner e tens poucos recursos o que torna impossível grandes investimentos.</strong></li>
</ul>
<p style="text-align: justify">A boa notícia é que (tal como já escrevi na introdução)<strong> hoje em dia um webmaster sem grandes conhecimentos de webdesign e com poucos recursos, pode de facto criar um website com um  bom aspecto e que se enquadre dentro dos parâmetros de qualidade do  design moderno</strong>. A resposta está nas themes espalhadas por esta web fora.</p>
<p style="text-align: justify">Suponhamos que tu queres iniciar um projecto mas ainda és novato nestas andanças, vamos supor também que escolhes o <a href="http://pt.wordpress.org/"><strong>WordPress </strong></a>porque regra geral é o <strong>CMS </strong>mais recomendado para quem está a começar. Vais ter à tua disposição uma quantidade absurda de themes que podes aplicar no teu website literalmente com apenas alguns cliques. Essas themes podem ser grátis ou pagas, mas como neste artigo eu refiro-me apenas a um nível de qualidade a partir do razoável, vamos colocar as grátis de parte e concentrar as nossas atenções apenas nas pagas.</p>
<p style="text-align: justify">O que podes fazer é recorrer aos muito populares clubes de themes:</p>
<p style="text-align: center"><a href="http://themeforest.net/"></a><a href="http://themeforest.net/"><img class="alignnone size-full wp-image-2460" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-6.jpg" alt="" width="350" height="192" /></a></p>
<p style="text-align: justify">Um dos mais populares clubes é o <a href="http://themeforest.net/"><strong>ThemeForest</strong></a> que possui uma enorme quantidade de themes à venda, não só para <a href="http://pt.wordpress.org/"><strong>WordPress</strong></a><strong> </strong>mas também para outros <strong>CMS</strong>. Os preços variam e adequam-se a todas as carteiras, por alguns euros é possível colocar as mãos em themes que são efectivamente boas, por vezes até muito boas.</p>
<p style="text-align: center"><strong>&#8220;Não há desculpa para um mau design&#8221;</strong></p>
<p style="text-align: justify">É fácil de compreender que hoje existem muito poucas desculpas que justifiquem um mau design, o que não significam que existam excepções sobre a qual vou escrever um pouco mais à frente, mas a verdade é que com tantas themes por aí é difícil criarmos um projecto e não lhe conseguirmos dar uma aparência decente, será preciso muita displicência para que isso aconteça.</p>
<p style="text-align: justify">Mas vamos agora voltar ao título para realizarmos uma última distinção e fechar este ponto:</p>
<ul>
<li><strong>1º- Ficou estabelecido que os clubes de temas podem ser uma ajuda preciosa principalmente para o webmaster que pouco ou nada percebe de webdesign;</strong></li>
</ul>
<ul>
<li><strong>2º- Ficou estabelecido que estes clubes por vezes possuem themes de grande qualidade.</strong></li>
</ul>
<p style="text-align: center">Mas apesar das vantagens dos clubes de temas, existem também desvantagens:</p>
<p style="text-align: center"><strong>&#8220;Algo que eu tenho reparado(&#8230;) é que os themes mais recentes que se podem ver por exemplo  na ThemeForest, são uma repetição, mais do mesmo, sem nada de novo e  tudo dentro do mesmo estilo, é tudo feito para um determinado mercado  (corporate, themes tão profissionais que se tornam feios e sem brilho) e  os outros (magazine style, etc) ficaram de lado.&#8221;(</strong><strong><a title="Posts de Carlos Gandra" href="http://www.maistrafego.pt/author/ac99/">Carlos Gandra</a>)</strong></p>
<p style="text-align: center"><strong><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/10/temas.jpg"></a><a rel="attachment wp-att-2461" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-7"><img class="size-full wp-image-2461 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-7.jpg" alt="Temas" width="560" height="220" /></a><br />
</strong><strong> </strong><strong>&#8220;A questão dos themes, tem mais a ver com a evolução dos designers.  Começam a construir as suas próprias frameworks, ou a agarrar nas  disponíveis e depois é fazer produtos. Ou seja, mudam o layout, fazem  uma variação para corporate outra para portefólio e está feito. O layout  em si é sempre o mesmo&#8221; (<a href="http://www.maistrafego.pt/author/admin">Nuno</a>)</strong></p>
<p style="text-align: justify">Se dermos uma olhadela rápida para os <strong>clubes de temas</strong> vamos perceber que existe um <strong>problema óbvio de repetição de designs e conceitos</strong>. Existem variações, umas mais inteligentes do que outras, mas de facto os layouts parecem sempre os mesmos. Por alguma razão os preços são baixos não é verdade?  <strong>Há uma limitação óbvia quando escolhemos um design já existente para um projecto, porque ele não foi especificamente projectado para o nosso website.</strong></p>
<p style="text-align: justify"><strong>Pergunta:</strong> Se pode funcionar?</p>
<p style="text-align: justify"><strong>Resposta:</strong> É claro que pode.</p>
<p style="text-align: justify"><strong>Pergunta:</strong> Se funciona melhor do que um design exclusivo?</p>
<p style="text-align: justify"><strong>Reposta:</strong> Não, nunca poderá funcionar melhor.</p>
<p style="text-align: justify">Posto isto, não há dúvidas que os clubes de temas são uma excelente alternativa sobretudo quando não existem muitos recursos nem dinheiro para investir. Não tenham dúvidas que no <strong><a href="http://forum.maistrafego.pt/">fórum</a></strong> nós somos os primeiros a recomendar que os utilizem sempre que for necessário. Mas <strong>não podemos comparar estes designs acessíveis a todos, com um design exclusivo que foi metodicamente pensado para se encaixar na perfeição com um determinado projecto.</strong></p>
<h3 style="text-align: justify"><strong>3º- Um Mau Design pode ser um Bom Design?</strong></h3>
<p><strong><br />
</strong></p>
<p style="text-align: justify">Ao tentarmos descobrir se a obtenção de um excelente design vale a utilização de muitos recursos e grandes investimentos, vamos sempre &#8220;<strong>chocar</strong>&#8221; com uma realidade incontornável, existem websites com designs aparentemente básicos, mas que têm um sucesso enorme.</p>
<h4 style="text-align: center"><strong>CraigList &#8220;Keep It Simple&#8221;</strong></h4>
<p style="text-align: center"><a href="http://lisbon.pt.craigslist.pt/"></a><a href="http://lisbon.pt.craigslist.pt/"><img class="alignnone size-full wp-image-2462" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-8.jpg" alt="" width="560" height="318" /></a></p>
<p style="text-align: justify"><a href="http://lisbon.pt.craigslist.pt/"><strong>Craiglist</strong></a> é um exemplo perfeito, o design é simples, pode ser considerado feio e de certeza que está ao alcance de qualquer um. Mas nós como webmasters que somos, temos que olhar para a &#8220;<strong>big picture</strong>&#8220;:</p>
<ul>
<li><strong>1º &#8211; É importante relembrar que um bom design não significa ter o visual mais espectacular do mundo;</strong></li>
</ul>
<ul>
<li><strong>2º- Existem websites que podem ter designs simples;</strong></li>
</ul>
<ul>
<li><strong>3º- Não podemos confundir simplicidade com um mau design;</strong></li>
</ul>
<p style="text-align: justify">Nós podemos dizer que o <strong>Craiglist </strong>não é o website em termos de design mais potente que anda por aí, mas a realidade é que para o que se propõe ele não necessita de grandes floreados. Isto não significa que o website não tenha falhas, porque ele tem e não são poucas, mas <strong>na sua missão de satisfazer o melhor possível as necessidades dos clientes, ele faz um bom trabalho</strong>. É simples, rápido e não nos faz perder tempo de forma desnecessária, se de um momento para o outro nós transformássemos o design do website para algo muito actual, cheio de funcionalidades e bonito de se ver, talvez os utilizadores não ficassem satisfeitos, especialmente se em vez de perderem um segundo a realizar uma tarefa, começassem a perder cinco.</p>
<ul>
<li><strong>Mas a Craiglist é um exemplo de que o design não é importante?</strong></li>
</ul>
<p style="text-align: justify">Eu não iria tão longe, tal como em todos os websites o design é importante, não foi por acaso que mencionei em cima que se ele fosse totalmente transformado os utilizadores poderiam não ficar satisfeitos, logo <strong>o design é fundamental na interacção com com o utilizador</strong>, quanto mais não seja porque contribui em grande para agilizar os processos.</p>
<ul>
<li><strong>Mas a Craiglist podia ser melhor?</strong></li>
</ul>
<p style="text-align: justify">É claro que sim, podia ser muito melhor.</p>
<ul>
<li><strong>Então porque não é melhor?</strong></li>
</ul>
<p style="text-align: justify">No mundo do webmastering curiosamente a expressão &#8220;<strong>em equipa que ganha não se mexe</strong>&#8221; é importante e alguns profissionais levam-na muito a sério. O website da Craiglist funciona bastante bem, apesar de ser básico, apesar de alguns problemas, os clientes estão consideravelmente satisfeitos e enquanto essa satisfação se mantiver em níveis elevados, não existe assim tanta necessidade de modificações.</p>
<ul>
<li><strong>Então um design simples e barato funciona?</strong></li>
</ul>
<p style="text-align: justify">Esta é uma pergunta difícil de responder, se eu disser que não, vocês colocam milhões de exemplos de que funciona, se eu disser que sim vão rapidamente presumir que não vale a pena investir no design. A resposta é:</p>
<h3 style="text-align: center"><strong>Sim e não.</strong></h3>
<p style="text-align: justify"><strong>E que tal, agora consegui proteger todos os lados não? (:</strong></p>
<p style="text-align: justify">Parece mentira mas não é. De facto todos sabemos que <strong>um design simples e barato pode funcionar</strong> e nesta medida a resposta é sim, mas ela não fica por aqui. Como eu já referi em cima, é <strong>óbvio que um website relativamente simples pode sobreviver e ter sucesso com um design básico, mas não podemos esperar que o mesmo aconteça em projectos mais complexos.</strong></p>
<p style="text-align: justify">É verdade que ainda existem muito projectos, alguns até bem complexos que não possuem designs à altura e têm sucesso. Isto acontece porque nós vivemos numa fase que eu gosto de chamar de &#8220;<strong>transição</strong>&#8220;, ou seja, <strong>por um lado o utilizador comum começa a despertar e a dar importância ao design, pelo outro ele ainda deixa passar um mau design caso o website cumpra relativamente bem a sua função.</strong></p>
<ul>
<li><strong>Então o que fazer?</strong></li>
</ul>
<p style="text-align: justify">Eu acredito que <strong>nós devemos dar mais importância ao design</strong>, os webmasters que não lhe ligavam muito devem repensar a sua estratégia e aqueles que já lhe davam atenção devem continuar a pensar em melhorar. Se reparem <strong>nos últimos tempos, muitos websites têm trabalhado a sua imagem</strong>: <strong>Google</strong>, <strong>Youtube</strong>, <strong>Sapo</strong>, <strong>CNN</strong>, <strong>Digg </strong>sabemos que o <strong>MySpace </strong>surgiu também com um novo design e são muitos mais os websites que se adaptam a estes novos tempos.</p>
<h3 style="text-align: justify"><strong>4º- O que Define Um Excelente Design</strong></h3>
<p><strong><br />
</strong></p>
<p style="text-align: justify">Começamos agora a entrar num dos pontos mais importantes de toda esta abordagem, a velha questão do que é de facto um excelente design. Sempre que tenho uma discussão sobre design com alguns colegas, geralmente ela dissipa-se nas opiniões de cada um e há o hábito de se dizer:</p>
<p style="text-align: center"><strong>&#8220;Um bom design para mim pode não ser um bom design para ti&#8221;</strong></p>
<p style="text-align: justify">Esta afirmação não está no entanto totalmente correcta, é verdade que realmente o nosso conceito de beleza varia e isso é um facto, mas <strong>um excelente design (e volto mais uma vez a repetir-me) não está apenas relacionado apenas com a beleza estética</strong>, existem outros factores bem mais importantes.</p>
<p style="text-align: center"><strong>&#8220;Um bom design deve ser simples, marcar no primeiro impacto, satisfazer   requisitos do site e do utilizador e deixar um carimbo mental que não   permita o esquecimento.&#8221; (<a href="http://forum.maistrafego.pt/index.php?action=profile;u=3307">José Oliveira</a>)</strong></p>
<p style="text-align: justify">O <strong>José Oliveira</strong> resumiu numa frase basicamente os desejos de um webmaster no que diz respeito ao design, ou pelo menos os desejos de um webmaster que se preocupa com o design. Ele quer algo capaz de causar impacto, capaz de satisfazer as necessidades do utilizador e faz uma referência ao tal &#8220;<strong>Carimbo Mental</strong>&#8221; algo que só é possível recorrendo a técnicas específicas.</p>
<p style="text-align: center"><a href="http://www.youtube.com/"></a><a href="http://www.youtube.com/"><img class="alignnone size-full wp-image-2463" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-9.jpg" alt="Youtube" width="560" height="360" /></a></p>
<p style="text-align: justify">
<p style="text-align: justify">Agora tendo como referência às palavras do José, vamos olhar para o <a href="http://www.youtube.com/"><strong>Youtube </strong></a>que festejou há dias <strong><a href="http://youtube-global.blogspot.com/2010/10/1-billion-subscriptions-and-counting.html">o 1 bilião de subscritores</a></strong>. <strong>Não é engraçado ele ser literalmente aquilo que foi mencionado?</strong> Ele é simples, causa um bom primeiro impacto e tão cedo nós não nos esquecemos dele. Foram algumas destas qualidades que o tornaram no maior website de vídeos de todo o mundo e as suas recentes alterações ao design reforçam isso mesmo.</p>
<p style="text-align: center"><strong>&#8220;Uma questão importante no design é sua optimização, um site bem   construído é bom, se for bem construído e bem optimizado melhor!   Optimização falo em standards, acessibilidade, usabilidade e seo.&#8221;</strong><strong>(<strong><a href="http://www.maistrafego.pt/author/admin">Nuno)</a></strong></strong></p>
<p style="text-align: justify">O <strong>Nuno </strong>aprofundou um pouco mais a questão e realçou um aspecto fundamental, que mais uma vez vai além da simples beleza estética, <strong>a optimização</strong>. Um excelente design precisa de cumprir muitos requisitos para ser apelidado de &#8220;<strong>excelente</strong>&#8221; e estar devidamente optimizado é muito importante:</p>
<p style="text-align: justify"><strong>1º- Um excelente website deve estar devidamente preparado para SEO;</strong></p>
<p style="text-align: justify">O quão importante é o SEO hoje em dia, alguns webmasters talvez defendam que é o mais importante. Um excelente design precisa de estar preparado para SEO porque será uma ajuda preciosa.</p>
<p style="text-align: justify"><strong>2º- Um excelente website deve ser criado de acordo com os standards;</strong></p>
<ul>
<li>2.1 &#8211; O website usa o Doctype adequado e segue o respectivo standard W3C?</li>
<li>2.2 &#8211; O website usa CSS válido?</li>
<li>2.3 &#8211; o código está bem estruturado?</li>
</ul>
<p><strong>e por aí fora&#8230;</strong></p>
<p style="text-align: justify"><strong>3º- Um excelente website deve respeitar os princípios basilares da usabilidade e acessibilidade e até utilizá-los em seu proveito;</strong></p>
<ul>
<li>3.1 &#8211; Sabias por exemplo que os headings em HTML ( exemp. &lt;h1&gt;)  podem ser extremamente úteis para utilizadores cegos?</li>
<li>3.2 &#8211; Sabias que é um erro utilizar qualquer tipo de conteúdo que pisque ou tenha mudanças de cor mais de três vezes por segundo?</li>
<li>3.3 &#8211; Sabias que nunca deves permitir que um utilizador complete uma tarefa importante sem confirmação ou sem lhe dar a possibilidade de voltar atrás?</li>
<li>3.4 &#8211; Sabias que a melhor cor para os links é o azul?</li>
<li>3.5 &#8211; Sabias que as áreas de clique não devem ser minúsculas?</li>
</ul>
<p><strong>e por aí fora&#8230;</strong></p>
<p>Estes são apenas alguns dos factores a termos em conta quando tentamos perceber o que define um excelente design.<strong> </strong></p>
<p style="text-align: center"><strong>&#8220;Um excelente design além de ter de ser limpo e apelativo aos olhos,   deverá ser standardizado (W3C, etc) e optimizado para os motores de   busca (SEO)&#8221; (<a href="http://forum.maistrafego.pt/index.php?action=profile;u=403">Asturmas</a>)</strong></p>
<p style="text-align: center"><strong><a rel="attachment wp-att-2464" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-10"><img class="alignnone size-full wp-image-2464" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-10.jpg" alt="SAPO" width="560" height="316" /></a><br />
</strong></p>
<p style="text-align: justify">Se olharmos para o recente redesign do <a href="http://www.sapo.pt" target="_blank"><strong>Sapo</strong></a>, vamos reparar que houve cuidado na parte estética, mas também grande trabalho em aspectos como a usabilidade e acessibilidade. Ele foi simplificado, o utilizador processa agora a informação com mais facilidade, não foi um redesign drástico, mas foi o redesign certo que melhorou consideravelmente a eficácia comunicativa do portal.</p>
<p style="text-align: center"><a href="http://www.whitehouse.gov/"></a><a rel="attachment wp-att-2465" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-11"><img class="alignnone size-full wp-image-2465" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-11.jpg" alt="Casa Branca" width="555" height="534" /></a></p>
<p style="text-align: justify">O website da <a href="http://www.whitehouse.gov/"><strong>Casa Branca</strong></a> levou no ano passado um redesign também todo ele focado na usabilidade e acessibilidade, foi utilizado muito espaço branco, o website não só ficou mais simples como mais bonito e fácil de compreender. Isto significa uma coisa: <strong>maior preocupação com a qualidade da experiência do utilizador.</strong></p>
<p style="text-align: center"><strong>&#8220;Um bom design será aquele que leva o cliente a devorar a informação  presente com mais vontade ainda. O design deve acompanhar a qualidade do  conteúdo, dar-lhe um toque bonito e fazer com que a imagem seja um  complemento ao conteúdo. &#8221; (<a href="http://forum.maistrafego.pt/index.php?action=profile;u=4681">Ana Martelo</a>)</strong></p>
<p style="text-align: center"><a href="http://www.visual-fusion.com/"></a><a rel="attachment wp-att-2466" href="http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/imagem-12"><img class="alignnone size-full wp-image-2466" src="http://www.maistrafego.pt/wp-content/uploads/2010/10/Imagem-12.jpg" alt="Visual Fusion" width="560" height="358" /></a></p>
<p style="text-align: justify">
<p style="text-align: justify">A <a href="http://www.visual-fusion.com/"><strong>Visual Fusion</strong></a> apresentou recentemente o seu novo design no <strong><a href="http://forum.maistrafego.pt/">fórum</a></strong>. Há claramente uma adaptação aos novos tempos, uma preocupação em fornecer ao visitante  informação relevante assim que ele entra, algo fundamental para websites de <strong>Service Providers</strong>. Eu destaco principalmente o trabalho &#8220;<strong>above the fold</strong>&#8221; que está &#8220;<strong>on the spot</strong>&#8221; e que contribui muito para o sucesso do processo de comunicação e melhoria da experiência de navegação.</p>
<p style="text-align: justify">Como foi possível percebermos, existe um grande número de factores que definem o que nós podemos chamar de &#8220;<strong>Excelente Design</strong>&#8220;. Primeiro necessitamos de analisar a parte técnica, pois ter um website bonito mas pouco funcional e mau programado é uma péssima ideia. Depois da parte técnica é altura então de percebermos se ele cumpre o seu papel: <strong>se causa um bom primeiro impacto</strong>; <strong>se é uma &#8220;arma&#8221; de comunicação eficaz</strong>; <strong>se deixa o tal &#8220;Carimbo Mental&#8221; nos utilizadores</strong>; <strong>se é limpo e apelativo ao olhar</strong>; <strong>se leva o utilizador a devorar a informação ainda com mais vontade</strong>; <strong>se acompanha a qualidade do conteúdo; se contribui positivamente para o processo comunicativo, se ajuda a melhorar a experiência de navegação do utilizador e claro, se esteticamente é bonito. </strong></p>
<h3 style="text-align: justify"><strong>5º- Um Excelente Design Vale O Seu Peso Em Ouro?</strong></h3>
<p><strong><br />
</strong></p>
<p style="text-align: justify">Finalmente chegamos ao último ponto e ainda bem porque eu já estou farto de escrever. Optei por acabar este artigo com a resposta à questão colocada e de acordo com todos os dados que temos, só pode existir uma resposta: <strong>SIM!</strong></p>
<p style="text-align: justify">A realidade meus amigos é que um excelente design até pode não ter preço. Eu sei que por vezes nós ficamos surpreendidos com os preços absurdos pagos por determinados designs, que fique claro que eu não me estou a referir a esses. Falo sim de trabalhos de design que cumprem todos os requisitos que foram mencionados neste artigo.</p>
<p style="text-align: justify">Um excelente design pode <strong>garantir mais visitas</strong>; <strong>mais vendas</strong>; <strong>mais leitores fidelizados</strong>; <strong>mais credibilidade</strong>; <strong>mais compreensão por parte dos utilizadores</strong> e mais e mais e mais&#8230;</p>
<p style="text-align: justify"><strong>Se é fácil criar um design excelente?</strong> É claro que não, envolve muito trabalho, muita investigação e mesmo depois de finalizado ainda se está longe da perfeição. O que o webmaster precisa de compreender é que um excelente design não vale meia dúzia de tostões, existem casos de redesigns que fizeram empresas ganhar milhares ou até milhões. Também não nos podemos esquecer que quando um webdesigner cria um design do nada, nós também estamos a pagar pelo valor do seu trabalho artístico.</p>
<h3 style="text-align: justify">Resumo:</h3>
<ul>
<li><strong>1º- O trabalho de um webdesigner nunca se vai tornar obsoleto, porque ele é um artista capaz de criar trabalhos únicos;</strong></li>
</ul>
<ul>
<li><strong>2º- O design pode e deve fazer parte de uma estratégia de comunicação;</strong></li>
</ul>
<ul>
<li><strong>3º- Hoje em dia sem grandes conhecimentos é possível ter um bom website;</strong></li>
</ul>
<ul>
<li><strong>4º- Não há desculpa para um mau design, afinal existem os clubes de temas;</strong></li>
</ul>
<ul>
<li><strong>5º- Os clubes de temas são uma boa alternativa para quem tem poucos recursos;</strong></li>
</ul>
<ul>
<li><strong>6º- Os clubes de temas possuem designs muito bons, mas sofrem de um problema de repetição e todos têm acesso a eles;</strong></li>
</ul>
<ul>
<li><strong>7º- Não podemos comparar estes designs acessíveis a todos com um  design exclusivo que foi metodicamente pensado para se encaixar na  perfeição com um determinado projecto;</strong></li>
</ul>
<ul>
<li><strong>8º- Existem websites com designs básicos e que têm um sucesso enorme;</strong></li>
</ul>
<ul>
<li><strong>9º- É importante relembrar que um bom design não significa ter o visual mais espectacular do mundo;</strong></li>
</ul>
<ul>
<li><strong>10º-  Existem websites que podem ter designs simples;</strong></li>
</ul>
<ul>
<li><strong>11º- Não podemos confundir simplicidade com um mau design;</strong></li>
</ul>
<ul>
<li><strong>12º- Um website relativamente simples pode sobreviver e ter sucesso  com um design básico, mas não podemos esperar que o mesmo aconteça em  projectos mais complexos.</strong></li>
</ul>
<ul>
<li><strong>13º- Nós devemos, à semelhança do que muitos websites têm feito ultimamente, dar mais importância ao design;</strong></li>
</ul>
<ul>
<li><strong>14º- Um excelente design (e volto mais uma vez a repetir-me) não está apenas relacionado apenas com a beleza estética;</strong></li>
</ul>
<ul>
<li><strong>15º- Um excelente design tem de estar optimizado;</strong></li>
</ul>
<ul>
<li><strong>16º- Um excelente design vale sem dúvida o seu preço e pode fazer maravilhas.<br />
</strong></li>
</ul>
<h3 style="text-align: justify"><strong>Conclusão:</strong></h3>
<p style="text-align: justify">Um grande trabalho de design vale ouro, ao contrário do que se pode pensar por vezes um website muito simples pode  ter sido planeado ao pormenor. Conseguir comunicar com os visitantes enquanto ao mesmo tempo os deixamos satisfeitos e não os obrigamos a pensar, é uma tarefa extremamente complicada. Com pouco dinheiro o webmaster já se pode refugiar nos clubes de temas e conseguir um bom design, mas quando precisamos de algo mais específico, então recorrer a um webdesigner deve ser o próximo passo.</p>
<p style="text-align: justify">Mas cuidado, existem poucos webdesigners verdadeiramente completos por aí, muitos não têm noções sólidas de programação (algo que hoje em dia é necessário), outros não têm conhecimentos suficientes sobre usabilidade e acessibilidade. É importante trabalhar com os profissionais certos, não nos podemos deixar iludir apenas pelos preços, até porque a minha mãe sempre me ensinou que o barato sai caro.</p>
<p style="text-align: justify">Não me interpretem mal, o conteúdo continua a ser rei, mas &#8211; como eu já disse tantas vezes &#8211; o utilizador está a evoluir e os nossos websites devem acompanhar essa evolução. Não é uma tarefa fácil, mas nós temos de continuar a tentar e se amanhã o nosso website for melhor do que hoje, então estamos definitivamente no bom caminho&#8230;</p>
<p style="text-align: justify">Até à próxima</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/um-excelente-design-vale-o-seu-peso-em-ouro/feed</wfw:commentRss>
		<slash:comments>32</slash:comments>
		</item>
		<item>
		<title>Venha Daí O Scroll!</title>
		<link>http://www.maistrafego.pt/venha-dai-o-scroll</link>
		<comments>http://www.maistrafego.pt/venha-dai-o-scroll#comments</comments>
		<pubDate>Sat, 18 Sep 2010 16:57:19 +0000</pubDate>
		<dc:creator>Wanderley</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[Destaques]]></category>
		<category><![CDATA[escola]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[dicas]]></category>
		<category><![CDATA[fold]]></category>
		<category><![CDATA[importãncia]]></category>
		<category><![CDATA[scroll]]></category>
		<category><![CDATA[usabiliade]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=2295</guid>
		<description><![CDATA[Não há internauta digno desse nome nesta web que nunca tenha ouvido falar do &#8220;scroll&#8221;. É um termo muito popular e mesmo partindo do principio que um utilizador não saiba o que é, de certeza que após alguns minutos frente a um computador ele vai estar a fazê-lo. Hoje os ratos vêem convenientemente preparados para [...]]]></description>
			<content:encoded><![CDATA[<p style="text-align: center;"><img class="size-full wp-image-2302  aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/09/scroll1.jpg" alt="Scroll" width="560" height="234" /></p>
<p style="text-align: justify;"><strong>Não há internauta digno desse nome nesta web que nunca tenha ouvido falar do &#8220;scroll&#8221;. É um termo muito popular e mesmo partindo do principio que um utilizador não saiba o que é, de certeza que após alguns minutos frente a um computador ele vai estar a fazê-lo. Hoje os ratos vêem convenientemente preparados para que nós possamos realizar o &#8220;scroll&#8221; com facilidade, é um acto que faz parte da experiência de navegação e também representa na perfeição aquilo que um internauta é na sua essência, um explorador&#8230;</strong></p>
<p style="text-align: justify;">O acto de fazer scroll está profundamente enraizado no comportamento do internauta, ele é natural e nós que somos webmasters devemos reconhecer isso. Mesmo assim esta questão continua a ser muito debatida, com profissionais a terem receio de  colocarem os elementos &#8220;<strong>importantes</strong>&#8221; de um website &#8220;<strong>below the fold</strong>&#8221; porque acham que a maior parte dos utilizadores simplesmente não faz scroll.</p>
<h3 style="text-align: center;">&#8220;Mas esta relutância perante o scroll não acontece por acaso.&#8221;</h3>
<p style="text-align: justify;">
<p style="text-align: justify;">No <strong><a href="http://www.useit.com/prioritizing/">Prioritizing Web Usability</a></strong>, <strong>Jacob Nielsen</strong> concluiu que <strong>77%</strong> dos novos visitantes de um website não faziam scroll, por sua vez alguns profissionais começaram a realizar os seus estudos e imagens como a que se segue multiplicaram-se pela web:</p>
<p style="text-align: center;"><img class="size-full wp-image-2296 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/09/scroll-1.jpg" alt="A Dobra" width="460" height="304" /></p>
<p style="text-align: justify;">Imediatamente os webmasters apressaram-se a modificar as secções &#8220;<strong>above the fold</strong>&#8221; utilizando todo o tipo de técnicas (muitas vezes excessivas) para captar a atenção do utilizador assim que ele entra em contacto com o website. É claro que existe verdade em tudo isto, mas como qualquer outra estatística ou tendência nós devemos ter sempre algum cuidado na nossa análise, pois a realidade é que:</p>
<h4 style="text-align: center;">&#8220;A interacção bem sucedida de um utilizador com um website está dependente de inúmeros factores.&#8221;</h4>
<p style="text-align: justify;">A pergunta que devíamos ter feito no início era: &#8220;<strong>Porque razão uma percentagem dos novos visitantes não faz scroll?</strong>&#8221; e as respostas poderiam ser várias, mas de certeza que nenhuma delas seria: &#8220;<strong>Porque os novos visitantes não gostam de fazer scroll</strong>&#8221; porque isso é um erro colossal. Como eu já disse em cima, o internauta está super-familiarizado com o scroll, ele faz parte do seu processo de navegação e <strong>NUNCA </strong>vai deixar de ser feito apenas e somente porque o utilizador não gosta de o fazer. <strong>Atenção que eu escrevo isso reservando um espaço natural para as excepções.</strong></p>
<p style="text-align: justify;">A boa notícia é que o instinto natural dos webmasters estava parcialmente certo, a secção &#8220;<strong>above the fold</strong>&#8221; necessitava sem dúvida de mais trabalho e era uma das razões pela qual uma percentagem dos novos visitantes não fazia scroll, o problema é que não era a única. Ao darem demasiada atenção ao &#8220;above the fold&#8221; alguns webmasters negligenciaram as outras secções do website, ou seja, eles resolveram um problema e arranjaram outro, ou por outras palavras, <strong>não se prepararam para o scroll.</strong></p>
<h3 style="text-align: center;">&#8220;Venha Daí o Scroll&#8221;</h3>
<p style="text-align: justify;">Não é por acaso que o título deste artigo é &#8220;<strong>Venha Daí o Scroll</strong>&#8220;, porque todo ele se foca na importância desta acção, na sua utilidade e na necessidade de existir uma preparação para ela. Depois de uma introdução invulgarmente longa e pela qual peço desculpa, vou agora entrar na temática propriamente dita.</p>
<h3 style="text-align: justify;"><strong>1º- O Scroll é Natural<br />
</strong></h3>
<p style="text-align: justify;">O primeiro ponto está mais do que explicado na introdução. O <strong>scroll </strong>faz parte do processo de navegação, a maior parte dos utilizadores nem sequer pensam se gostam ou não de o fazer, eles simplesmente limitam-se a fazê-lo. Se pensarmos melhor, <strong>a própria acção faz parte da natureza exploradora do internauta</strong>.</p>
<p style="text-align: justify;">Como acção instintiva, o scroll é naturalmente muito importante e cabe ao webmaster agora compreendê-lo. Se poucos utilizadores fazem scroll num dos teus websites, então tu precisas de descobrir o que se passa em vez de o tentares combater, porque uma das regras importantes da usabilidade defende que <strong>não se deve lutar contra os instintos dos utilizadores.</strong></p>
<h3 style="text-align: center;">Mas existem excepções?</h3>
<p style="text-align: justify;">Sim, estaria a mentir se dissesse (ou neste caso escrevesse) que não. Porventura poderão existir situações em que contrariar o instinto do utilizador pode ser uma boa ideia, mas regra geral não costuma ser esse o caso.</p>
<h3 style="text-align: justify;"><strong>2º- Não Sobrevalorizes o &#8220;Above The Fold&#8221;</strong></h3>
<p style="text-align: justify;">Ultimamente muitos profissionais têm repetido a frase &#8220;<strong>Há Vida Depois Da Fold</strong>&#8221; (e tenham calma porque eu também já a vou utilizar hehehe) para reforçarem a ideia de que o website deve ser trabalhado como um todo. Como eu já expliquei um pouco na introdução, depois de toda a comoção gerada após a revelação de que uma grande percentagem de novos visitantes não faziam scroll, alguns webmasters deturparam um pouco a questão e sem questionarem, decidiram que se os utilizadores não faziam scroll então eles iriam colocar tudo o que é importante &#8220;above the fold&#8221;.</p>
<p style="text-align: justify;">Vamos lá então desmistificar este problema. A primeira coisa que devemos fazer, é <strong>identificar a principal razão pela qual o novo utilizador não faz scroll e sai do website</strong>. A resposta é bem mais simples do que se possa imaginar e eu até já escrevi sobre isso no meu blogue pessoal, chama-se &#8220;<strong>Eficácia Comunicativa</strong>&#8220;.</p>
<p style="text-align: justify;">Vamos completar agora a frase:</p>
<blockquote>
<p style="text-align: center;">&#8220;Uma grande percentagem de novos visitantes nem sequer chega a fazer scroll e sai dos websites, porque a grande maioria deles falha no processo de comunicação&#8221;</p>
</blockquote>
<p style="text-align: justify;">Foi aqui que a maior parte dos webmasters acertaram, muitos nem sequer estavam a pensar na eficácia comunicativa, mas eles perceberam que algo se passava e <strong>não conseguiam fazer chegar a mensagem ao visitante</strong>. A solução foi melhorarem as secções &#8220;above the fold&#8221; dos seus websites, porque afinal de contas essa é a secção que se vê primeiro.</p>
<p style="text-align: justify;">Mas depois surgiu um novo problema e foi por isso que eu afirmei na introdução que os webmasters estavam apenas parcialmente correctos. <strong>Eles preocuparam-se com o &#8220;above the fold&#8221; mas passaram a negligenciar o resto</strong>. Foi quase como se o scroll deixasse de importar, nós tínhamos websites muito eficazes above the fold e que comunicavam bem com os utilizadores, mas assim que o scroll começava era uma desilusão e querem saber a melhor: <strong>eles voltavam a sair.</strong></p>
<h3 style="text-align: center;">A Sobrevalorização Do &#8220;Above The Fold&#8221;</h3>
<p style="text-align: justify;">O webmaster meteu na cabeça que o scroll era prejudicial e começou a &#8220;<strong>lutar</strong>&#8221; contra ele. Sobrevalorizou claramente aquela secção, optou por colocar todos os elementos lá e trabalhou-a até à exaustão. Mais uma vez é importante repetir que eu reservo espaços para as excepções, por exemplo nós temos a gigante <strong>Google </strong>que recentemente com o seu <strong>Instant </strong>parece ter ido contra as regras do jogo, porém um &#8220;<strong>motor de busca</strong>&#8221; não se enquadra no tipo de websites de que estou a falar e assim sendo, o jogo é outro e as regras são bem diferentes.</p>
<p style="text-align: justify;">Mas continuando e agora indo directo ao assunto. <strong>Não devemos sobrevalorizar o &#8220;above the fold&#8221;, devemos reconhecer sim que ele é importante, mas não o podemos colocar à frente de outras secções igualmente importantes</strong> caso contrário podemos perder visitantes.</p>
<h3 style="text-align: justify;"><strong>3º- Construir Interesse</strong></h3>
<p style="text-align: justify;">Tal como eu escrevi no segundo ponto, nós não devemos exagerar na secção &#8220;<strong>above the fold</strong>&#8221; e negligenciar as outras, porque vamos estar a prejudicar a experiência do utilizador e perder na mesma visitantes. No primeiro ponto eu escrevi sobre a natureza exploradora do internauta, ou seja <strong>quando navegamos na web somos exploradores</strong> e é a nossa capacidade para compreender como essa exploração se processa que nos pode dar vantagens.</p>
<p style="text-align: justify;">Vamos a um exemplo:</p>
<h3 style="text-align: center;"><strong>Exemplo 1</strong></h3>
<p style="text-align: center;"><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/09/exemplo-1.jpg"></a><img class="size-full wp-image-2297 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/09/scroll-2.jpg" alt="Exemplo 1" width="244" height="315" /></p>
<p style="text-align: justify;">A primeira imagem é um exemplo do que não se deve fazer, ou seja, trabalha-se o &#8220;above the fold&#8221;, esquece-se as outras secções e imediatamente a exploração é prejudicada o que pode levar a uma perda de interesse e finalmente à desilusão. <strong>Um utilizador desiludido como é óbvio não volta a meter os &#8220;pés&#8221; no website</strong>. É isto que acontece quando não se está preparado para o scroll e apesar do &#8220;above the fold&#8221; fazer o seu trabalho, o website continua a perder visitantes. Agora vamos ao método correcto:</p>
<h3 style="text-align: center;"><strong>Exemplo 2</strong></h3>
<p style="text-align: center;"><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/09/exemplo-2.jpg"></a><img class="size-full wp-image-2298 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/09/scroll-3.jpg" alt="Exemplo 2" width="250" height="315" /></p>
<p style="text-align: justify;">O segundo exemplo demonstra o que acontece num website que está preparado para o scroll. Todas as secções funcionam e são utilizadas para <strong>construir interesse</strong>, por sua vez a mais valia (que eu chamei do tesouro) encontra-se depois da dobra (tenham em mente que a imagem é um exemplo e não devem ligar muito aos posicionamentos mas sim ao principio). Quando menciono o tesouro posso estar a falar por exemplo do conteúdo, ou de um conjunto de elementos que deixam o utilizador satisfeito. Neste caso <strong>a probabilidade de o visitante voltar é muito maior</strong>.</p>
<h3 style="text-align: center;">&#8220;Menos conteúdo above the fold encoraja a exploração&#8221; (<a href="http://www.cxpartners.co.uk/thoughts/the_myth_of_the_page_fold_evidence_from_user_testing.htm">cxpartners</a>)</h3>
<p style="text-align: justify;">Uma das conclusões a que a <strong><a href="http://www.cxpartners.co.uk/thoughts/the_myth_of_the_page_fold_evidence_from_user_testing.htm">cxpartners</a></strong> chegou no ano passado, foi que na realidade quando um website possui menos conteúdo &#8220;above the fold&#8221; ele vai encorajar o utilizador a fazer scroll e a explorá-lo. Isto não significa que aquela secção deve ficar vazia, é apenas um alerta para não exagerarmos antes da dobra e escolhermos com atenção os elementos que lá colocamos. Reparem neste exemplo:</p>
<p style="text-align: center;"><img class="size-full wp-image-2299 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/09/scroll-4.jpg" alt="Exemplo cxpartners" width="550" height="406" /></p>
<p style="text-align: center;"><strong>Fonte: <a href="http://www.cxpartners.co.uk/thoughts/the_myth_of_the_page_fold_evidence_from_user_testing.htm">cxpartners</a></strong></p>
<p style="text-align: justify;">Na imagem da esquerda é visível que o utilizador centra-se acima da dobra e raramente faz scroll. Já do lado direito, uma secção &#8220;above the fold&#8221; menos preenchida leva a que o utilizador explore mais o website e recorra ao scroll.</p>
<h3 style="text-align: justify;"><strong>4º- Há Vida Below The Fold<br />
</strong></h3>
<p style="text-align: justify;">Acho que por esta altura quem está a ler este artigo já percebeu que <strong>existe vida depois da dobra e é por isso que é tão importante que estejamos bem preparados para o scroll</strong>. A melhor forma de o conseguirmos é compreendendo o comportamento do utilizador quando visita um website e é aqui que os estudos de &#8220;<strong>eye tracking</strong>&#8221; dão uma ajuda preciosa.</p>
<p style="text-align: justify;">Um estudo de &#8220;eye tracking&#8221; serve para que nós possamos descobrir para onde o visitante olha quando entra em contacto com um determinado website, eu até já escrevi sobre isso em <a href="http://www.maistrafego.pt/usabilidade-porque-a-ignoramos"><strong>Usabilidade: Porque A Ignoramos?</strong></a>. Os resultados obviamente variam consoante o website, mas há um consenso mais ou menos geral sobre como o utilizador analisa a informação que tem à sua frente. Assim de uma forma muito simples vamos olhar para um exemplo:</p>
<p style="text-align: center;"><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/09/exemplo2.jpg"></a><img class="size-full wp-image-2300 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/09/scroll.jpg" alt="Exemplo Padrão F" width="400" height="500" /></p>
<p style="text-align: justify;">Podemos retirar uma conclusão óbvia:</p>
<p style="text-align: justify;">1º- <strong>O leitor começa na maior parte das vezes a analisar a informação da esquerda para a direita</strong>, algo que a maior parte dos webmasters já sabiam.</p>
<p style="text-align: justify;">A novidade aqui é que ele também analisa um pouco o lado direito. Isto é o muito falado padrão em &#8220;<strong>F</strong>&#8220;, se repararem eu coloquei umas linhas brancas que formam um género de um padrão em &#8220;F&#8221; quer na secção acima da dobra, quer na secção abaixo da dobra ( não se esqueçam que a dobra é imaginária e a sua posição depende de inúmeros factores). <strong>A maior parte dos estudos de &#8220;eye tracking&#8221; chegaram à conclusão de que o visitante olha mais para aquelas áreas</strong>. Mesmo depois de fazer scroll e existindo uma probabilidade de o visitante contrariar essa tendência, ele muitas vezes volta a fazer uma espécie de &#8220;<strong>reset</strong>&#8221; e recomeça a processar a informação da mesma maneira.</p>
<p style="text-align: justify;">Se olharem por exemplo para <a href="http://www.jersonwanderley.com/wp-content/uploads/2010/09/cxpartners-resultados.jpg" target="_blank"><strong>imagem</strong></a> da <strong><a href="http://www.cxpartners.co.uk/thoughts/the_myth_of_the_page_fold_evidence_from_user_testing.htm">cxpartners</a></strong> que eu coloquei lá em cima, vão reparar que no exemplo do lado direito o padrão em &#8220;F&#8221; é bem visível. Eu considero esta uma informação muito valiosa e que devemos ter em conta sempre que preparamos um website para o scroll.</p>
<h3 style="text-align: justify;"><strong>5º- Páginas Longas Não São Problema</strong></h3>
<p style="text-align: justify;">Há algum tempo atrás devido a toda esta questão relacionada com o scroll, alguns webmasters optaram por diminuir o comprimento dos seus websites porque tinham receio que os utilizadores nunca o explorassem devidamente com o scroll. Na realidade só mesmo as páginas &#8220;estupidamente&#8221; longas é que podem ser um problema, porque em todas as outras os utilizadores fazem scroll independentemente do seu tamanho.</p>
<p style="text-align: justify;">O estudo é da <strong><a title="Because every user has a story (and a blog)" href="http://blog.clicktale.com/">ClickTale</a></strong>:</p>
<p style="text-align: center;"><a href="http://www.jersonwanderley.com/wp-content/uploads/2010/09/scroll.png"></a><img class="size-full wp-image-2301 aligncenter" src="http://www.maistrafego.pt/wp-content/uploads/2010/09/scroll-6.png" alt="Dados ClickTale" width="500" height="333" /></p>
<p style="text-align: center;"><strong>Fonte: <a title="Because every user has a story (and a blog)" href="http://blog.clicktale.com/">ClickTale</a></strong></p>
<p style="text-align: justify;">Isto significa que o comprimento da página não é assim tão prejudicial para o scroll. Mas atenção, este estudo é antigo (2006) e como eu já escrevi aqui no blogue e também no fórum, &#8220;<strong>a web está em constante mutação</strong>&#8221; e isto não é uma carta verde para começarmos a criar apenas páginas longas.</p>
<h3 style="text-align: center;">&#8220;O que é regra hoje, pode não ser amanhã&#8221;</h3>
<p style="text-align: justify;">O única coisa que se mantém intacta é a vontade que o visitante tem de explorar e essa sim é gigantesca. É por isso que ele faz scroll e vai continuar a fazê-lo e é por isso que nós devemos receber o scroll de braços abertos.</p>
<h3 style="text-align: justify;"><strong>Resumindo:</strong></h3>
<ul>
<li>1º- A interacção bem sucedida de um utilizador com um website está dependente de inúmeros factores;</li>
</ul>
<ul>
<li>2º- O scroll faz parte da natureza exploradora do internauta;</li>
</ul>
<ul>
<li>3º- Não se deve lutar contra os instintos dos utilizadores;</li>
</ul>
<ul>
<li>4º- O utilizador nunca vai deixar de fazer scroll apenas porque não gosta de o fazer;</li>
</ul>
<ul>
<li>5º- Não sobrevalorizes o &#8220;Above the fold&#8221;;</li>
</ul>
<ul>
<li>6º- Utiliza o &#8220;above the fold&#8221; para incentivar o scroll;</li>
</ul>
<ul>
<li>7º- Vai construindo interesse à medida que o utilizador faz scroll;</li>
</ul>
<ul>
<li>8º- Menos conteúdo above the fold encoraja a exploração;</li>
</ul>
<ul>
<li>9º- Existe vida depois da dobra e é por isso que é tão importante que estejamos bem preparados para o scroll;</li>
</ul>
<ul>
<li>10º- Nunca te esqueças do padrão em F quando constróis um website;</li>
</ul>
<ul>
<li>11º- Não receies páginas compridas, o leitor vai fazer à mesma scroll;</li>
</ul>
<ul>
<li>12º- As regras de hoje podem não se aplicar amanhã, prepara-te para as quebrar sempre que seja necessário;</li>
</ul>
<ul>
<li>13º- Navegar na Internet é um acto de exploração, repito-o novamente para que nunca mais te esqueças.</li>
</ul>
<h3 style="text-align: justify;"><strong>Finalmente:</strong></h3>
<p style="text-align: justify;">Não tenhas receio de questionar. Todas as estatísticas, todos os estudos, todas as opiniões podem ser contestadas. As regras do jogo estão constantemente a mudar, até o próprio comportamento do utilizador vai-se alterando de tempos a tempos. Mas na sua essência um internauta nunca deixará de ser aquela pessoa curiosa e disposta a explorar a web. Actualmente o scroll faz parte do acto de navegação, pode ser que daqui a uns tempos as coisas mudem, até porque tudo é possível. Mas por agora é fulcral que trabalhemos um website como um todo, não podemos deixar uma dobra imaginária que a maior parte das pessoas nem sequer sabe onde fica, nos condicione. O scroll deve ser recebido de braços abertos e compete-nos a nós ter a habilidade necessária para o aproveitarmos.</p>
<p style="text-align: justify;">Até à próxima.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/venha-dai-o-scroll/feed</wfw:commentRss>
		<slash:comments>16</slash:comments>
		</item>
		<item>
		<title>WordPress o verdadeiro guia</title>
		<link>http://www.maistrafego.pt/wordpress-o-verdadeiro-guia</link>
		<comments>http://www.maistrafego.pt/wordpress-o-verdadeiro-guia#comments</comments>
		<pubDate>Wed, 22 Apr 2009 22:26:06 +0000</pubDate>
		<dc:creator>Nuno</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[wordpress]]></category>
		<category><![CDATA[plugins]]></category>
		<category><![CDATA[themes]]></category>
		<category><![CDATA[tutorial]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=238</guid>
		<description><![CDATA[O WordPress é a plataforma com a maior legião de fãns do mundo dos CMS, é talvez o gestor de conteúdos mais simples e ao mesmo tempo mais poderoso com que alguma vez trabalhei. As razões para isto são simples, é um CMS completamente orientado para o blogging, mas que com algumas modificações, hacks e [...]]]></description>
			<content:encoded><![CDATA[<p>O <a href="http://www.wordpress.org">WordPress</a> é a plataforma com a maior legião de fãns do mundo dos <strong>CMS</strong>, é talvez o gestor de conteúdos mais simples e ao mesmo tempo mais poderoso com que alguma vez trabalhei. As razões para isto são simples, é um CMS completamente orientado para o <strong>blogging</strong>, mas que com algumas modificações, hacks e plugins, facilmente se torna em qualquer outro tipo de website. Em termos de mercado o wordpress tem movimentado milhares de profissionais, desde o desenvolvimento de plugins a themes, os <strong>web developers e web designers</strong> são cada vez mais requisitados para este tipo de trabalhos. Neste post vamos reunir dezenas de recursos extremamente úteis para quem trabalha com esta plataforma.<br />
<br />
O wordpress é uma plataforma fantásticas para os web designers mas também para o utilizador comum, devido à sua simplcidade, se quiser conhecer melhor o que se pode fazer com ela, veja <a href="http://www.maistrafego.pt/fantasticos-layouts-de-blogs-nacionais">este post</a>, que contém vários trabalhos de web designers portugueses em wordpress.<br />
<span id="more-238"></span></p>
<h2>Recursos úteis</h2>
<p><img class="alignnone size-medium wp-image-248" title="press1" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/press1-300x166.png" alt="press1" width="300" height="166" /></p>
<p>Estes dois documentos são a bíblia de quem desenvolve themes para wordpress, o primeiro têm todas as tags necessárias à criação de um theme, o segundo mostra-nos configurações já mais avançadas e sempre úteis para quem já tem alguma experiência na construção de layouts para esta plataforma.</p>
<p><strong>The WordPress Help Sheet</strong> -&gt; <a href="http://wpcandy.com/articles/tutorials/the-wordpress-help-sheet.html">site</a> | <a href="http://www.maistrafego.pt/wp-content/uploads/2009/04/wordpress-help-sheet.pdf">documento</a><br />
<strong>The Advanced WordPress Help Sheet</strong> -&gt; <a href="http://wpcandy.com/articles/tutorials/the-advanced-wordpress-help-sheet.html">site</a> | <a href="http://www.maistrafego.pt/wp-content/uploads/2009/04/advanced-wordpress-help-sheet.pdf">documento</a></p>
<h2>Códigos úteis</h2>
<p>(Atenção para copiar os códigos aconselha-mos a clicar em &#8220;view source&#8221; no menu das caixas de código)</p>
<h3>Mostrar posts recentes</h3>
<pre class="brush: php">

&lt;?php query_posts(&#039;showposts=5&#039;); ?&gt;
&lt;ul&gt;
&lt;?php while (have_posts()) : the_post(); ?&gt;
&lt;li&gt;&lt;a href=&quot;&lt;?php the_permalink() ?&gt;&quot;&gt;&lt;?php the_title(); ?&gt;&lt;/a&gt;&lt;/li&gt;
&lt;?php endwhile;?&gt;
&lt;/ul&gt;
</pre>
<h3>Mostrar posts/pages recentemente actualizados</h3>
<pre class="brush: php">

&lt;code&gt;&lt;?php
$today = current_time(&#039;mysql&#039;, 1);
$howMany = 5; //Number of posts you want to display
if ( $recentposts = $wpdb-&gt;get_results(&quot;SELECT ID, post_title FROM $wpdb-&gt;posts WHERE post_status = &#039;publish&#039; AND post_modified_gmt &lt; &#039;$today&#039; ORDER BY post_modified_gmt DESC LIMIT $howMany&quot;)):
?&gt;
&lt;h2&gt;&lt;?php _e(&quot;Recent Updates&quot;); ?&gt;&lt;/h2&gt;
&lt;ul&gt;
&lt;?php
foreach ($recentposts as $post) {
if ($post-&gt;post_title == &#039;&#039;) $post-&gt;post_title = sprintf(__(&#039;Post #%s&#039;), $post-&gt;ID);
echo &quot;&lt;li&gt;&lt;a href=&#039;&quot;.get_permalink($post-&gt;ID).&quot;&#039;&gt;&quot;;
the_title();
echo &#039;&lt;/a&gt;&lt;/li&gt;&#039;;
}
?&gt;
&lt;/ul&gt;
&lt;?php endif; ?&gt;&lt;/code&gt;
</pre>
<h3>Mostrar comentários recentes</h3>
<pre class="brush: php">

&lt;code&gt;&lt;?php
global $wpdb;
$sql = &quot;SELECT DISTINCT ID, post_title, post_password, comment_ID,
comment_post_ID, comment_author, comment_date_gmt, comment_approved,
comment_type,comment_author_url,
SUBSTRING(comment_content,1,30) AS com_excerpt
FROM $wpdb-&gt;comments
LEFT OUTER JOIN $wpdb-&gt;posts ON ($wpdb-&gt;comments.comment_post_ID =
$wpdb-&gt;posts.ID)
WHERE comment_approved = &#039;1&#039; AND comment_type = &#039;&#039; AND
post_password = &#039;&#039;
ORDER BY comment_date_gmt DESC
LIMIT 10&quot;;
$comments = $wpdb-&gt;get_results($sql);
$output = $pre_HTML;
$output .= &quot;\n&lt;ul&gt;&quot;;
foreach ($comments as $comment) {
$output .= &quot;\n&lt;li&gt;&quot;.strip_tags($comment-&gt;comment_author)
.&quot;:&quot; . &quot;&lt;a href=\&quot;&quot; . get_permalink($comment-&gt;ID) .
&quot;#comment-&quot; . $comment-&gt;comment_ID . &quot;\&quot; title=\&quot;on &quot; .
$comment-&gt;post_title . &quot;\&quot;&gt;&quot; . strip_tags($comment-&gt;com_excerpt)
.&quot;&lt;/a&gt;&lt;/li&gt;&quot;;
}
$output .= &quot;\n&lt;/ul&gt;&quot;;
$output .= $post_HTML;
echo $output;?&gt;&lt;/code&gt;
</pre>
<h3>Mostrar Top de comentários</h3>
<pre class="brush: php">

&lt;code&gt;&lt;?php $result = $wpdb-&gt;get_results(&quot;SELECT comment_count,ID,post_title FROM $wpdb-&gt;posts ORDER BY comment_count DESC LIMIT 0 , 10&quot;);
foreach ($result as $topten) {
$postid = $topten-&gt;ID;
$title = $topten-&gt;post_title;
$commentcount = $topten-&gt;comment_count;
if ($commentcount != 0) { ?&gt;
&lt;li&gt;&lt;a href=&quot;&lt;?php echo get_permalink($postid); ?&gt;&quot; title=&quot;&lt;?php echo $title ?&gt;&quot;&gt;&lt;?php echo $title ?&gt;&lt;/a&gt;&lt;/li&gt;
&lt;?php } } ?&gt;&lt;/code&gt;
</pre>
<h3>Mostrar categorias</h3>
<pre class="brush: php">

&lt;code&gt;&lt;h2&gt;Categories&lt;/h2&gt;
&lt;ul&gt;
&lt;?php wp_list_cats(&#039;sort_column=name&#039;); ?&gt;
&lt;/ul&gt;&lt;/code&gt;
</pre>
<h3>Mostrar arquivos</h3>
<pre class="brush: php">

&lt;code&gt;&lt;h2&gt;Archives&lt;/h2&gt;
&lt;ul&gt;
&lt;?php wp_get_archives(&#039;type=monthly&#039;); ?&gt;
&lt;/ul&gt;&lt;/code&gt;
</pre>
<h3>Mostrar menu de páginas na sidebar</h3>
<pre class="brush: php">

&lt;code&gt;&lt;h2&gt;Pages&lt;/h2&gt;
&lt;ul&gt;
&lt;?php wp_list_pages(&#039;title_li=&#039;); ?&gt;
&lt;/ul&gt;&lt;/code&gt;
</pre>
<h3>Mostrar gravatars</h3>
<pre class="brush: php">

&lt;code&gt;&lt;?php if(function_exists(’get_avatar’)){ echo get_avatar($comment, ‘50?);} ?&gt;&lt;/code&gt;
</pre>
<h3>Mostrar links do blogroll</h3>
<pre class="brush: php">

&lt;code&gt;&lt;ul&gt;
&lt;?php get_links_list(); ?&gt;
&lt;/ul&gt;&lt;/code&gt;
</pre>
<h3>Mostrar secção da Admin</h3>
<pre class="brush: php">

&lt;code&gt;&lt;ul&gt;
&lt;?php wp_register(); ?&gt;
&lt;li&gt;&lt;?php wp_loginout(); ?&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href=&quot;http://www.wordpress.org/&quot;&gt;WordPress&lt;/a&gt;&lt;/li&gt;
&lt;?php wp_meta(); ?&gt;
&lt;li&gt;&lt;a href=&quot;http://validator.w3.org/check?uri=referer&quot;&gt;XHTML&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;&lt;/code&gt;
</pre>
<h3>Mostrar nuvem de tags</h3>
<pre class="brush: php">

&lt;code&gt;&lt;?php wp_tag_cloud(&#039;smallest=8&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;largest=36&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;&#039;); ?&gt;&lt;/code&gt;
</pre>
<h3>Mostrar entradas mais recentes do seu twitter</h3>
<pre class="brush: php">

&lt;code&gt;&lt;?php
// Your twitter username.
$username = &quot;TwitterUsername&quot;;
// Prefix - some text you want displayed before your latest tweet.
// (HTML is OK, but be sure to escape quotes with backslashes: for example href=\&quot;link.html\&quot;)
$prefix = &quot;&quot;;
// Suffix - some text you want display after your latest tweet. (Same rules as the prefix.)
$suffix = &quot;&quot;;
$feed = &quot;http://search.twitter.com/search.atom?q=from:&quot; . $username . &quot;&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;rpp=1&quot;;
function parse_feed($feed) {
$stepOne = explode(&quot;&lt;content type=\&quot;html\&quot;&gt;&quot;, $feed);
$stepTwo = explode(&quot;&lt;/content&gt;&quot;, $stepOne[1]);
$tweet = $stepTwo[0];
$tweet = str_replace(”&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;lt;”, “&lt;”, $tweet);
$tweet = str_replace(”&amp;amp;amp;amp;amp;amp;amp;amp;amp;amp;gt;”, “&gt;”, $tweet);
return $tweet;
}
$twitterFeed = file_get_contents($feed);
echo stripslashes($prefix) . parse_feed($twitterFeed) . stripslashes($suffix);
?&gt;&lt;/code&gt;
</pre>
<h2>Tutoriais de Worpdress</h2>
<p><img class="alignnone size-medium wp-image-262" title="press2" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/press2-300x166.png" alt="press2" width="300" height="166" /></p>
<h3>Criação de themes</h3>
<ul>
<li><a href="http://css-tricks.com/designing-for-wordpress-complete-series-downloads/">Designing for WordPress</a></li>
<li><a href="http://www.dezinerfolio.com/2007/11/27/developing-a-wordpress-theme/">Developing a WordPress Theme</a></li>
<li><a href="http://nettuts.com/site-builds/how-to-create-a-wordpress-theme-from-scratch/">How to Create a WordPress Theme from Scratch</a></li>
<li><a href="http://themetation.com/how-to-create-wordpress-themes-from-scratch-part-1/">How to Create WordPress Themes from Scratch &#8211; Part 1</a></li>
<li><a href="http://themetation.com/how-to-create-wordpress-themes-from-scratch-part-2/">How to Create WordPress Themes from Scratch &#8211; Part 2</a></li>
<li><a href="http://urbangiraffe.com/2005/04/12/themeguide1/">Dissection of a WordPress Theme &#8211; Part 1</a></li>
<li><a href="http://www.wpdesigner.com/2007/02/19/so-you-want-to-create-wordpress-themes-huh/">So You Want to Create WordPress Themes Huh?</a></li>
<li><a href="http://theundersigned.net/2006/05/from-xhtmlcss-to-wordpress/">From XHTML/CSS to WordPress</a></li>
</ul>
<h3>Vários truques e dicas</h3>
<ul>
<li><a href="http://www.webdesignerwall.com/tutorials/wordpress-theme-hacks/">WordPress Theme Hacks</a></li>
<li><a href="http://www.noupe.com/wordpress/mastering-your-wordpress-theme-hacks-and-techniques.html">Mastering Your WordPress Theme Hacks and Techniques</a></li>
<li><a href="http://www.noupe.com/wordpress/most-desired-wordpress-hacks-11-common-requests-and-fixes.html">The Most Desired WordPress Hacks: 11 Common Requests and Fixes</a></li>
<li><a href="http://wphacks.com/wordpress-hacks/">Compilation of WordPress Hacks</a></li>
</ul>
<h3>Menus e navegação</h3>
<ul>
<li><a href="http://www.darrenhoyt.com/2008/02/12/creating-two-tiered-conditional-navigation-in-wordpress/">Creating Two-Tiered Conditional Navigation in WordPress</a></li>
<li><a href="http://hackwordpress.com/sliding-doors-wordpress-navigation-css-technique/">Using Sliding Doors with WordPress Navigation</a></li>
</ul>
<h3>WordPress com esteróides</h3>
<ul>
<li><a href="http://www.wpdesigner.com/2008/03/01/how-to-use-wordpress-as-a-membership-directory/">How to Use WordPress as a Membership Directory</a></li>
<li><a href="http://bloggingexperiment.com/archives/wordpress-page-as-home-page.php">Using a WordPress Page as Your Homepage</a></li>
<li><a href="http://www.darrenhoyt.com/2007/08/24/build-a-dynamic-design-portfolio-with-wordpress/">Build a Dynamic Design Portfolio with WordPress</a></li>
<li><a href="http://hackwordpress.com/how-to-separate-wordpress-comments-and-trackbacks/">How to Separate WordPress Comments and Trackbacks</a></li>
</ul>
<h3>Pimp my wordpress</h3>
<ul>
<li><a href="http://www.devlounge.net/code/client-friendly-wordpress-themes-headerphp">Client Friendly WordPress Themes: Header.php</a></li>
<li><a href="http://www.pearsonified.com/2006/10/simple_random_header_images_for_your_blog.php">Simple Random Header Image for Your Blog</a></li>
<li><a href="http://help-developer.com/index.php/2008/07/creating-a-widget-ready-footer-in-wordpress/">Creating a Widget-Ready Footer in WordPress</a></li>
<li><a href="http://www.problogdesign.com/general-tips/how-to-install-domtabs-on-wordpress/">How to Install DomTABs on WordPress</a></li>
<li><a href="http://nettuts.com/javascript-ajax/wordpress-sidebar-turned-apple-flashy-using-jquery-ui/">WordPress Sidebar Turned Apple-Flashy Using jQuery UI</a></li>
<li><a href="http://spyrestudios.com/how-to-create-a-life-stream-and-social-media-hub/">Creating a Life-Stream and Social Media Hub</a></li>
<li><a href="http://nettuts.com/working-with-cmss/create-a-youtube-section-with-wordpress/">Create a YouTube Section with WordPress</a></li>
<li><a href="http://www.wpdesigner.com/2007/06/12/styling-individual-posts-using-the_id/">Styling Individual Posts Using the_ID</a></li>
<li><a href="http://www.darrenhoyt.com/2007/12/26/multiple-wordpress-page-layouts-in-one-single-template/">Multiple WordPress Page Layouts in One Single Template</a></li>
<li><a href="http://nettuts.com/working-with-cmss/how-to-make-a-featured-post-carousel-for-wordpress/">How to Create a Featured Post Carousel for WordPress</a></li>
<li><a href="http://help-developer.com/index.php/2008/07/create-a-tabbed-featured-posts-area-in-wordpress/">Create a Tabbed Featured Post Area in WordPress</a></li>
</ul>
<h3>SEO</h3>
<ul>
<li><a href="http://yoast.com/articles/wordpress-seo/">WordPress SEO</a></li>
<li><a href="http://hackwordpress.com/how-to-blocking-your-wordpress-categories-and-archives-from-google/">Blocking Your WordPress Categories and Archives from Google</a></li>
<li><a href="http://theundersigned.net/2006/06/wordpress-and-seo/">WordPress and SEO</a></li>
<li><a href="http://www.geek-notes.com/wordpress/25/optimize-wordpress-for-search-engines/">SEO for WordPress Tips</a></li>
</ul>
<h2>Documentação oficial do WordPress</h2>
<p><img class="alignnone size-medium wp-image-265" title="press3" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/press3-300x166.png" alt="press3" width="300" height="166" /></p>
<p><a href="http://codex.wordpress.org/Theme_Development">Theme Development</a><br />
Este artigo cobre o essencial sobre a criação de themes em wordpress, bem como outras importantes referências sobre a criação de themes na página oficial da plataforma.</p>
<p><a href="http://codex.wordpress.org/The_Loop">The Loop</a><br />
Fala sobre os detalhes do loop, um dos elementos essenciais no sistema de themes do wp.</p>
<p><a href="http://codex.wordpress.org/Creating_an_Archive_Index">Creating an Archive Index</a></p>
<p>Existem dezenas de opções diferentes no que toca à representação do ficheiro dos arquivos.</p>
<p><a href="http://codex.wordpress.org/Customizing_Your_Sidebar">Customizing Your Sidebar</a><br />
As sibebars têm dezenas de apresentações possíveis, dá uma vista de olhos.</p>
<p><a href="http://codex.wordpress.org/Conditional_Tags">Conditional Tags</a><br />
Para criar themes versáteis em wordpress é essencial +erceber o funcionamento das conditional tags.</p>
<p><a href="http://codex.wordpress.org/Stepping_Into_Templates">Stepping into Templates</a></p>
<p>O básico do funcionamento das themes</p>
<p><a href="http://codex.wordpress.org/Template_Hierarchy">Template Hierarchy</a><br />
Explica como as templates funcionam juntas na theme.</p>
<p><a href="http://codex.wordpress.org/Using_Custom_Fields">Using Custom Fields</a><br />
Se és developer os custom fields abrem tudo um mundo novo de oportunidades.</p>
<p><a href="http://codex.wordpress.org/Search_Engine_Optimization_for_Wordpress">Search Engine Optimization for WordPress</a><br />
Artigo geral sobre SEO em wp.<br />
<br />
Qualquer dúvida que tenha sobre o wordpress pode colocar no nosso <a href="http://forum.maistrafego.pt">forum</a> de suporte a esta plataforma.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/wordpress-o-verdadeiro-guia/feed</wfw:commentRss>
		<slash:comments>26</slash:comments>
		</item>
		<item>
		<title>Fantásticos Layouts de blogs nacionais</title>
		<link>http://www.maistrafego.pt/fantasticos-layouts-de-blogs-nacionais</link>
		<comments>http://www.maistrafego.pt/fantasticos-layouts-de-blogs-nacionais#comments</comments>
		<pubDate>Wed, 22 Apr 2009 00:39:00 +0000</pubDate>
		<dc:creator>Nuno</dc:creator>
				<category><![CDATA[Categorias]]></category>
		<category><![CDATA[webdesign]]></category>
		<category><![CDATA[wordpress]]></category>
		<category><![CDATA[layouts]]></category>

		<guid isPermaLink="false">http://www.maistrafego.pt/?p=189</guid>
		<description><![CDATA[Tenho de ser sincero ao escrever este post, arranjar material de qualidade sobre este tema em Portugal, parece que é mentira! Onde andam os web designers portugueses!? Pergunto-me&#8230; Das duas uma, ou não frequentam os mesmos sítios que o utilizador comum, o que até aqui pode ser normal, ou nunca ouviram falar de optimização de [...]]]></description>
			<content:encoded><![CDATA[<p>Tenho de ser sincero ao escrever este post, arranjar material de qualidade sobre este tema em <strong>Portugal</strong>, parece que é mentira! Onde andam os <strong>web designers</strong> portugueses!? Pergunto-me&#8230;<br />
Das duas uma, ou não frequentam os mesmos sítios que o utilizador comum, o que até aqui pode ser normal, ou nunca ouviram falar de optimização de sites, porque no google não se dá por eles, ou então, não conhecem o <a href="http://www.linkedin.com/">linkedin</a>, ou a <a href="http://www.behance.net/">behance</a> ou o <a href="http://www.deviantart.com/">deviantart</a>&#8230; Porque fartei-me de procurar por tudo o que era lado para encontrar bom material para colocar neste post e digo-vos que foi uma missão quase impossível.</p>
<p>O que mais me surpreende é que numa altura em que o <a href="http://www.wordpress.org">wordpress</a> é rei, o fronted webdesign começa a ser especialização, o ajax está completamente na moda, a usabilidade e acessibilidade web crescem a olhos vistos, nunca pensei ter tanta dificuldade mas, os que se arranjaram dão muito bem conta do recado, e demonstram o que de melhor se faz por cá a este nível.<br />
<span id="more-189"></span></p>
<h3>Blogs em wordpress</h3>
<p><strong><a href="http://www.portaldojardim.com/pdj/">Portal do Jardim</a></strong><br />
É um blog em wordpress, muito bem conseguido diga-se e foi desenhado pela <a href="http://www.cristinavaz.com/">webdesigner Cristina Vaz</a> que conta com excelente portefólio e é responsável também pelo portal da <a href="http://www.aeiou.pt">aeiou.pt</a>.</p>
<div id="attachment_196" class="wp-caption alignnone" style="width: 310px"><a href="http://www.portaldojardim.com/pdj/"><img class="size-medium wp-image-196" title="lay1" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay1-300x166.png" alt="Portal do jardim" width="300" height="166" /></a><p class="wp-caption-text">Portal do jardim</p></div>
<p><strong><a href="http://www.mediaflavors.com/">Mediaflavors</a> e <a href="http://www.mproducts.pt/">mproducts</a></strong><br />
Estes são dois websites em wordpress pertencentes à mesma empresa, estão os dois muito bem conseguidos, utilizar o wordpress para um site corporativo nem sempre é fácil!</p>
<div id="attachment_197" class="wp-caption alignnone" style="width: 310px"><a href="http://www.mediaflavors.com/"><img class="size-medium wp-image-197" title="lay2" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay2-300x166.png" alt="mediaflavors" width="300" height="166" /></a><p class="wp-caption-text">mediaflavors</p></div>
<p><strong><a href="http://www.paintbits.com/">Paintbits</a></strong></p>
<p>Blog pessoal do greven aka Nuno Alexandre, podem ver o seu deviant <a href="http://grevenlx.deviantart.com/">aqui</a>.</p>
<div id="attachment_198" class="wp-caption alignnone" style="width: 310px"><a href="http://www.paintbits.com/"><img class="size-medium wp-image-198" title="lay3" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay3-300x166.png" alt="paintbits" width="300" height="166" /></a><p class="wp-caption-text">paintbits</p></div>
<p><strong><a href="http://nocontinues.net/">nocontinues</a></strong></p>
<div id="attachment_199" class="wp-caption alignnone" style="width: 310px"><a href="http://nocontinues.net/"><img class="size-medium wp-image-199" title="lay4" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay4-300x166.png" alt="nocontinues" width="300" height="166" /></a><p class="wp-caption-text">nocontinues</p></div>
<p><strong><a href="http://www.revolucaodigital.net/">Revolucaodigital</a></strong></p>
<div id="attachment_202" class="wp-caption alignnone" style="width: 310px"><a href="http://www.revolucaodigital.net/"><img class="size-medium wp-image-202" title="lay5" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay5-300x166.png" alt="revolucao digital" width="300" height="166" /></a><p class="wp-caption-text">revolucao digital</p></div>
<p><strong><a href="http://designcriativo.com/">Design criativo</a></strong></p>
<div id="attachment_204" class="wp-caption alignnone" style="width: 310px"><a href="http://designcriativo.com/"><img class="size-medium wp-image-204" title="lay6" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay6-300x166.png" alt="design criativo" width="300" height="166" /></a><p class="wp-caption-text">design criativo</p></div>
<p><strong><a href="http://www.ivogomes.com/">Ivo Gomes</a></strong></p>
<p>Blog pessoal do Ivo Gomes, aconselho a visitarem o site, que este rapaz além de ser um fanático por usabilidade e standards tem uns projectos muito interessantes, como o <a href="http://www.mytvshows.org">myTVShows</a>.</p>
<div id="attachment_206" class="wp-caption alignnone" style="width: 310px"><a href="http://www.ivogomes.com/"><img class="size-medium wp-image-206" title="lay7" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay7-300x166.png" alt="ivogomes.com" width="300" height="166" /></a><p class="wp-caption-text">ivogomes.com</p></div>
<p><strong><a href="http://oldschoolgarage.com.pt/">Oldschoolgarage</a></strong></p>
<div id="attachment_209" class="wp-caption alignnone" style="width: 310px"><a href="http://oldschoolgarage.com.pt/"><img class="size-medium wp-image-209" title="lay8" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay8-300x166.png" alt="oldschoolgarage.com.pt" width="300" height="166" /></a><p class="wp-caption-text">oldschoolgarage.com.pt</p></div>
<p><strong><a href="http://blog.goplanapp.com/">go plan blog</a></strong></p>
<p>A simplicidade deste blog é de tal forma arrepiante que chega a meter impressão, aqui fica a referência ao projecto <a href="http://goplanapp.com/">goplan</a> da <a href="http://webreakstuff.com/">webreakstuff</a>.</p>
<div id="attachment_211" class="wp-caption alignnone" style="width: 310px"><a href="http://blog.goplanapp.com/"><img class="size-medium wp-image-211" title="lay9" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay9-300x166.png" alt="blog.goplanapp.com" width="300" height="166" /></a><p class="wp-caption-text">blog.goplanapp.com</p></div>
<p><strong><a href="http://www.stereo-productions.com/blog/">Stereo productions </a></strong></p>
<div id="attachment_212" class="wp-caption alignnone" style="width: 310px"><a href="http://www.stereo-productions.com/blog/"><img class="size-medium wp-image-212" title="lay10" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay10-300x166.png" alt="stereo-productions.com" width="300" height="166" /></a><p class="wp-caption-text">stereo-productions.com</p></div>
<p><strong><a href="http://www.portaloe.com/blog/">Portaloe</a></strong></p>
<div id="attachment_213" class="wp-caption alignnone" style="width: 310px"><a href="http://www.portaloe.com/blog/"><img class="size-medium wp-image-213" title="lay11" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay11-300x166.png" alt="portaloe.com" width="300" height="166" /></a><p class="wp-caption-text">portaloe.com</p></div>
<p><strong><a href="http://patriciafurtado.net/zone/blog/">Patricia furtado</a></strong></p>
<div id="attachment_216" class="wp-caption alignnone" style="width: 310px"><a href="http://patriciafurtado.net/zone/blog/"><img class="size-medium wp-image-216" title="lay12" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay12-300x166.png" alt="patriciafurtado.net" width="300" height="166" /></a><p class="wp-caption-text">patriciafurtado.net</p></div>
<p><strong><a href="http://www.toapmusic.com/">Toapmusic</a></strong></p>
<p>Este é da menina a cima, muito bem conseguido!</p>
<div id="attachment_217" class="wp-caption alignnone" style="width: 310px"><a href="http://www.toapmusic.com/"><img class="size-medium wp-image-217" title="lay13" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay13-300x166.png" alt="toapmusic.com" width="300" height="166" /></a><p class="wp-caption-text">toapmusic.com</p></div>
<p><strong><a href="http://www.on-spot.net/on-spot/www/">on-spot</a></strong></p>
<p>Mais um da <a href="http://patriciafurtado.net">Patrícia Furtado</a>.</p>
<div id="attachment_218" class="wp-caption alignnone" style="width: 310px"><a href="http://www.on-spot.net/on-spot/www/"><img class="size-medium wp-image-218" title="lay14" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay14-300x166.png" alt="on-spot.net" width="300" height="166" /></a><p class="wp-caption-text">on-spot.net</p></div>
<p><strong><a href="http://www.putadaloucura.com/">Puta da loucura</a></strong></p>
<div id="attachment_219" class="wp-caption alignnone" style="width: 310px"><a href="http://www.putadaloucura.com/"><img class="size-medium wp-image-219" title="lay15" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay15-300x166.png" alt="putadaloucura.com" width="300" height="166" /></a><p class="wp-caption-text">putadaloucura.com</p></div>
<p><strong><a href="http://www.nefasto.eu/">Colectivo Nefasto</a></strong></p>
<p>Estes rapazes têm uns trabalhos extremamente idiotas como <a href="http://www.nefasto.eu/portefolio/direito-a-infelicidade/">O direito à infelicidade</a> e o <a href="http://www.nefasto.eu/portefolio/ahntenna/">Ahntenna</a>, muito bom visitem!</p>
<div id="attachment_220" class="wp-caption alignnone" style="width: 310px"><a href="http://www.nefasto.eu/"><img class="size-medium wp-image-220" title="lay16" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay16-300x166.png" alt="nefasto.eu" width="300" height="166" /></a><p class="wp-caption-text">nefasto.eu</p></div>
<p><strong><a href="http://www.ncoelho.com/">Nuno Coelho</a></strong></p>
<p>Este é o meu, não digam a ninguém&#8230;</p>
<div id="attachment_221" class="wp-caption alignnone" style="width: 310px"><a href="http://www.ncoelho.com/"><img class="size-medium wp-image-221" title="lay17" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay17-300x166.png" alt="ncoelho.com" width="300" height="166" /></a><p class="wp-caption-text">ncoelho.com</p></div>
<h3>Blogs do Sapo</h3>
<p>Aqui é que encontrei pouca coisa de relevância, é óbivio que o sistema de templates do sapo não é tão elaborado, mas também dá para fazer uma coisas engraçadas, para um próximo post prometo criar documentação sobre isto.</p>
<p><strong><a href="http://gonn1000.blogs.sapo.pt/">Gonn1000</a></strong></p>
<div id="attachment_224" class="wp-caption alignnone" style="width: 310px"><a href="http://gonn1000.blogs.sapo.pt/"><img class="size-medium wp-image-224" title="lay18" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay18-300x166.png" alt="gonn1000.blogs.sapo.pt" width="300" height="166" /></a><p class="wp-caption-text">gonn1000.blogs.sapo.pt</p></div>
<p><strong><a href="http://havidaemmarkl.blogs.sapo.pt/">Havidaemmarkl</a></strong></p>
<p>Mais uma obra da <a href="http://patriciafurtado.net">Patrícia Furtado</a>, sim ela tem jeito&#8230;</p>
<div id="attachment_225" class="wp-caption alignnone" style="width: 310px"><a href="http://havidaemmarkl.blogs.sapo.pt/"><img class="size-medium wp-image-225" title="lay19" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay19-300x166.png" alt="havidaemmarkl.blogs.sapo.pt" width="300" height="166" /></a><p class="wp-caption-text">havidaemmarkl.blogs.sapo.pt</p></div>
<p><strong><a href="http://www.liwl.net/">Isa Costa</a></strong></p>
<p>Ouvi dizer que é excelente designer, infelizmente não consegui encontrar o portefólio&#8230; Alguém sabe?</p>
<div id="attachment_226" class="wp-caption alignnone" style="width: 310px"><a href="http://www.liwl.net/"><img class="size-medium wp-image-226" title="lay20" src="http://www.maistrafego.pt/wp-content/uploads/2009/04/lay20-300x166.png" alt="liwl.net" width="300" height="166" /></a><p class="wp-caption-text">liwl.net</p></div>
<h3>Conclusão</h3>
<p>Parece que afinal o panorama não está assim tão mal, ainda são 20 referências de óptima qualidade, desafio os leitores do +t a deixarem aqui os blogs que deverão contar no próximo post deste género.</p>
]]></content:encoded>
			<wfw:commentRss>http://www.maistrafego.pt/fantasticos-layouts-de-blogs-nacionais/feed</wfw:commentRss>
		<slash:comments>19</slash:comments>
		</item>
	</channel>
</rss>

