Mobile Websites

Olá leitores da Agência Mestre,

Falador nato, o povo brasileiro vem investindo cada vez mais em um objeto, que podemos chamar de “desejo nacional”, o celular. Já ouvi diversas conversas contendo “qual o seu celular?”, “você tem um iPhone?” ou ainda, “seu celular entra na Internet?”. Esta última frase vem desaparecendo cada vez mais, refletindo o que alguns estudos mostram: um crescimento gigantesco na venda de smartphones, celulares com digamos, algo a mais. Com um aumento de 128%, o mercado de smartphones no Brasil vem impulsionando uma área um tanto já explorada nos nossos amigos americanos: a navegação da Internet.

É fato que está cada vez mais fácil para acessar o email, uma rede social ou um website através do smartphone. Não só os celulares estão melhores, mas as empresas tem notado que este é um nicho de usuários diferenciados e merece uma atenção especial, com páginas mais otimizadas em termos de velocidade e, em muitos casos, versões mais resumidas ou “enxutas” para não prejudicar a experiência do usuário.

É comum “brilhar nos olhos” de marketeiros ou agências web a criação de uma versão mobile, mostrando a super importância daquele público para a marca. Mas é ai que mora um dos maiores perigos, o problema de conteúdo duplicado entre as versões mobile e tradicional.

Entendendo o Problema

Existem casos onde produzimos duas versões do mesmo website, focando duas versões de visitantes: os oriundos de celular e os tradicionais (vamos considerar aqui desktop, netbook, notebook, tablets e etc). Desta forma fazemos a nossa publicidade em cima de “Acesse www.website.com para maiores informações” e, como somos uma empresa friendly para celulares, divulgamos: “Você utiliza celular? Visite m.website.com!”.

São duas versões do website, o mesmo conteúdo, oferecido para dois tipos de usuários, MAS você não se preocupou se um usuário tradicional poderia acessar a versão mobile. É, eles podem fazer isso se você não restringir o acesso a apenas browsers de mobile.

Versão Mobile para requisição de usuários

Assim como os usuários, o Googlebot também poderá acessar a sua versão mobile, desde que encontre um link, uma referência, para uma página hospedada dentro da versão mobile do seu website. Com isso, ele poderia ler, as duas versões, que são duas URLs, contendo o mesmo conteúdo, o famoso conteúdo duplicado que tanto falamos.

Versão mobile para Bots

Conteúdo Duplicado em Sites Mobile

Para identificar o problema é simples, basta possuir uma URL para a versão para mobile e outra para versão tradicional. Utilize o operador avançado site: no Google para ver quantas páginas (aproximadamente) ele já possui de cada versão.

Como exemplo, podemos testar o famoso serviço de check-ins, o Foursquare. Ele possui duas versões, o m.foursquare.com e o foursquare.com.

Fazendo a consulta para a versão Mobile temos o seguinte cenário:

Para a versão tradicional, excluindo a versão mobile, temos:

Com estes comandos conseguimos entender se o Googlebot possui acesso ao conteúdo mobile e até mesmo podemos ver quais são as URLs da versão mobile. Em seguida, faça o teste: clique nos resultados da versão mobile e confira se você possui acesso direto ao conteúdo. Caso possua o acesso sem nenhuma restrição, o domínio sofre com um “certo probleminha” de conteúdo duplicado.

É neste ponto que você pergunta: existe uma solução para o problema? Como proceder se eu identifiquei isto no meu website? Ou ainda, se preciso produzir um website com versão mobile, como tratar de forma correta os usuários?

A Solução para o Problema

Certa vez comentamos aqui na Agência Mestre sobre o que é Cloaking e como fazê-lo, e é aqui, neste tipo de caso, onde aplicamos de forma útil este tipo de técnica.

A técnica de Cloaking consiste em entregar conteúdos diferentes adequados para cada tipo de visitante do site, como o robot e um usuário qualquer.

Basicamente o que precisamos fazer é a verificação do browser do usuário, executando a seguinte decisão:
Fluxo de Decisão de Cloaking para Mobile

Com base neste fluxo de decisão, basta codificar uma espécie de verificador, baseado em uma lista de user-agents mobile, e executar os redirecionamentos (sempre usando 301) quando necessário. Uma boa dica para quem usa PHP é utilizar a classe chamada MobileUserAgent, a qual faz esta verificação baseada em uma lista de user-agents mobile.

Lista de User Agents para Mobile

Como vimos acima, dependemos de uma lista mostrando quais são os browsers de dispositivos mobile. Para isto existem dois websites autoritários na área. O User-agents.org é um website com uma listagem gigantesca de user-agents conhecidos. O lado ruim dele para nós é que ele não possui uma listagem apenas para user-agents de mobile. Já o website da Zytrax.com possui uma listagem de user-agents apenas de versões mobile.

Com esta lista é possível alimentar o nosso nosso script de detecção e assim atingir o maior número de versões mobile possível.

Conclusões

Apesar dos frequentes problemas relacionados a conteúdo duplicado que encontramos em websites com versão mobile, existe uma solução para o caso, a qual deve ser empregada, de preferência, antes da versão mobile do website ir para o ambiente de produção.

A grande dica que você deve guardar deste artigo é sempre que trabalhar em um projeto, onde existem várias formas de acessar o mesmo conteúdo, você deve lembrar sempre em prevenir que as diferentes URLs sejam lidas pelo Googlebot, produzindo conteúdo duplicado.

Créditos da imagem para Johan Larsson.