<?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>Blog Como Fazer Um Site &#187; Design</title>
	<atom:link href="http://comofazerumsite.com/blog/category/design/feed/" rel="self" type="application/rss+xml" />
	<link>http://comofazerumsite.com/blog</link>
	<description></description>
	<lastBuildDate>Fri, 11 May 2012 10:23:27 +0000</lastBuildDate>
	<language>en</language>
	<sy:updatePeriod>hourly</sy:updatePeriod>
	<sy:updateFrequency>1</sy:updateFrequency>
	<generator>http://wordpress.org/?v=3.3.1</generator>
		<item>
		<title>10 Editores online de HTML &#8211; Editores WYSIWYG</title>
		<link>http://comofazerumsite.com/blog/10-editores-online-de-html-editores-wysiwyg/</link>
		<comments>http://comofazerumsite.com/blog/10-editores-online-de-html-editores-wysiwyg/#comments</comments>
		<pubDate>Fri, 09 Mar 2012 12:29:00 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Widgets]]></category>
		<category><![CDATA[editor html]]></category>
		<category><![CDATA[editor html online]]></category>
		<category><![CDATA[editor wysiwyg]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=1177</guid>
		<description><![CDATA[Os editores WYSIWYG (What You See Is What You Get) podem ser muito úteis para quem está a fazer um site. É com um destes editores que os posts no WordPress podem ser criados como no Microsoft Word ou como num outro qualquer processador de texto, sem que sejam necessários conhecimentos de HTML.
Estes editores podem ter muitas aplicações. Um editor WYSIWYG pode por exemplo ser integrado numa secção de um site para permitir que os visitantes possam aí deixar as suas mensagens. Existem vários editores diferentes que podem apresentar uma ...]]></description>
			<content:encoded><![CDATA[<p>Os <strong>editores WYSIWYG</strong> (What You See Is What You Get) podem ser muito úteis para quem está a <a href="http://www.comofazerumsite.com">fazer um site</a>. É com um destes editores que os posts no WordPress podem ser criados como no Microsoft Word ou como num outro qualquer processador de texto, sem que sejam necessários conhecimentos de HTML.</p>
<p>Estes editores podem ter muitas aplicações. Um editor WYSIWYG pode por exemplo ser integrado numa secção de um site para permitir que os visitantes possam aí deixar as suas mensagens. Existem vários editores diferentes que podem apresentar uma ou outra funcionalidade mais interessante para uma dada aplicação.</p>
<p>Resolvi experimentar dois desses editores com o objectivo de disponibilizar no <a href="http://www.comofazerumsite.com">como fazer um site</a> uma página para quem estivesse a <a href="http://www.comofazerumsite.com/criarsite/tutorial_html.html">aprender HTML</a>, para que pudessem ali experimentar facilmente os códigos à medida que os iam aprendendo.</p>
<ol>
<ol>
<li>Um dos editores HTML que instalei foi o <strong>TinyMCE</strong><br />
<a href="http://comofazerumsite.com/blog/wp-content/uploads/2012/03/tinymce-wysiwyg.jpg"><img class="aligncenter size-full wp-image-1178" title="tinymce-wysiwyg" src="http://comofazerumsite.com/blog/wp-content/uploads/2012/03/tinymce-wysiwyg.jpg" alt="" width="500" height="250" /></a></p>
<p>Se quiser experimentar o TinyMCE que instalei clique no link <a href="http://www.comofazerumsite.com/editor-html/" target="_blank">editor HTML</a>.</li>
</ol>
</ol>
<p>&nbsp;</p>
<ol>
<ol>
<li>O outro editor que instalei foi o <strong>CKEditor</strong><br />
<a href="http://comofazerumsite.com/blog/wp-content/uploads/2012/03/ckeditor-wysiwyg.jpg"><img class="aligncenter size-full wp-image-1179" title="ckeditor-wysiwyg" src="http://comofazerumsite.com/blog/wp-content/uploads/2012/03/ckeditor-wysiwyg.jpg" alt="" width="500" height="250" /></a></p>
<p>Se quiser experimentar o CKEditor que instalei clique no link <a href="http://www.comofazerumsite.com/editor-html-online/" target="_blank">editor HTML online</a>.</li>
</ol>
</ol>
<p>&nbsp;</p>
<p>Outros editores WYSIWYG de HTML que não cheguei a experimentar:</p>
<ol>
<li><a href="http://www.blueshoes.org/en/javascript/editor/" target="_blank">BlueShoes WYSIWYG Editor</a></li>
<li><a href="http://www.wymeditor.org/" target="_blank">WYM Editor</a></li>
<li><a href="http://jhtmlarea.codeplex.com/" target="_blank">jHTML Area – jQuery WYSIWYG Editor</a></li>
<li><a href="http://code.google.com/p/jwysiwyg/" target="_blank">jwysiwyg WYSIWYG jQuery Plugin</a></li>
<li><a href="http://xinha.webfactional.com/" target="_blank">Xinha</a></li>
<li><a href="http://nicedit.com/" target="_blank">NicEdit</a></li>
<li><a href="http://wmd-editor.com/" target="_blank">WMD – What You See is What You Get Markdown Editor</a></li>
<li><a href="http://www.w3.org/Amaya/" target="_blank">Amaya</a></li>
</ol>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/10-editores-online-de-html-editores-wysiwyg/feed/</wfw:commentRss>
		<slash:comments>1</slash:comments>
		</item>
		<item>
		<title>Top Comentadores do blog</title>
		<link>http://comofazerumsite.com/blog/top-comentadores-blog/</link>
		<comments>http://comofazerumsite.com/blog/top-comentadores-blog/#comments</comments>
		<pubDate>Wed, 29 Feb 2012 17:45:10 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Widgets]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[top comentadores blog]]></category>
		<category><![CDATA[top comentadores wordpress]]></category>
		<category><![CDATA[top comentaristas blog]]></category>
		<category><![CDATA[widget top comentadores]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=1124</guid>
		<description><![CDATA[
Recentemente adicionei um plugin que cria uma secção na barra lateral com os Top Comentadores no blog.
Os leitores que contribuírem com mais comentários válidos são recompensados com uma posição no TOP dos comentadores. A lista de &#8220;Top Comentadores&#8221; exibe o nome do utilizador e se o leitor tiver um site, o nome fica com o formato de link que aponta para esse site.
O plugin chama-se &#8220;Top Commentators Widget&#8221;. Quem quiser usar o plugin no seu blog pode encontrá-lo aqui. Pode também ser encontrado introduzindo o nome do plugin depois de ...]]></description>
			<content:encoded><![CDATA[<div style="float: right;"><a href="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/top-comentadores.jpg"><img class="alignnone  wp-image-1168" title="top-comentadores" src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/top-comentadores.jpg" alt="" width="255" height="239" /></a></div>
<p>Recentemente adicionei um plugin que cria uma secção na barra lateral com os <strong>Top Comentadores no blog</strong>.<br />
Os leitores que contribuírem com mais comentários válidos são recompensados com uma posição no TOP dos comentadores. A lista de &#8220;Top Comentadores&#8221; exibe o nome do utilizador e se o leitor tiver um site, o nome fica com o formato de link que aponta para esse site.</p>
<p>O plugin chama-se &#8220;Top Commentators Widget&#8221;. Quem quiser usar o plugin no seu blog pode encontrá-lo <a href="http://wordpress.org/extend/plugins/top-commentators-widget/" target="_blank">aqui</a>. Pode também ser encontrado introduzindo o nome do plugin depois de clicar no botão &#8220;Instalar Novo&#8221; na secção dos plugins do painel do WordPress. O plugin tem várias opções de configuração. Estas configurações são definidas na secção de widgets do WordPress depois do plugin estar instalado e activado. (Para o Blogger há uma solução semelhante, veja o artigo &#8220;<a href="http://www.comofazerumsite.com/criarblog/blogger/top-comentadores-blogger.html">Top Comentadores para o Blogger</a>&#8220;)</p>
<p>O plugin incentiva os comentários pois os leitores ficam com a possibilidade de receberem visitantes para o seu site. Para além disso os comentadores neste blog têm a vantagem de aqueles links serem dofollow, o que significa que podem participar neste blog, contribuindo com seus comentários, e ao mesmo tempo desenvolver a sua estratégia de Link Building com as palavras chave direcionadas para os motores de busca.</p>
<p>E você? Já usa uma secção de &#8220;<strong>Top Comentadores</strong>&#8221; no seu blog?
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/top-comentadores-blog/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>Criar sites em flash no Wix</title>
		<link>http://comofazerumsite.com/blog/criar-sites-em-flash-wix/</link>
		<comments>http://comofazerumsite.com/blog/criar-sites-em-flash-wix/#comments</comments>
		<pubDate>Tue, 07 Feb 2012 17:02:59 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Software Criação de Sites]]></category>
		<category><![CDATA[criar site flash]]></category>
		<category><![CDATA[criar site grátis]]></category>
		<category><![CDATA[fazer site flash]]></category>
		<category><![CDATA[site flash grátis]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=1039</guid>
		<description><![CDATA[Você não sabe como usar flash? Então como fazer um site em flash? Você quer andar horas e horas a aprender o básico sobre flash e depois ainda andar semanas ou meses a evoluir na curva de aprendizagem, até que finalmente consiga o site que queria? Ou será que há uma forma muito mais rápida de fazer um site em flash?

Para quem quer criar um site em flash sem ter que aprender flash, o Wix é uma excelente opção. Ao contrário de outras plataformas de criação de sites esta permite-lhe ...]]></description>
			<content:encoded><![CDATA[<p>Você não sabe como usar flash? Então <a href="http://www.comofazerumsite.com">como fazer um site</a> em flash? Você quer andar horas e horas a aprender o básico sobre flash e depois ainda andar semanas ou meses a evoluir na curva de aprendizagem, até que finalmente consiga o site que queria? Ou será que há uma forma muito mais rápida de <strong>fazer um site em flash</strong>?</p>
<div style="float: right;"><a href="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/fazer-sites-flash.jpg"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/fazer-sites-flash-300x254.jpg" alt="" title="fazer-sites-flash" width="300" height="254" class="alignright size-medium wp-image-1062" /></a></div>
<p>Para quem quer criar um site em flash sem ter que aprender flash, o <a href="http://comofazerumsite.com/solucoes/wix" rel="nofollow" target="_blank">Wix</a> é uma excelente opção. Ao contrário de outras plataformas de criação de sites esta permite-lhe ajustar praticamente todos os aspectos do seu site, quer escolha começá-lo de raiz, quer prefira usar um dos modelos disponíveis.</p>
<h3>Modelos disponíveis</h3>
<p>O Wix tem mais de 300 modelos (&#8220;templates&#8221;) numa grande variedade de categorias: eCommerce, Negócios, Consultoria, Imóveis, Fotografia, Arte &#038; Design, Moda, Estilo de Vida, Pessoal, etc.</p>
<p>Tem muitos modelos excelentes, mas também alguns menos bem conseguidos. Você vai querer experimentar uns quantos até se decidir por um.</p>
<p>Tendo em conta a grande diversidade de modelos que são oferecidos, o mais certo é escolher um em vez de optar por construir um site de raiz. O processo de design fica assim bastante facilitado, pois é eliminada uma considerável porção de trabalho que teria se tivesse que criar o seu próprio design. E como você pode mudar literalmente todos os aspectos de um modelo, você ainda fica com total controlo criativo do seu site.</p>
<h3>Fazer site a partir de um modelo</h3>
<p>Criar um site no Wix a partir de um modelo é muito simples. Tudo se resume a alguns passos:</p>
<ol>
<li>Depois de escolher um &#8220;template&#8221; clique em &#8220;Edit&#8221; para o editar.</li>
<li>A edição é bem intuitiva. É só clicar sobre as áreas que pretende editar, fazer as alterações que precisar, e introduzir conteúdo, texto, imagens, vídeos, etc. </li>
<li>No final poderá clicar em &#8220;Preview&#8221; para ver o resultado da edição que efetuou.</li>
<li>Se tudo estiver como pretende faça &#8220;Save&#8221;. Terá que dar um nome para o endereço do seu site.</li>
<li>De seguida para que o seu site fique no ar é só clicar em &#8220;Publish&#8221;, e já poderá aceder ao seu site a partir do endereço que definiu.</li>
</ol>
<h3>Alguns exemplos de modelos excelentes</h3>
<p>O Wix oferece muitos modelos que poderá usar para o seu site. Ficam aqui alguns exemplos, todos eles disponíveis na página <a href="http://comofazerumsite.com/solucoes/create_wix" target="_blank" rel="nofollow">Criar Site</a> do Wix: </p>
<p><strong>My Personal Portfolio</strong><br />
<a href="http://bit.ly/wXwjty" rel="nofollow" target="_blank"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/mypersonalportfolio.jpg" alt="" title="mypersonalportfolio" width="580" class="aligncenter size-full wp-image-1042" /></a></p>
<p><strong>Catering Website</strong><br />
<a href="http://bit.ly/zpr9Qe" rel="nofollow" target="_blank"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/cateringwebsite.jpg" alt="" title="cateringwebsite" width="580" class="aligncenter size-full wp-image-1047" /></a></p>
<p><strong>My Flowers Shop</strong><br />
<a href="http://bit.ly/zjEQ3N" rel="nofollow" target="_blank"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/myflowersshop.jpg" alt="" title="myflowersshop" width="580" class="aligncenter size-full wp-image-1048" /></a></p>
<p><strong>Designer Portfolio</strong><br />
<a href="http://bit.ly/AiS6jL" rel="nofollow" target="_blank"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/designerportfolio.jpg" alt="" title="designerportfolio" width="580" class="aligncenter size-full wp-image-1049" /></a></p>
<p><strong>Urban Artist</strong><br />
<a href="http://bit.ly/zsvZkd" rel="nofollow" target="_blank"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/urbanartist.jpg" alt="" title="urbanartist" width="580" class="aligncenter size-full wp-image-1050" /></a></p>
<p><strong>Yoga Center</strong><br />
<a href="http://bit.ly/wkoRvE" rel="nofollow" target="_blank"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/yogacenter.jpg" alt="" title="yogacenter" width="580" class="aligncenter size-full wp-image-1051" /></a></p>
<p><strong>Country Diner</strong><br />
<a href="http://bit.ly/x9WXhb"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/countrydiner.jpg" alt="" title="countrydiner" width="580" class="aligncenter size-full wp-image-1052" /></a></p>
<p><strong>Photo Planet</strong><br />
<a href="http://bit.ly/zA1ybu" rel="nofollow" target="_blank"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/photoplanet.jpg" alt="" title="photoplanet" width="580" class="aligncenter size-full wp-image-1053" /></a></p>
<h3>Criar site de raiz</h3>
<p>Em vez de usar um dos modelos fornecidos poderá também começar seu site do zero. Criar um site de raiz no Wix não é muito mais complicado do que o criar a partir de um &#8220;template&#8221;.</p>
<p>Na página <a href="http://comofazerumsite.com/solucoes/create_wix" target="_blank" rel="nofollow">Criar Site</a> do Wix clique em &#8220;Site em Branco&#8221;, na barra lateral:<br />
<a href="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/site-em-branco.jpg"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2012/02/site-em-branco.jpg" alt="" title="site-em-branco" width="580" height="243" class="aligncenter size-full wp-image-1058" /></a><br />
Depois é só seguir os mesmos passos: </p>
<ol>
<li>clicar em &#8220;Edit&#8221;</li>
<li>você começa com uma tela branca, com uma área de conteúdo por defeito que pode ajustar para as dimensões que quiser</li>
<li>introduzir todo o seu conteúdo e formatações do layout</li>
<li>clicar em &#8220;Preview&#8221;</li>
<li>clicar em &#8220;Save&#8221;</li>
<li>clicar em &#8220;Publish&#8221;</li>
</ol>
<h3>Exemplo de sites criados de raiz</h3>
<p>O Wix tem uma <a rel="nofollow" target="_blank" href="http://pt.wix.com/sample/website?utm_campaign=af_comofazerumsite.com&#038;experiment_id=af_comofazerumsite.com">galeria</a> cheia de sites que foram criados de raiz onde poderá encontrar inspiração para a criação do seu próprio site.
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/criar-sites-em-flash-wix/feed/</wfw:commentRss>
		<slash:comments>2</slash:comments>
		</item>
		<item>
		<title>30 dicas para melhorar seu site</title>
		<link>http://comofazerumsite.com/blog/30-dicas-para-melhorar-site/</link>
		<comments>http://comofazerumsite.com/blog/30-dicas-para-melhorar-site/#comments</comments>
		<pubDate>Sat, 17 Dec 2011 18:59:41 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[dicas]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=931</guid>
		<description><![CDATA[









Esta é uma lista de 30 dicas simples para melhorar o seu site, para o tornar mais funcional, para aumentar a sua navegabilidade. Foram retiradas da minha própria experiência e daquilo que fui lendo ao longo do tempo, a partir de várias fontes. Algumas são bem evidentes mas por vezes esquecemo-nos de as por em prática.
1 &#8211; Menos é mais
Procure simplificar ao máximo o seu site. Evite o excesso de movimento nas suas páginas, não abuse de imagens animadas. Páginas muito rebuscadas e complicadas só vão desviar o foco daquilo ...]]></description>
			<content:encoded><![CDATA[<p><center><br />
<table>
<td>
<div style="float: left;"><a href="http://comofazerumsite.com/solucoes/wix"><img class="aligncenter size-full wp-image-939" title="navegabilidade" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/12/navegabilidade.jpg" alt="" width="238" height="178" /></a></div>
</td>
<td>
<div style="float: right;"><a href="http://comofazerumsite.com/solucoes/wix"><img src="http://comofazerumsite.com/banners/wx-bann.png" alt="" /></a></div>
</td>
</table>
<p></center><br />
Esta é uma lista de 30 dicas simples para melhorar o seu site, para o tornar mais funcional, para aumentar a sua navegabilidade. Foram retiradas da minha própria experiência e daquilo que fui lendo ao longo do tempo, a partir de várias fontes. Algumas são bem evidentes mas por vezes esquecemo-nos de as por em prática.</p>
<p><strong>1 &#8211; Menos é mais</strong><br />
Procure simplificar ao máximo o seu site. Evite o excesso de movimento nas suas páginas, não abuse de imagens animadas. Páginas muito rebuscadas e complicadas só vão desviar o foco daquilo que interessa, deixando os visitantes desnorteados, muitas vezes acabando por abandonar o site por não terem encontrado facilmente aquilo que gostariam.</p>
<p><strong>2 &#8211; Informações a dois cliques</strong><br />
Planeje o seu site de maneira que qualquer informação fique a dois, ou no máximo a três, cliques da Homepage. Lembre-se que o importante é facilitar o mais possível o acesso do visitante às informações contidas no seu site.</p>
<p><strong>3 &#8211; Cuidado com as animações flash</strong><br />
Um site com animações em flash pode até causar um impacto positivo se essas animações forem bem feitas e devidamente integradas no layout, mas lembre-se que as animações podem fazer com que as páginas levem demasiado tempo a carregar, o que não será bem visto pelo Google. Para além disso o Google, e outros motores de busca, também não percebem facilmente qual o conteúdo apresentado através de flash o que não ajuda a que essas páginas sejam rankeadas nas melhores posições. Use as animações flash com moderação, e ofereça sempre ao internauta a possibilidade de pular uma animação de abertura.</p>
<p><strong>4 &#8211; Sobreposição de cores semelhantes</strong><br />
Tenha cuidado ao escolher cores semelhantes. Lembre-se que o brilho e contraste variam de monitor para monitor, o que significa que você pode achar que duas cores parecidas se distinguem perfeitamente, mas muitos outros internautas podem ter outra percepção diferente da sua. Tal pode acontecer por exemplo quando usa um logótipo com vermelhos sobre um fundo laranja.</p>
<p><strong>5 &#8211; Logótipo do lado esquerdo</strong><br />
A melhor posição para o logótipo do seu site é do lado esquerdo. Essa posição facilita a visualização do logo e garante uma adequada identificação do site.</p>
<p><strong>6 &#8211; Contactos sempre bem visíveis</strong><br />
Uma das maiores utilidades de se ter um site é precisamente poder ser contactado pelo internauta, principalmente se se tratar de uma empresa. Mas mesmo que o site não seja de uma empresa, em que não existe uma necessidade de contacto comercial, lembre-se que o contacto é fundamental até para a manutenção do site. Um visitante pode aperceber-se de um problema com o seu site e avisá-lo disso mesmo. Não hesite, certifique-se que oferece acesso fácil ao email da empresa, telefone e endereço, a quem visita o seu site. Não é uma empresa? Então pelo menos garanta a possibilidade de ser contactado através de um formulário numa página do seu site concebida para esse efeito. Lembre-se que disponibilizar formas de contacto ajuda a credibilizar o seu site.</p>
<p><strong>7 &#8211; Resumo do conteúdo do site</strong><br />
Quando um site tem muito conteúdo, é boa ideia apresentar na Homepage  pequenos resumos dos assuntos tratados nas diferentes secções do site, com um link para cada uma dessas secções. É isso que fazem os grandes portais da internet: para cada secção um link seguido de um pequeno texto explicativo.</p>
<p><strong>8 &#8211; Mapa do site</strong><br />
Incluir na Homepage um link para um mapa do site (ou Sitemap) é sempre uma boa ideia, principalmente se o conteúdo do seu site atingiu uma grande dimensão com várias secções diferentes. Esse link levará o visitante a uma página onde é apresentada a estrutura do seu site, de uma forma simples e direta. É um pequeno guia das secções do seu site e das suas ramificações.</p>
<p><strong>9 &#8211; Menus</strong><br />
Outra forma de facilitar a vida a quem visita o seu site é deixar sempre visível os links para as diferentes páginas ou secções. Esses links podem ser apresentados sob a forma de botões numa barra de menus horizontal ou na barra lateral, mas deverão manter-se na mesma posição em todas as páginas do seu site para não confundir o internauta. Procure resumir cada secção do seu site numa palavra, ou duas no máximo. Dessa forma os menus tornam-se numa excelente ferramenta para os internautas encontrarem aquilo que procuram com facilidade.</p>
<p><strong>10 &#8211; Link para a Homepage</strong><br />
Também deve estar sempre à vista um link ou botão para a página inicial do site. Este pode ou não ser incluído nos menus do ponto anterior, mas é boa ideia que esteja sempre à mão.</p>
<p><strong>11 &#8211; Link para a Homepage no logótipo</strong><br />
Tornou-se quase automático para quem usa a internet clicar no logótipo para ir para a página inicial de um site. Não se esqueça então de fazer com que a imagem do logótipo do seu site funcione também como um link para a Homepage, é simples e vai tornar a navegação mais prática.</p>
<p><strong>12 &#8211; Itens desnecessários</strong><br />
Pergunte-se se os itens que são apresentados no seu site são mesmo necessários. Por exemplo botões para tornar um site a <em>Página Inicial</em> no browser do visitante ou para adicionar o site aos <em>Favoritos</em> do visitante, será que são mesmo necessários? Não será preferível abdicar desses itens e assim simplificar o site, ou então aproveitar o espaço que eles ocupam para conteúdo relevante?</p>
<p><strong>13 &#8211; Data no cabeçalho</strong><br />
A maior parte dos sites não tem necessidade alguma de informar o internauta da hora, dia da semana, mês, ano&#8230; Mas este é ainda um erro comum em muitos sites. Lembre-se do ponto 1: &#8220;Menos é mais&#8221;.</p>
<p><strong>14 &#8211; Marcas de água</strong><br />
As marcas de água podem ser um elemento de design interessante. Pode ser usado por exemplo como fundo das páginas. Mas deve ser usado com muito cuidado para não interferir com a legibilidade do conteúdo do site. As marcas de água podem aparecer de forma diferente nos diferentes computadores dos internautas e podem mesmo atrapalhar a visualização correta das informações prestadas no site, para algum dos internautas. Por isso pense bem antes de usar as marcas de água.</p>
<p><strong>15 &#8211; Links relacionados</strong><br />
Indicar links relacionados com o seu site pode não ser uma boa prática pois vai ocupar espaço valioso no site e nem sempre acrescenta informações relevantes ao assunto do site. Se acha que esses links são realmente necessários e relevantes, considere a possibilidade de os colocar ao longo do próprio texto.</p>
<p><strong>16 &#8211; Ser objectivo</strong><br />
Antes de criar algum conteúdo para o seu site, escreva num papel o que de facto você quer transmitir. Em relação ao conteúdo da sua Homepage, pense nela como uma oportunidade de captar o interesse do internauta. Não espere que ele vá ler todo o seu site, pois o mais certo é isso não acontecer, mas aproveite para o cativar logo no inicio, explicando o porquê da existência do site, sendo claro e objectivo.</p>
<p><strong>17 &#8211; Navegação intuitiva</strong><br />
O visitante não tem que descobrir como navegar no seu site. Alguns sites transformam os botões de menus em imagens, ou então distribuem os botões de navegação num circulo ou numa imagem maior. Isso até pode impressionar pela inovação em termos de design mas pode afectar muito a funcionalidade. O internauta tem que entrar no seu site e começar logo de imediato navegando pelas várias páginas, sem ter que aprender primeiro como tudo funciona. Certifique-se que a navegação no seu site é suficientemente intuitiva para qualquer visitante.</p>
<p><strong>18 &#8211; Sub-menus</strong><br />
Cuidado ao usar demasiado o recurso de sub-menus. Por vezes pode tornar-se um desafio tentar clicar numa subsecção desses menus. Se precisar mesmo de sub-menus, tente fazer com que os menus iniciais se dividam apenas uma vez, ou seja, que não existam sub-menus de sub-menus mas apenas sub-menus de menus.</p>
<p><strong>19 &#8211; Botões do lado esquerdo</strong><br />
Assim como o logótipo também os botões de menu funcionam bem do lado esquerdo. É desse lado que os internautas esperam encontrar os menus. Portanto garanta uma boa navegabilidade do seu site colocando os botões de menu do lado esquerdo.</p>
<p><strong>20 &#8211; Organize o texto no layout</strong><br />
Não se limite a &#8220;descarregar&#8221; as informações ao longo da páginas. Isso pode fazer com que tudo fique com um aspecto pesado e cansativo. Divida o texto em porções menores, crie caixas com cores diferentes para destacar determinadas informações. Experimente usar o texto formatado em colunas. Pense que o texto também deve fazer parte do layout do site transmitindo ao conjunto um efeito dinâmico mas devidamente enquadrado e organizado.</p>
<p><strong>21 &#8211; Espaço para imagens</strong><br />
A organização do site pode ganhar bastante se for definido um determinado espaço, fixo, para a apresentação de certas imagens. Isso pode ser feito numa barra próxima do cabeçalho ou numa barra lateral. Nesse espaço as imagens podem ir sendo exibidas sucessivamente. Num site por exemplo de uma construtora podem ser rodadas aí imagens das diferentes obras realizadas.</p>
<p><strong>22 &#8211; Objetivo do site</strong><br />
Não perca de vista o objetivo do site. É sempre bom lembrar que um site cumpre uma determinada função, seja a de divulgar uma empresa, um currículo ou vender um produto. É fundamental manter o foco, respeite o objetivo do site, faça todo o planejamento do site voltado para isso.</p>
<p><strong>23 &#8211; Destacar uma secção</strong><br />
Por vezes uma determinada secção de um site merece mais atenção por parte dos visitantes. Se achar que isso vai contribuir para corresponder melhor aos interesses dos seus visitantes por um lado e por outro lado cumprir melhor o objectivo que se propôs para o seu site, então destaque essa secção. Pode por exemplo atribuir uma diferente cor ao botão do menu de navegação que corresponde à secção que quer destacar.</p>
<p><strong>24 &#8211; Evite excesso de destaques</strong><br />
Destacar muita coisa acaba por não destacar coisa nenhuma. Usar muitas cores vivas e muitos negritos só vai confundir o internauta e diminuir a funcionalidade do seu site.</p>
<p><strong>25 &#8211; Quem é você?</strong><br />
Para além de disponibilizar os contactos disponibilize aos visitantes do seu site alguma informação sobre quem você é ou sobre o que faz a sua empresa. Um pequeno resumo, algo simples. Também este aspecto é importante para a credibilização do seu site. Esta informação poderá ser acedida por exemplo a partir do menu de navegação.</p>
<p><strong>26 &#8211; Fontes</strong><br />
Escolha uma fonte adequada para o seu texto, que seja legível. Um aspecto muito importante que por vezes é descurado, é a importância de não usar demasiadas fontes diferentes na mesma página. Use no máximo duas fontes ou poderá gerar alguma confusão na leitura dos conteúdos e comprometendo a boa experiência do internauta que visita o seu site.</p>
<p><strong>27 &#8211; Respeite um modelo</strong><br />
Use o mesmo modelo de página para todo o seu site. Não use diferentes layouts para diferentes secções do seu site. Pode até mudar a cor de algum elemento para distinguir uma secção da outra mas mantenha-se fiel a um modelo, a um padrão. O internauta deverá reconhecer esse modelo em qualquer página do seu site.</p>
<p><strong>28 &#8211; Evite dar instruções</strong><br />
Não explique ao internauta como visitar o seu site. Se sentir necessidade de o fazer é porque provavelmente a navegabilidade do seu site não é a ideal. Procure simplificar o layout do seu site e torná-lo mais intuitivo.</p>
<p><strong>29 &#8211; O mais importante primeiro</strong><br />
Organize os assuntos e apresente os links/menus de maneira a que aquilo que considera mais importante seja apresentado em primeiro lugar. Quando organizar a informação no layout do seu site pense nos conteúdos mais importantes e disponha-os de forma a que estes fiquem em destaque nas melhores posições do layout.</p>
<p><strong>30 &#8211; Feedback dos visitantes</strong><br />
Não encare o layout do seu site como um produto acabado e imutável. Aproveite qualquer dúvida/sugestão de um visitante do seu site para aprimorar o layout e assim melhorar a navegabilidade</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/30-dicas-para-melhorar-site/feed/</wfw:commentRss>
		<slash:comments>4</slash:comments>
		</item>
		<item>
		<title>Edite suas fotos online</title>
		<link>http://comofazerumsite.com/blog/editar-fotos-online/</link>
		<comments>http://comofazerumsite.com/blog/editar-fotos-online/#comments</comments>
		<pubDate>Mon, 19 Sep 2011 17:52:25 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Editar Imagens]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[editar fotos]]></category>
		<category><![CDATA[ferramentas]]></category>
		<category><![CDATA[online]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=862</guid>
		<description><![CDATA[Neste post vou apresentar uma excelente ferramenta para editar fotos online.
Sem dúvida que existem bons programas para editar fotos e imagens, mas é preciso instalá-los. O Photoshop por exemplo é um programa que muita gente usa, que tem das opções mais avançadas para a edição de imagens, mas é um programa pago, que nem todos se podem dar ao luxo de adquirir. Depois há programas gratuitos, como é o caso do PhotoScape, editor de imagens de que já falei aqui neste blog, que pode ser uma boa alternativa, mas que ...]]></description>
			<content:encoded><![CDATA[<p>Neste post vou apresentar uma excelente ferramenta para <strong>editar fotos online</strong>.<br />
Sem dúvida que existem bons programas para editar fotos e imagens, mas é preciso instalá-los. O Photoshop por exemplo é um programa que muita gente usa, que tem das opções mais avançadas para a edição de imagens, mas é um programa pago, que nem todos se podem dar ao luxo de adquirir. Depois há programas gratuitos, como é o caso do <a href="http://comofazerumsite.com/blog/photoscape-editor-de-imagens-gratis/">PhotoScape, editor de imagens</a> de que já falei aqui neste blog, que pode ser uma boa alternativa, mas que também tem que ser instalado.</p>
<p>Que dizem de uma ferramenta que está sempre disponível online na internet, e que é grátis? Sim, essa ferramenta existe, e pode portanto ser utilizada para editar as suas fotos a partir de qualquer computador sem ter que se preocupar com a respectiva instalação.</p>
<p><a href="http://www.editar-fotos.net"><img class="aligncenter size-full wp-image-870" title="editar fotos" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/09/editar-fotos1.jpg" alt="" width="580" height="462" /></a></p>
<h3>Site para editar imagens online</h3>
<p>O <strong>editor de imagens online</strong> gratuito que recomendo é o <strong><a href="http://www.editar-fotos.net">editar-fotos</a><span style="color: #3c78a7;">.net</span></strong>. Tem todos os menus em português e combina todas as opções de edição que são normalmente usadas nos programas mais completos como o Photoshop. Algumas das operações que poderá realizar online são as seguintes:</p>
<ul>
<li>ajustar brilho das suas imagens</li>
<li>recortar imagens</li>
<li>redimensionar imagens</li>
<li>criar layers (camadas) na edição das imagens</li>
<li>utilizar uma grande variedade de filtros, efeitos e ajustes</li>
<li>etc</li>
</ul>
<p>O <strong><em>editar-fotos.net</em></strong> é uma ferramenta online que pode produzir os mesmos resultados que o Photoshop ou que outros programas que precisam de ser instalados num computador. Oferece uma enorme variedade de recursos, mas é ao mesmo tempo muito intuitivo e fácil de usar.</p>
<h3>Algumas características que distingue este editor de imagens online</h3>
<ul>
<li>Pode configurar o interface a seu gosto, mover as barras de ferramentas e redimensionar as janelas</li>
<li>Os principais comandos de edição estão disponíveis numa barra de ferramentas</li>
<li>Apresenta-se organizado também por menus como acontece com qualquer programa de edição de imagens</li>
<li>O layout da aplicação é bastante intuitivo, muito semelhante ao Photoshop, apresentando um histórico das acções de edição para poder desfazer qualquer alteração</li>
</ul>
<h3>Abrir e Salvar Imagens</h3>
<p>Pode escolher abrir uma nova imagem, e assim criar uma imagem de raiz usando o pincel, cores, texto, etc. Ou então pode abrir uma foto que tenha guardada no seu computador e editá-la a seu gosto usando as fantásticas ferramentas de correcção de brilho, recortar, redimensionar, e muito mais.</p>
<p>Se terminou de criar/editar uma imagem, terá que a salvar no seu disco rígido, o processo é exactamente igual ao que faria num programa instalado no seu computador.</p>
<h3>Fácil de usar</h3>
<p>O <strong><em>editar-fotos.net</em></strong> é um editor de imagens online muito fácil de usar. O layout apelativo permite oferecer uma grande variedade de ferramentas que noutros programas são de utilização complexa mas que neste site você poderá aceder e utilizar de uma forma bem facilitada e intuitiva. O processo para <a href="http://www.editar-fotos.net">editar fotos</a> está bastante simplificado com todos os comandos de edição disponíveis em ícones sempre à mão, sem a necessidade de navegar entre separadores (ou abas) para aceder a novas funções de edição, como acontece noutras aplicações online de edição de imagens. Os comandos de edição estão sempre visíveis, e qualquer filtro, efeito ou outra acção de que não tenha gostado pode ser imediatamente revertida usando para isso o histórico ou o Ctrl+Z.</p>
<h3>Editar imagens em qualquer lugar</h3>
<p>O site <strong><em>editar-fotos.net</em></strong> oferece-lhe uma das melhores ferramentas de edição de imagens, com uma combinação única de recursos de edição, acessíveis em qualquer lugar onde você tenha uma ligação à internet.</p>
<p>Porque espera? Comece já a desfrutar do excelente desempenho desta ferramenta, há poucos editores grátis melhores que o <strong><a href="http://www.editar-fotos.net">editar-fotos</a><span style="color: #3c78a7;">.net</span></strong>. Experimente!
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/editar-fotos-online/feed/</wfw:commentRss>
		<slash:comments>0</slash:comments>
		</item>
		<item>
		<title>Instale uma Janela Popup no Seu Blog</title>
		<link>http://comofazerumsite.com/blog/instale-janela-popup-no-seu-blog/</link>
		<comments>http://comofazerumsite.com/blog/instale-janela-popup-no-seu-blog/#comments</comments>
		<pubDate>Sun, 21 Aug 2011 16:08:41 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Blogger]]></category>
		<category><![CDATA[Divulgação]]></category>
		<category><![CDATA[Widgets]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[email marketing]]></category>
		<category><![CDATA[feedburner]]></category>
		<category><![CDATA[lista de emails]]></category>
		<category><![CDATA[mailing list]]></category>
		<category><![CDATA[popup]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=749</guid>
		<description><![CDATA[


O Feedburner é um serviço gratuito muito bom para disponibilizar o feed do blog, mas é também uma excelente forma de entregar automaticamente no email dos seus leitores cada novo post do seu blog.
Para usufruir do Feedburner, é necessário ter uma conta em www.feedburner.com, registar nessa conta o feed do blog, depois agarrar no código que o Feedburner fornece e colar no nosso blog. Para oferecer aos visitantes de um blog a subscrição por email, faz-se a mesma coisa, mas depois vai-se ao separador &#8220;Publicar&#8221; e em &#8220;Email Subscriptions&#8221; agarra-se ...]]></description>
			<content:encoded><![CDATA[<p><div style="float: left; margin: 5px;"><script type="text/javascript"><!--
google_ad_client = "pub-8184715702658212";
/* Criar Sites 300x250, criado 17/09/09 */
google_ad_slot = "8525512783";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></div>O Feedburner é um serviço gratuito muito bom para disponibilizar o feed do blog, mas é também uma excelente forma de entregar automaticamente no email dos seus leitores cada novo post do seu blog.</p>
<p>Para usufruir do Feedburner, é necessário ter uma conta em <a href="http://www.feedburner.com" target="_blank" rel="nofollow">www.feedburner.com</a>, registar nessa conta o feed do blog, depois agarrar no código que o Feedburner fornece e colar no nosso blog. Para oferecer aos visitantes de um blog a subscrição por email, faz-se a mesma coisa, mas depois vai-se ao separador &#8220;Publicar&#8221; e em &#8220;Email Subscriptions&#8221; agarra-se noutro código que depois se cola também no blog, que vai gerar uma pequena caixa onde os visitantes podem  fazer a subscrição por email.</p>
<p>Normalmente a caixa de subscrição por email é colocada na barra lateral, onde até parece funcionar bem, mas a verdade é que a maior parte das vezes os visitantes do blog não a vêem ou então simplesmente a ignoram pela localização em que está.</p>
<p>Como então fazer com que a subscrição por email seja mais eficiente? Como fazer com que muitos mais visitantes se inscrevam por email no seu blog?</p>
<h3>Popup para a subscrição por email</h3>
<p>É aqui que entram os popups de subscrição do blog por email. Estes popups estão a ser cada vez mais usados nos blogs com mais sucesso, o que por si só já demonstra a importância que têm as listas de emails para o crescimento de um blog.</p>
<p>Basicamente o popup funciona da seguinte forma, um visitante chega ao seu blog, e juntamente com o blog abre-se um popup onde esse visitante se pode inscrever para passar a receber os posts por email. Desta forma você passa a ter a certeza que a todos os visitantes do seu blog foi oferecido o serviço, e que este pelo menos foi visto.</p>
<p>Os popups que mais se vêm por aí funcionam muito bem, oferecem várias opções para o layout, mas são pagos. Podem custar cerca de $50 como é o caso do <a href="http://comofazerumsite.com/solucoes/popup-domination" target="_blank" rel="nofollow">PopUp Domination</a>.</p>
<h3>Popup que tenho usado aqui no <em>Como Fazer um Site</em></h3>
<div style="float: right"><a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/08/pop-email.jpg"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2011/08/pop-email.jpg" alt="" title="pop-email" width="300" height="272" class="aligncenter size-full wp-image-753" /></a></div>
<p>Aqui no <em>Como Fazer Um Site</em> tenho usado um popup feito por mim, com o qual tenho tido resultados excelentes. A minha lista de emails tem crescido imenso, desde que resolvi instalar o popup. Há poucos dias o número de subscritores aqui do blog ultrapassou os 7000.</p>
<p>Resolvi disponibilizar GRÁTIS o script do popup que uso, para que todos os meus leitores possam também ver as suas listas de emails dispararem. É fácil de instalar e o popup pode ser modificado para se encaixar perfeitamente no layout de cada blog. Para além disso se um visitante não estiver interessado em subscrever por email os posts do blog, ele pode fechar a janela popup, e a janela não se torna a abrir para ele, pois é gravado um cookie no browser desse visitante. O mesmo acontece para quem já se inscreveu. Isto garante que a janela popup não é incomodativa para os leitores habituais do blog.</p>
<h3>O popup pode ser instalado no WordPress e no Blogger</h3>
<p>A instalação do popup é muito simples e pode ser feita tanto para os blogs wordpress como para os blogs Blogspot.</p>
<p>Faça download GRÁTIS do Popup clicando em <a href="http://comofazerumsite.com/downloads/Popup-Feedburner-Email.zip"><strong>Popup-Feedburner-Email.zip</strong></a>  (27,8 Kb)</p>
<h3>Instruções de Instalação</h3>
<p>As instruções para instalar e configurar o popup estão no artigo <a href="http://comofazerumsite.com/add-ons/popup-para-aumentar-leitores-blog.html">Popup para Aumentar Leitores de Blog</a>.</p>
<p>Espero que o popup possa ser útil para você assim como tem sido para mim. Se tiver alguma questão ou dúvida deixe um comentário.
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/instale-janela-popup-no-seu-blog/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>Como colocar anúncios Adsense no WordPress</title>
		<link>http://comofazerumsite.com/blog/colocar-anuncios-adsense-no-wordpress/</link>
		<comments>http://comofazerumsite.com/blog/colocar-anuncios-adsense-no-wordpress/#comments</comments>
		<pubDate>Sat, 06 Aug 2011 18:43:22 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Design]]></category>
		<category><![CDATA[Ganhar Dinheiro]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[adsense no wordpress]]></category>
		<category><![CDATA[adsense wordpress]]></category>
		<category><![CDATA[anuncios adsense no wordpress]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=720</guid>
		<description><![CDATA[


Na sequência de uma questão colocada aqui no blog por um leitor do Como Fazer Um Site, sobre o modo como os anúncios do Adsense são colocados num blog WordPress, resolvi fazer um post a explicar uma técnica simples que uso e que me permite colocar os anúncios em qualquer posicionamento que eu queira.
Colocar anúncios Adsense usando o widget de texto
A forma mais simples de colocarmos anúncios Adsense talvez seja através dos widgets de texto. Na plataforma WordPress, na secção dos widgets, criamos  um novo widget de texto na ...]]></description>
			<content:encoded><![CDATA[<p><div style="float: left; margin: 5px;"><script type="text/javascript"><!--
google_ad_client = "pub-8184715702658212";
/* Criar Sites 300x250, criado 17/09/09 */
google_ad_slot = "8525512783";
google_ad_width = 300;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script></div>Na sequência de uma questão colocada aqui no blog por um leitor do <a href="http://comofazerumsite.com">Como Fazer Um Site</a>, sobre o modo <strong>como os anúncios do Adsense são colocados num blog WordPress</strong>, resolvi fazer um post a explicar uma técnica simples que uso e que me permite colocar os anúncios em qualquer posicionamento que eu queira.</p>
<h3>Colocar anúncios Adsense usando o widget de texto</h3>
<p>A forma mais simples de colocarmos anúncios Adsense talvez seja através dos widgets de texto. Na plataforma WordPress, na secção dos widgets, criamos  um novo widget de texto na barra lateral do blog e colamos lá o código Adsense. Mas estamos limitados pois não podemos colocar esses widgets de texto em qualquer posição no layout do blog.</p>
<h3>Temas WordPress com espaços optimizados para o Adsense</h3>
<p>Alguns <a rel="nofollow" href="http://comofazerumsite.com/solucoes/elegantthemes" target="_blank">temas do WordPress</a> já têm previstos no seu layout espaços para levarem anúncios do Adsense. Depende de tema para tema mas o processo é bastante simplificado pois os códigos Adsense são colocados directamente no painel do WordPress em campos pré-determinados para o efeito. A desvantagem deste método é que ficamos condicionados aos posicionamentos definidos pelo tema.</p>
<p>Aqui no tema deste blog, no Arthemia, para colocar os anúncios 300×250 e 468×60, que podem ver no cabeçalho, editei 2 ficheiros <em>php</em>, onde colei os códigos (o local para colar os códigos no <em>Arthemia Theme</em> está explicado no post “<a href="http://comofazerumsite.com/blog/download-do-arthemia-theme-em-portugues/">Download do Arthemia Theme em português</a>“).</p>
<h3>Colocar Adsense em qualquer posição do blog</h3>
<div style="float: right;"><a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/08/wordpress-adsense.jpg"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2011/08/wordpress-adsense.jpg" alt="" title="wordpress-adsense" width="273" height="267" class="aligncenter size-full wp-image-728" /></a></div>
<p>O posicionamento de um anúncio pode fazer a diferença entre ganharmos dinheiro com ele ou não ganharmos dinheiro nenhum. Eu sei que há plugins para o WordPress que podem ajudar a gerir a posição dos anúncios, mas a técnica que uso é muito simples e permite-me colocar anúncios Adsense em qualquer posicionamento num blog WordPress.</p>
<p>Para a aplicar temos que descobrir qual dos ficheiros php: <em>sidebar.php</em>, <em>header.php</em>, etc, é que corresponde ao posicionamento que nos interessa. Editamos esse ficheiro (indo à secção &#8220;Aparência&#8221; -ou &#8220;Apresentação&#8221;- e clicando em &#8220;Editor&#8221;, e depois aí escolhendo o ficheiro .php que aparece na lista do lado direito). Depois não basta colocarmos nele o código Adsense, no meio da programação <em>php</em>, pois o mais provável é que não funcione. Para além do código Adsense é necessário colocar alguns comandos <em>php</em> para que os anúncios funcionem e sejam exibidos. Suponhamos que queremos colocar um anúncio 468&#215;60 no cabeçalho. Editamos o ficheiro <em>header.php</em> e, na posição em que pretendemos que o anúncio apareça, colamos o seguinte:</p>
<p><code>&lt;?php<br />
$codadsense1 = '<br />
<span style="color: #ff0000;">&lt;script type="text/javascript"&gt;&lt;!--<br />
google_ad_client = "pub-XXXXXXXXXXXXXXXX";<br />
google_ad_slot = "XXXXXXXXXXX";<br />
google_ad_width = 468;<br />
google_ad_height = 60;<br />
//--&gt;<br />
&lt;/script&gt;<br />
&lt;script type="text/javascript"<br />
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;<br />
&lt;/script&gt;</span>';<br />
echo $codadsense1;<br />
?&gt;</code></p>
<p>Como podem ver é muito simples. A vermelho está o código do Adsense, código este que está envolvido nos comandos <em>php</em> que vão fazer com que tudo funcione na perfeição. Se quiserem experimentar esta técnica basta substituírem o código a vermelho pelo vosso próprio código do Adsense.</p>
<p>Agora se quiserem tornar a repetir a exibição desse mesmo anúncio noutro local, é só colarem na nova posição pretendida o seguinte:</p>
<p><code>&lt;?php echo $codadsense1;?&gt;</code></p>
<p>Podem colocar outros anúncios diferentes também. Por exemplo se quisessem colocar um outro anúncio, diferente do primeiro, com dimensões 300&#215;250, noutra posição diferente do blog, tinham que ter o cuidado de mudar não só o código do Adsense mas também o <code>$codadsense1</code> teria que passar por exemplo para <code>$codadsense2</code>:</p>
<p><code>&lt;?php<br />
$codadsense<strong>2</strong> = '<br />
<span style="color: #ff0000;">&lt;script type="text/javascript"&gt;&lt;!--<br />
google_ad_client = "pub-XXXXXXXXXXXXXXXX";<br />
google_ad_slot = "XXXXXXXXXXX";<br />
google_ad_width = 300;<br />
google_ad_height = 250;<br />
//--&gt;<br />
&lt;/script&gt;<br />
&lt;script type="text/javascript"<br />
src="http://pagead2.googlesyndication.com/pagead/show_ads.js"&gt;<br />
&lt;/script&gt;</span>';<br />
echo $codadsense<strong>2</strong>;<br />
?&gt;</code></p>
<p>E é assim que tenho aplicado os anúncios Adsense nos meus blogs. Consigo colocar os anúncios em posições que aumentam bastante o CTR, pois os anúncios passam a ficar muito mais integrados no layout, parecendo fazer parte dele, o que leva a que as pessoas cliquem mais neles.</p>
<p>E vocês? Como é que colocam anúncios Adsense nos vossos blogs?
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/colocar-anuncios-adsense-no-wordpress/feed/</wfw:commentRss>
		<slash:comments>3</slash:comments>
		</item>
		<item>
		<title>Botões de divulgação Twitter, Facebook e Google +1</title>
		<link>http://comofazerumsite.com/blog/botoes-de-divulgacao-twitter-facebook-e-google-1/</link>
		<comments>http://comofazerumsite.com/blog/botoes-de-divulgacao-twitter-facebook-e-google-1/#comments</comments>
		<pubDate>Thu, 04 Aug 2011 16:27:29 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Blogger]]></category>
		<category><![CDATA[Design]]></category>
		<category><![CDATA[Divulgação]]></category>
		<category><![CDATA[Redes Sociais]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[botões redes sociais]]></category>
		<category><![CDATA[facebook]]></category>
		<category><![CDATA[google +1]]></category>
		<category><![CDATA[redes sociais]]></category>
		<category><![CDATA[twitter]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=697</guid>
		<description><![CDATA[Ainda há alguém que não use botões de divulgação?
Com o enorme crescimento de algumas redes sociais, é cada vez mais importante que os leitores de um site/blog possam partilhar com os amigos aquilo de que gostam. É para isso que existem os botões de social bookmarking. E os sites e blogs só têm a ganhar com isso, pois o tráfego muitas vezes pode aumentar substancialmente.
Eu já tinha feito um post sobre como instalar o botão de divulgação do Twitter. Mas depois apareceu o botão &#8220;Gosto&#8221; do Facebook e mais recentemente ...]]></description>
			<content:encoded><![CDATA[<p>Ainda há alguém que não use botões de divulgação?</p>
<p><!--adsense#1-->Com o enorme crescimento de algumas redes sociais, é cada vez mais importante que os leitores de um site/blog possam partilhar com os amigos aquilo de que gostam. É para isso que existem os botões de social bookmarking. E os sites e blogs só têm a ganhar com isso, pois o tráfego muitas vezes pode aumentar substancialmente.</p>
<p>Eu já tinha feito um post sobre como instalar o botão de divulgação do Twitter. Mas depois apareceu o botão &#8220;Gosto&#8221; do Facebook e mais recentemente o botão &#8220;+1&#8243; do Google, que podem também ser fundamentais para a estratégia de divulgação dos nossos conteúdos nas redes sociais.</p>
<p>O código de cada um desses botões pode ser obtido em cada uma dessas redes sociais, mas o problema é quando vamos organizar todos esses botões no nosso layout. Os diferentes códigos podem não se deixar organizar facilmente, nomeadamente se os quisermos colocar todos seguidos organizados numa linha.</p>
<h3>Colocar os botões Twitter, Facebook e &#8220;+1&#8243;, de uma só vez</h3>
<div style="float: right;"><a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/08/facebook-twitter-google-1.jpg"><img src="http://comofazerumsite.com/blog/wp-content/uploads/2011/08/facebook-twitter-google-1.jpg" alt="" title="facebook-twitter-google-1" width="242" height="223" class="aligncenter size-full wp-image-717" /></a></div>
<p>É isso que quero partilhar convosco. Os mais atentos já devem ter reparado numa linha de botões aqui no blog, no topo e no fundo de cada post, com botões <em>Google +1</em>, <em>Twitter</em>, <em>Share</em> e <em>Gosto</em> do Facebook. Instalei ontem, e fiquei impressionado com a facilidade com que de uma assentada só temos todos os botões devidamente posicionados, em linha, prontos a cumprir a sua função.</p>
<p>Trata-se de um serviço chamado <a rel="nofollow" href="http://www.linksalpha.com/auth/login?display=signup&amp;partner=96325b818a14c853fbe6c436a90a4f41" target="_blank">LinksAlpha</a>, que simplifica enormemente a tarefa. Podemos não só colocar os botões &#8220;+1&#8243;, &#8220;Twitter&#8221; e &#8220;Facebook&#8221;, mas também os botões das redes sociais &#8220;Inshare&#8221; e &#8220;Digg&#8221; e &#8220;StumbleUpon&#8221;. Não precisamos de pagar nada para termos os botões no nosso site/blog.</p>
<p>O <em>LinksAlpha</em> oferece também a possibilidade de publicarmos o nosso RSS automaticamente para dezenas de redes sociais, que até pode ser uma ferramenta excelente, mas confesso que não explorei, para já fiquei satisfeito com os botões.</p>
<h3>Como instalar os botões?</h3>
<p>Os botões podem ser instalados em sites a partir de um pequeno código <em>iframe</em> que o LinksAlpha nos dá. Pode ser instalado na plataforma Blogger e também no WordPress, neste caso temos que instalar o plugin.</p>
<p>Os códigos de instalação e o plugin estão disponíveis <a rel="nofollow" href="http://www.linksalpha.com/widgets/clickngo" target="_blank">aqui</a>. Instalei  o código para <em>websites</em> no <a href="http://comofazerumsite.com">Como Fazer Um Site</a>, podem ver como ficou. E instalei o plugin aqui no blog, que a esta altura já devem ter visto, no topo e no fundo dos posts.</p>
<p>Seja site ou blog, com código ou com plugin, podemos sempre configurar quais os botões que queremos que apareçam. Podemos também definir onde queremos que a linha de botões apareça, no topo e no fundo, só no fundo, na homepage e nos posts, só nos posts, etc.</p>
<p>Outra vantagem é que como os botões são carregados num iframe a nossa página não leva mais tempo a abrir.<br />
Achei muito interessante, é gratuito e não é preciso sequer registar-se.</p>
<p>Experimentem e deixem o vosso feedback! <img src='http://comofazerumsite.com/blog/wp-includes/images/smilies/icon_wink.gif' alt=';)' class='wp-smiley' />
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/botoes-de-divulgacao-twitter-facebook-e-google-1/feed/</wfw:commentRss>
		<slash:comments>7</slash:comments>
		</item>
		<item>
		<title>Posts relacionados com imagens</title>
		<link>http://comofazerumsite.com/blog/posts-relacionados-com-imagens/</link>
		<comments>http://comofazerumsite.com/blog/posts-relacionados-com-imagens/#comments</comments>
		<pubDate>Tue, 15 Feb 2011 20:02:40 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Blogger]]></category>
		<category><![CDATA[Widgets]]></category>
		<category><![CDATA[Wordpress]]></category>
		<category><![CDATA[linkwithin]]></category>
		<category><![CDATA[nrelate]]></category>
		<category><![CDATA[posts relacionados]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=486</guid>
		<description><![CDATA[O widget de posts relacionados com imagens, é um widget muito simples de instalar, que vai aparecer no final de cada post, que sugere links para outros posts aos visitantes do seu blog, posts que podem ser do interesse deles.
O widget é bastante apelativo não só porque selecciona automaticamente outros posts com assuntos relacionados com o post que está a ser visualizado, mas também porque apresenta imagens (thumbnails) juntamente com os links. Estas imagens que são apresentadas juntamente com o título dos posts permitem dar rapidamente ao leitor uma melhor ...]]></description>
			<content:encoded><![CDATA[<p>O widget de <strong>posts relacionados com imagens</strong>, é um widget muito simples de instalar, que vai aparecer no final de cada post, que sugere links para outros posts aos visitantes do seu blog, posts que podem ser do interesse deles.</p>
<p>O widget é bastante apelativo não só porque selecciona automaticamente outros posts com assuntos relacionados com o post que está a ser visualizado, mas também porque apresenta imagens (thumbnails) juntamente com os links. Estas imagens que são apresentadas juntamente com o título dos posts permitem dar rapidamente ao leitor uma melhor ideia do conteúdo dos posts relacionados.</p>
<p>Este widget tão simples pode aumentar significativamente as páginas visitadas, ao manter os visitantes a explorar os conteúdos relacionados, oferecendo-lhes alguns posts antigos que de outro modo provavelmente permaneciam esquecidos nos arquivos do blog.</p>
<p>Destaco dois dos serviços gratuitos que conheço que geram os posts relacionados com imagens, que descrevi acima:</p>
<ul>
<li><a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/linkwithin2.jpg"><img class="alignleft size-full wp-image-489" title="linkwithin2" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/linkwithin2.jpg" alt="" width="152" height="42" /></a>Um desses serviços é o <strong>LinkWithin</strong> que tenho usado num dos meus blogs, há mais de um ano, e sempre funcionou muito bem. Já muita gente conhece e usa. É um serviço que você quase de certeza já encontrou em algum blog por aí. Pode ser usado tanto na plataforma do Blogger como no WordPress. Para o instalar basta visitar o site <a rel="nofollow" href="http://www.linkwithin.com" target="_blank"><strong>LinkWithin</strong></a>, preencher um formulário muito simples, clicar em &#8220;Get Widget!&#8221; e seguir as instruções. Para o Blogger é fornecido uma porção de código que é colocado no blog, enquanto para o WordPress tem que se fazer download do plugin Linkwithin e instalá-lo na nossa plataforma. Veja no final deste post o plugin do Linkwithin em funcionamento. Tem o aspecto da seguinte imagem:<br />
<a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/linkwithin.jpg"><img title="linkwithin" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/linkwithin.jpg" alt="" width="400" height="224" /></a></li>
</ul>
<ul>
<li><a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/nrelate.jpeg"><img class="alignleft size-full wp-image-490" title="nrelate" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/nrelate.jpeg" alt="" width="90" height="90" /></a>A outra opção que funciona apenas para quem tem WordPress em alojamento próprio, é o <a rel="nofollow" href="http://nrelate.com/" target="_blank"><strong>NRelate</strong></a>. Trata-se de um plugin que faz basicamente o mesmo que o LinkWithin, mas as imagens são armazenadas no alojamento do próprio blog, o que pode ter vantagens em termos de SEO. A instalação faz-se de uma forma muito simples na plataforma do WordPress. Basta ir à secção de Plugins, pesquisar por &#8220;nrelate&#8221; e instalar. Depois é só ir à secção do <strong>NRelate</strong> na barra lateral da plataforma, do lado esquerdo, e configurar. Pode substituir a frase &#8220;You may also like&#8221; por &#8220;<strong>Poderá também gostar de</strong>&#8220;. Pode ainda definir o número de thumbnails que deseja que apareçam. Enquanto no Linkwithin só é possível configurar uma linha de thumbnails, no NRelate pode-se optar por duas linhas de links com imagens. Veja o seguinte exemplo:<br />
<a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/nrelate2.jpg"><img title="nrelate2" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/nrelate2.jpg" alt="" width="523" height="404" /></a></li>
</ul>
<p>E você? Já usa algum destes serviços ou conhece algum outro idêntico a estes?
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/posts-relacionados-com-imagens/feed/</wfw:commentRss>
		<slash:comments>6</slash:comments>
		</item>
		<item>
		<title>Como aplicar uma Marca d’Água</title>
		<link>http://comofazerumsite.com/blog/como-aplicar-uma-marca-dagua/</link>
		<comments>http://comofazerumsite.com/blog/como-aplicar-uma-marca-dagua/#comments</comments>
		<pubDate>Sun, 13 Feb 2011 22:08:13 +0000</pubDate>
		<dc:creator>avelino</dc:creator>
				<category><![CDATA[Editar Imagens]]></category>

		<guid isPermaLink="false">http://comofazerumsite.com/blog/?p=531</guid>
		<description><![CDATA[Uma marca d&#8217;água pode ser criada facilmente com o PhotoScape, um programa gratuito que já foi divulgado aqui no blog. Claro que há muitos outros programas onde isso pode ser feito, mas no PhotoScape algumas tarefas estão bastante simplificadas e acessíveis a qualquer webmaster. Estou convencido que mesmo os webmasters que dominam outros programas mais avançados, como por exemplo o PhotoShop, reconhecem a facilidade com que se fazem certas operações simples no PhotoScape. E o PhotoScape tem a grande vantagem de ser gratuito. Normalmente quem tem um site ou blog ...]]></description>
			<content:encoded><![CDATA[<p>Uma marca d&#8217;água pode ser criada facilmente com o <a href="http://comofazerumsite.com/blog/photoscape-editor-de-imagens-gratis/">PhotoScape, um programa gratuito</a> que já foi divulgado aqui no blog. Claro que há muitos outros programas onde isso pode ser feito, mas no PhotoScape algumas tarefas estão bastante simplificadas e acessíveis a qualquer webmaster. Estou convencido que mesmo os webmasters que dominam outros programas mais avançados, como por exemplo o PhotoShop, reconhecem a facilidade com que se fazem certas operações simples no PhotoScape. E o PhotoScape tem a grande vantagem de ser gratuito. Normalmente quem tem um site ou blog não precisa mais do que fazer pequenos ajustes a fotos e imagens, redimensionar, aplicar alguns efeitos&#8230;</p>
<p>Mas vamos então ver como se cria e aplica uma marca d&#8217;água através do PhotoScape.</p>
<p>Em primeiro lugar é necessário <strong>criar a marca d&#8217;água</strong>. Essa marca d&#8217;água pode ser na forma de texto (uma palavra ou pequena frase) ou um logotipo. Vamos supor que queríamos criar uma marca d&#8217;agua com o texto &#8220;Como Fazer Um Site&#8221;. Siga as seguintes instruções:</p>
<ol>
<li>abrir o PhotoScape</li>
<li>seleccionar o &#8220;Editor de fotografias&#8221;</li>
<li>clicar em &#8220;Nova Fotografia&#8221;</li>
<li>escolher a largura e altura (para este exemplo escolheu-se 200&#215;200)</li>
<li>no separador &#8220;Objecto&#8221; clicar no botão para texto</li>
<li>introduzir na caixa de texto, o texto pretendido, e restantes configurações do texto, tamanho da letra, estilo, etc (no nosso exemplo escolheu-se tamanho 22, estilo Thaloma)</li>
<li>clicar em ok, e rodar o texto directamente na imagem da marca d´água</li>
<li>guardar a marca d&#8217;água na pasta C:\Programas\Photoscape\texture\paper , no formato JPG e com o nome &#8220;marca_de_agua&#8221;.</li>
</ol>
<p><center><a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/photoscape.jpg"><img title="photoscape" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/photoscape.jpg" alt="" width="563" height="513" /></a></center></p>
<p style="margin-top: 30px;">
<p>A partir deste ponto poderá <strong>aplicar a marca d&#8217;água</strong> que acabou de criar a todas as fotos que quiser. Vamos ver como se faz:</p>
<ol>
<li>abrir uma foto na qual quer aplicar a marca d&#8217;água</li>
<li>seleccionar o separador &#8220;Início&#8221;</li>
<li>clicar em Filtro &gt; Textura &gt; marca_de_agua.jpg</li>
<li>guardar as alterações efectuadas</li>
</ol>
<p>Se tudo correu bem o resultado deverá ser algo como:</p>
<p><center><a href="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/cat-eye3.jpg"><img class="aligncenter size-full wp-image-533" title="cat-eye3" src="http://comofazerumsite.com/blog/wp-content/uploads/2011/02/cat-eye3.jpg" alt="" width="516" height="424" /></a></center><br />
Gostou deste pequeno tutorial?<br />
Conhece outra forma simples de aplicar uma marca d&#8217;água?
</p>
<p>
Siga-nos: <a href="http://www.twitter.com/comofazerumsite">Twitter</a> | <a href="http://www.facebook.com/pages/ComoFazerUmSite/202392893153778">Facebook</a></p>
]]></content:encoded>
			<wfw:commentRss>http://comofazerumsite.com/blog/como-aplicar-uma-marca-dagua/feed/</wfw:commentRss>
		<slash:comments>8</slash:comments>
		</item>
	</channel>
</rss>

