Logo E-Commerce Brasil

Otimização de sites para celulares

O mobile SEO ou otimização de sites para celulares vem crescendo em importância pelo aumento do uso de Internet em dispositivos moveis e pelo aumento de usuários de smartphones. Veja alguns dados que comprovam isso no Brasil:

  • A difusão dos smartphones atinge 14% da população brasileira;
  • 42% dos pesquisados acessam a Internet pelo menos uma vez por dia no smartphone;
  • Os smartphones são um ponto de aceso importante para a pesquisa na Internet. 50% de usuários fazem pesquisa em buscadores todos os dias;
  • 80% dos usuários de smartphones que participaram da pesquisa já procuraram informação sobre um produto ou serviço no celular.

Os dados apresentados acima foram tomados da apresentação feita por Google sobre o uso de Smartphones no Brasil, em maio 2012 . O Google tem muito interesse em que os sites se preparem para as pesquisas de celular, já que para eles é muito importante mostrar sites bons com conteúdo valioso nos resultados das pesquisas. Por esta razão, o Google tem criado vários sites com informação sobre a otimização de sites para pesquisas mobile e também alguns sites com informação sobre o comportamento de usuários mobile, como oMobile Planet. Este site é muito útil, já que proporciona muita informação e também oferece a opção aos usuários de criar gráficos como este:

Esta claro que ter um site preparado para receber visitas desde celulares é muito importante. Por isso, vou apresentar algumas soluções e dicas que vocês devem levar em consideração na hora de otimizar seu site para dispositivos móveis.

Google Analytics

Antes de começar com as mudanças, é necessário recopilar informação do tráfego que já está entrando no site desde dispositivos móveis e analisar se é factível investir neste tipo de otimização. O Google analytics contém muitos dados que podem responder as seguintes questões:

  • Qual é a porcentagem e tendência das visitas desde celular? Compensa ter um site especifico para celular? A tendência é de aumento? Se sim, então, mãs a obra!
  • Quais são os aparelhos mais utilizados (iPhone, galaxy, ipad, etc.)? Sabendo isto, poderemos otimizar o site para aquele aparelho mais utilizado por nossos visitantes.
  • Quais as palavras-chave que estão trazendo tráfego desde celulares? São as mesmas palavras que trazem trafego desde pesquisas de desktop? Devo criar páginas especificas para que o conteúdo seja mais relevante para as visitas desde celulares?
  • Quais páginas estão recebendo visitas desde celulares?

Algumas destas perguntas são fáceis de responder, já que o Google Analytics nos facilita essa informação em um dos relatórios padrão. Para ver as visitas desde dispositivos móveis, é só entrar seção Público-alvo > Celular > Dispositivos:

Além de identificar os dispositivos que mais acessam nosso site, podemos identificar seu sistema operacional, resolução de tela, etc. Com esta informaçãoo podemos priorizar nossas mudanças tendo certeza que a maioria do nosso público vai conseguir ver o site corretamente. Claro, se teu site tem pouca informação sobre visitas desde celular, você pode basear esta decisão nos dados proporcionados no site do Google Mobile Planet, vendo quais são os dispositivos mais populares no mercado.

Se quisermos identificar as palavras-chave, é só criar o segmento avançado descrito na imagem abaixo, entrando no relatório Fontes de tráfego > Origens > Pesquisa > Orgânico:

Além de identificar as palavras-chave, podemos comparar o tráfego orgânico mobile com o tráfego orgânico que não é. Para fazer esta comparação, vocês precisariam criar outro segmento avançado similar ao da imagem acima mudando a palavra “yes” por “no”.

Estudo de palavras-chave

É importante determinar que conteúdo do nosso site é mais procurado em pesquisas mobile. Vamos obter esta informação da ferramenta de palavras-chave do Google Adwords. Esta ferramenta dá a informação do numero de pesquisas por palavras e sugere outras palavras relacionadas que estão sendo utilizadas em pesquisas que você pode utilizar no site. A ferramenta permite ver os dados de pesquisas feitas em notebooks e celulares. Como estamos interessados na demanda de usuários mobile, devemos selecionar a opção “Todos os aparelhos celulares” no item Mostrar ideias e estatísticas para:

Analisando esta informação, podemos identificar produtos e conteúdo interessante para cada tipo de usuário. Digamos que temos um e-commerce onde vendemos vários produtos; entre eles, músicas, jogos e celulares. Fazendo um estudo de palavras-chave poderemos saber quais produtos são mais procurados por usuários mobile:

