Como gerar e usar Anúncios Responsivos do AdSense no Blog

Uma tendência crescente entre sites e Blogs nos últimos anos são os formatos de layouts Responsivos, aqueles que se ajustam automaticamente ao tipo de tela que o visitante está navegando, sem desconfigurar o conteúdo. O problema são os elementos que não seguem padrões e estilos do layout, como os blocos de anúncios do AdSense. Mas agora é possível usar anúncios e banners do AdSense que são ajustáveis, ao estilo responsivo.

Neste tutorial quero mostrar como usar os blocos de anúncio responsivo do AdSense e como colocar em seu Blog.

Nós já publicamos aqui uma série de artigos sobre o que são Layouts Responsivos (Responsive Design). Este é o melhor formato de layout que o seu Blog pode ter, uma vez que ele será exibido sem problemas tanto na tela de computadores, quanto em tablets ou smartphones. E isso sem precisar criar um aplicativo ou mesmo ter um layout exclusivo para aparelhos móveis.

• O que é e a importância de um Layout Responsivo para blogs: Responsive design

Se você quiser fazer o teste, pode acessar o [Ferramentas Blog] diretamente pelo seu celular ou tablet para ver que o conteúdo se ajusta ao seu tipo e tamanho de tela.

• Seu Blog está pronto para aparelhos móveis?

Como usar anúncios responsivos do AdSense

Se você já tem um layout responsivo em seu blog e está monetizando com o AdSense, pode ser interessante usar este novo recurso (que ainda é beta) para exibir os blocos de banner de forma ajustável em seu blog, sem desconfigurar na hora que o visitante acessar via aparelhos de telas médias e pequenas.

Uma mudança simples assim pode até garantir mais e melhores cliques nos anúncios e gerar mais receita para você. Claro que a principal vantagem é a usabilidade para o visitante.

1. A primeira coisa a fazer é entrar em sua conta do AdSense, clicar no menu “Meus anúncios” e depois clicar no botão “Novo bloco de anúncios”:

2. Na janela que abrir, você já terá as opções de criação do novo bloco.
O mais importante é o “Tamanho do anúncio”. Nessa caixa você vai escolher a opção que diz “Bloco de anúncios responsivo (BETA)”:

3. Agora é terminar de completar as opções de criação conforme seu gosto. Feito isso, clique no botão para salvar e gerar o código.
Na janela que abrir você terá o código. Não faça alterações nele. É ele que você vai copiar e colar onde deseja que o anúncio seja exibido.

Uma dúvida que surge sempre é: “Mas como vou saber se o anúncio vai servir no espaço que quero?”
Não precisa se preocupar com isso, justamente porque o código do AdSense vai determinar qual o tamanho que melhor se ajusta àquele espaço. Recomendamos esse formato para os blocos que vão dentro do conteúdo, junto ao artigo/texto, perto dos títulos ou mesmo no rodapé ou topo de páginas.

Na barra lateral (sidebar) nem sempre é necessário, já que a maioria dos layouts responsivos tendem a eliminar os menus e sidebars, ou jogar essas informações para o final, sem prejudicar os formatos.

Para quem entende um pouco mais de códigos e que aprofundar mais sobre esse uso do AdSense Responsivo, pode ver também o tutoria do Leandro Oriente: AdSense Responsivo e algumas notas.