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.
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.
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:
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.
Estava procurando exatamente isso!
Valeu Ricotta! belo post
Muito bom o artigo!
Vejo ainda uma outra possibilidade: a utilização dos CSS Media Types, onde vc faz somente 2 folhas de estilo, uma para cada dispositivo, sem precisar refazer todo o website e não ter conteúdo duplicado.
O Media Type “screen” pode ser usado para smartphones e o Media Type handheld para celulares menores.
😉
Oi Renatinha, valeu pelo comentário.
Sobre a questão do uso de CSS complica quando você tem um hotsite em Flash e aí eles normalmente fazem uma versão mobile sem Flash. Este é um caso de um curso in-company que demos nas últimas semanas. Daí não teria como aplicar a idéia de folhas de estilo para mobile.
Muito bom artigo, obrigado pelo esclarecimento. Em meu celular acontecia isso e ficava ruim as vezes até falava que a pagina é muito pesada etc…
Obrigado pela Dica !
Fábio estou uma dúvida, e se bloquear o acesso a versão mobile pelo robots.txt? Isso na questão do conteúdo duplicado apenas… ou colocar um no-index resolve?
Fazendo essa pergunta me surgiu uma outra interrogação, será que um dia o google vai mostrar os seus resultados de busca de forma diferente no celular e no pc? Por exemplo, o google poderia identificar que estou fazendo uma busca via smartphone e mostrar resultados de paginas feitas para celular, seria super relevante…. nao sei se já existe isso, se estou viajando muito… talvez alguem aqui saiba algo a respeito!
Parabéns pelos posts, acompanho a mestre diariamente!
Opa, Fábio. Obrigado.
Isso responde melhor a dúvida que deixei naquele SearchCast. Eu tinha receio exatamente do Google identificar o Cloaking de alguma forma e não gostar disso.
Fazendo dessa forma eu não preciso me preocupar com rel-canonical?
rel=canonical também seria uma alternativa válida?
No meu caso não vamos ter domínios nem endereços diferentes para móbile ou para deskops.
O que posso fazer? Tem algum problema?
Olá. Estamos criando uma versão mobile para o site da seguinte forma… para cada página do site, temos uma correspondente dentro d pasta “m”. as páginas da versão tradicional possui um script de redirecionamento, e cada vez que alguem entra nestas páginas pelo celular, é automaticamente redirecionado para a versão mobile da mesma página.
eu poderia simplesmente bloquear a busca pelo google e outros robots nessas páginas mobile?
porque se aparece a página tradicional no google, a mobile não precisaria aparecer, pois aquela que já aparece redirecionaria a pessoa automaticamente…
vou usar exemplos, para tentar ser mais claro…
a pessoa busca “imobiliarias em itapema”… Tanto no celular quanto nos PCs, é provavel que aparecesse as duas versões, correto?
então eu bloquearia essa versão mobile para o google, e ele mostraria apenas como resultado a versão tradicional… Essa por sua vez, serviria para ambos usuários, pois se ele entra pelo PC, acessaria o site normal, e se entra pelo celular, seria redirecionado…
Estou certo? É possível se fazer isso? Qual a maneira mais simples de se conseguir fazer isso?
Obrigado desde já
Utilizando na criação do site layout responsivo não tem esse problema, certo?
Fabio responde as perguntas acima se possível, são duvidas que eu também possuo. Obrigado