Palavra-Chave Pesquisas Móbile Pesquisas Sobremesa e Notebooks
comprar jogos 2900 pesquisas mensais 1900 pesquisas mensais
comprar musicas 880 pesquisas mensais 480 pesquisas mensais
comprar celular 880 pesquisas mensais 18,100 pesquisas mensais

Segundo os resultados da ferramenta, o produto da nossa loja mais procurado por usuários que usam PCs é celular e o produto mais procurado por usuários móbile são jogos. Esta informação nos indica que devemos ter certeza que nossa pagina de jogos esta bem otimizada para celulares, já que a oportunidade de obter tráfego e conversões é maior.

Analisar as páginas que recebem mais visitas por celular

Além de analisar o comportamento dos visitantes e palavras-chave, é importante revisar como nosso site é mostrado em dispositivos móveis e nos resultados de pesquisa.

Podemos ver as impressões que nosso site tem em pesquisas feitas desde celulares, utilizando o Google Webmaster Tools no relatório Tráfego > Consultas de Pesquisa, selecionando a opção celular dentro do filtro, como mostra a seguinte imagem:

Selecionando a opção celular, podemos ver o número de impressões em um período de tempo e quantos cliques nosso site recebeu. É muito importante saber como nosso site aparece nas pesquisas de Google para determinar se os títulos ou meta descrições devem ser melhorados para incrementar o CTR:

Além de ver como nosso site aparece nos resultados, devemos revisar a aparência do site nas telas dos celulares que mais geram visitas no nosso site. Uma ferramenta muito boa para testar o site em vários tipos de telas é o Screenfly: http://quirktools.com/screenfly/

Como vocês podem ver nas imagens acima, podemos testar nosso site em tablets, celulares, desktop e até em TVs. No design para celular é muito importante mostrar e-mail ou telefone acima da dobra para facilitar que os usuários entrem em contato com você. Lembre-se de testar, se tocando no numero ou e-mail na tela, o smartphone abre um novo e-mail o pergunta se você gostaria de fazer uma ligação.

Soluções para otimizar o site para mobile

Em geral, existem três formas de otimizar um site para mobile. A opção de ter um design responsivo é a solução preferida pelo Google, mas neste artigo, falarei sobre outras opções disponíveis – já que algumas vezes implementar esta opção não é viável.

1. Design responsivo

Uma URL com o mesmo conteúdo, só que mostrado de forma diferente dependendo do dispositivo: http://www.teusite.com/jogos

Esta solução consiste em modificar a versão original para equipes de tablet e notebook do seu site para que estas se adaptem à interfaces de dispositivos móveis,utilizando o CSS.

Esta solução tem várias vantagens. Uma delas é que não tem risco de criar um problema de conteúdo duplicado, já que a mesma URL, com o mesmo conteúdo, será mostrada aos usuários mobile. Também, esta solução economiza recursos tanto para o seu site, quanto para os indexadores do Google. Uma terceira vantagem é a consolidação de popularidade em uma URL. Isto quer dizer que todos os links que o seu site “original” ganhou ao longo do tempo, também beneficiarão a versão mobile e, finalmente, não há necessidade de implementar redirecionamentos, já que o algoritmo de Google deve detectar automaticamente esta configuração. E todos os robôs (tanto Googlebot e Googlebot-Mobile) são permitidos para rastrear o CSS, JavaScript e imagens do site.

Por outro lado, esta solução pode ter custos altos de implementação, já que tem uma grande probabilidade do site vai precisar de mudanças no design e layout. Também é importante levar em consideração que é bom evitar usar alguns elementos para que esta solução dê certo, por exemplo: imagens muito grandes, alguns vídeos e scripts, já que algumas vezes estes não podem ser mostrados de forma eficaz em navegadores móveis.

2. Publicação dinâmica

Nesta solução, o servidor precisa responder com um código HTML diferente: um para os usuários mobile e outro para os usuários de notebooks e tablets na mesma URL. Isto significa que os usuários e robôs mobile devem ver conteúdo e HTML específico para eles.

Esta solução também tem varias vantagens e desvantagens. Uma das vantagens é que não há risco de ter um problema de duplicação de conteúdo, já que o conteúdo para mobile e o conteúdo para PCs será mostrado na mesma URL. Igual que na solução anterior, esta opção oferece uma consolidação de popularidade com uma URL para ambas versões, já que todos os links que o site original ganhou ao longo do tempo também beneficiarão a versão móbile.

Uma vantagem desta opção é a flexibilidade para diferenciar conteúdo entre usuários e oferecer um conteúdo mais relevante para cada um. Isto permite que você mostre conteúdo relevante e interessante para cada tipo de usuário. Se sabemos que os usuários mobile gostam de jogos de carros, vamos mostrar mais jogos de carros para eles do que para o resto de usuários que entram por PCs.

As desvantagens desta solução é que não é fácil implementar,. Tem uma maior complexidade técnica para implementação, devido à identificação do agente de usuário e publicação dinâmica. Outra desvantagem são os custos de manutenção, tempo e esforço, já que é necessário manter duas versões de HTML para a mesma página.

Também é importante levar em consideração que quando seu site utiliza a solução de publicação dinâmica, o Google recomenda utilizar o cabeçalho HTTP “Vary User-Agent” para ajudar Googlebot descobrir seu conteúdo mobile mais rápido. Também devem ter a  certeza que está fornecendo o mesmo conteúdo para usuários robôs mobile – se não for mostrado o mesmo conteúdo, o Google pode considerar como Cloaking. Para verificar se o mesmo conteúdo é mostrado, utilize estas ferramentas:

  • No Google Webmaster Tools a ferramenta “Buscar como Google”, utilizando a opção Googlebot Móbile – smartphone;
  • Verifique o HTML que é mostrado para usuários mobile com ferramentas como oScreenfly.

3. Site paralelo

http://www.teusite.com/jogos                                              http://m.teusite.com/jogos

Dois URLs: Uma para usuários e Robôs de busca móbile e outra para usuários e robôs de busca de equipos de sobre mesa e notebooks

Geralmente, os sites paralelos focados em usuários mobile são inseridos em um subdomínio ‘m’, e tem um design e conteúdo direcionado para usuários móbile. Nesta opção é necessário utilizar um  redirecionamento HTTP 301 para “enviar” para cada tipo de usuário a sua versão correspondente.

A principal vantagem desta solução é a facilidade de implementação, já que não precisa fazer nenhuma alteração no site original. Ela também oferece a possibilidade de diferenciar o conteúdo mobile do conteúdo no site original e cada site vai ter uma interface e design apropriado para cada tipo de usuário.

Até aqui, esta solução parece ser a mais fácil e melhor, mas ter dois sites significa uma divisão de popularidade e autoridade. Como estamos utilizando um subdomínio, toda a autoridade que o site original tem não vai “ajudar” a versão mobile. Provavelmente, seu site mobile não vai ter a mesma visibilidade nos buscadores que seu site original tem e vai precisar de um processo de criação de links independente.

Além desta grande desvantagem, há um risco de duplicação de conteúdo – a versão móvel pode mostrar o mesmo conteúdo que é mostrado no site original. E, finalmente, ter dois sites também significa maior esforço e custos de manutenção.

Para solucionar ou prevenir o problema de conteúdo duplicado, é necessário adicionar etiquetas link rel = “canonical” nas URLs mobile, apontando para as URLs da versão original. Além destas etiquetas, é necessário inserir etiquetas link rel = “alternate” nas URLs da versão original. Cada etiqueta deveria apontar a URLs correspondente na versão mobile, assim Google vai saber que esa URL é uma versão alternativa da versão original.

As rel=”alternate” podem ser inseridas no HTML ou no sitemap como neste exemplo:

<?xml version="1.0" encoding="UTF-8"?>
<urlset xmlns="http://www.sitemaps.org/schemas/sitemap/0.9"
xmlns:xhtml="http://www.w3.org/1999/xhtml">
<url>
<loc>http://www.teusite.com/jogos/</loc>
<xhtml:link
rel="alternate"
media="only screen and (max-width: 640px)"
href="http://m.teusite.com/jogos" />
</url>
</urlset>

Google também recomenda utilizar o cabeçalho HTTP “Vary User-Agent” para ajudar Googlebot a descobrir seu conteúdo mobile mais rápido e criar um sitemap XML para os robôs mobile, inserindo só as URLs no subdomínio ‘m’.

Conclusões finais

O tráfego desde dispositivos móveis representa uma oportunidade muito atraente para os negócios online, mas é fundamental estabelecer de forma eficaz sua estratégia online dependendo das demandas de teus clientes, características do teu negocio e restrições.

O objetivo da otimização de um site para pesquisas mobile é conseguir um retorno sobre o investimento, por isso é importante verificar se os benefícios são maiores do que os custos relacionados com a implementação destas recomendações.

Também é importante levar em consideração que os resultados de SEO são vistos a longo prazo. No entanto, é fundamental acompanhar os resultados cada mês com as mesmas ferramentas usadas no início do processo: o Google Webmaster Tools para verificar as páginas e visibilidade das palavras-chave nos resultados da pesquisa e do Google Analytics para verificar o tráfego orgânico móvel entrando no nosso site.