ExpOn 2011 – Dicas de Otimização para Mobile

Pedro Dias deu dicas para Mobile

Olá leitores da Agência Mestre!

Quem compareceu ao ExpOn sabe que as maiores feras do SEO mundial estavam presentes no evento. Acompanhamos a apresentação do nosso amigo português Pedro Dias, que trabalha no Google, sobre Dicas de Otimização Para Mobile. O objetivo da palestra foi conscientizar os webmasters da importância de uma versão otimizada para celulares e outros dispositivos móveis.

O primeiro tema abordado foi o crescimento da utilização de dispositivos móveis em todo o mundo. Segundo uma pesquisa realizada pela Morgan Stanley, até 2014 teremos mais usuários em mobile do que em desktops convencionais.

Os smartphones estão sempre conosco, sempre ligados e sempre conectados. As pessoas utilizam o celular para acessar a Internet enquanto fazem compras, em filas de bancos, nos transportes públicos, na cama antes de dormir e até mesmo no banheiro!

Após deixar bem claro a importância do smartphone em nossas vidas, Pedro seguiu sua palestra explicando a importância de ter um site preparado para mobile. Uma definição importante é a diferença entre “Feature phones” e “Smartphones”. Os “Feature” são os aparelhos mais antigos que utilizam WAP, WML, xHTML, cHTML etc. Já os “Smartphones” são aparelhos mais modernos, com sistemas operacionais próprios, como os celulares Android, iPhone, Windows Mobile, etc.

O celular tradicional (Feature phone) possui um índice próprio no Google e resultados customizado, enquanto o Smartphone recebe resultados iguais ao do desktop, incluindo a pesquisa universal, instant preview, etc. Os aparelhos tradicionais tendem a ser substituídos pelos mais modernos.

Outro ponto levantado é que a otimização para mobile deve ser feita dando ênfase à experiência do usuário. A pessoa que acessa a internet via mobile precisa de resultados rápidos, urgentes. A maioria das pesquisas em mobile são informacionais, navegacionais e locais. O usuário não tem tempo a perder, portanto o site deve ter uma versão para mobile leve, objetiva e sem frames ou javascripts que costumam travar em diversas situações.

Para configurar o seu site versão mobile utilizando a mesma URL, utilize o User Agent para mudar o conteúdo de acordo com o dispositivo que o usuário está acessando. É uma espécie de “cloaking permitido” baseado no user agent.

Se a intenção é utilizar URLs diferentes, use redirecionamentos 301 ou 302, evitando o uso de muito javascript, o que pode levar o usuário a uma experiência lenta e de má qualidade. Lembre-se de quão maior for o número de redirecionamentos, mais lento será o seu site. Não se esqueça também de tomar muito cuidado com as deep pages – faça os redirecionamentos terem a mesma profundidade das URLs originais do site.

Algumas dicas do Pedro Dias para a versão mobile do seu site:

O que fazer:

  • Informe de maneira Clara e Objetivas
  • Utilize Layout Simples;
  • Deixe visível a opção de retornar para a versão desktop (e vice e versa);
  • Não utilize Javascript;
  • Utilize o CSS para otimizar para telas pequenas;
  • Mantenha a URL curta. Exemplo: m.seusite.com.br;
  • Evite logins, registros ou outros tipos de interação semelhantes;
  • Evite frames ou qualquer outro elemento que deixe o site lento;
  • Verifique se o Google reconhece as suas URLs mobile:
    ** Utilize <!DOCTYPE html PUBLIC "-//WAPFORUM//DTD XHTML Mobile 1.0//EN" "http://www.wapforum.org/DTD/xhtml-mobile10.dtd"> no header do site;
  • Redimensione as imagens no servidor: quanto mais rápido seu site carregar, melhor;
  • Evite redirecionamentos automáticos, deixe o usuário escolher a versão que quer usar;
  • Utilize “tel:” para números de telefone. Funciona como o “mailto:”, criando um link que, quando clicado, liga para o número automaticamente. Muitas vezes a versão mobile é utilizada para encontrar telefones;
  • Crie um perfil no Google Analytics diferente da versão desktop.

O que não fazer:

  • Não faça cloaking bot<->user. (ex.: exibir conteúdo diferente para o bot do apresentado para o usuário);
  • Não utilize noindex;
  • Não bloqueie as URLs da versão mobile no robots.txt.

Algumas Perguntas Frequentes

– O Googlebot vai parar de indexar meu conteúdo se este estiver configurado para mobile?
R. Não.

– Quantas versões do site devo ter?
R. Para smartphone utilize a mesma versão do Desktop, apenas com alterações no CSS, pois o Google utiliza o mesmo índice. Para feature phones, utilize duas versões, sem se preocupar com conteúdo duplicado, pois os índices são diferentes.

– Como faço para checar o índice de feature phones?
R. Existem extensões para os navegadores que fazem isso.

De uma maneira geral, o Pedro deixou claro que a otimização para Mobile é extremamente importante e, assim como outras formas de otimização, não devem ser feitas pensando apenas em rankeamento, mas na experiência do usuário.

Receba Novidades

Insira seu email para receber novidades e dicas exclusivas da Agência Mestre!
Divulgue este artigo

4 Comentários para “ExpOn 2011 – Dicas de Otimização para Mobile”

  1. Pablo Ribeiro

    Muito bacana o SEO para mobile, podia sempre por mais artigos para versão mobile tmb e sempre uma ótima dica, e o evento deve ter sido muito bom rs

    Responder
  2. Douglas

    Realmente, agora com o crescimento de usuários com smartphones no Brasil e com a tendencia de diminuir os valores das tarifas, cada vez mais teremos pessoas acessando nossos sites por celulares e tablets. Estou a alguns dias buscando informações de como desenvolver teamplates específicos para este fim, como utilizo muito o Joomla! em meus trabalhos, se alguém puder me passar mais detalhes sobre como desenvolver este templates, agradeceria muito.
    Ótimo artigo! Parabéns!

    Responder
  3. Fernando

    Oi Ayana. Tenho trabalho com layouts responsivos e deste modo, se você desconsiderar os “Feature phones”, você não precisa se preocupar em criar urls diferentes, todo trabalho de exibição é feito com quem trata a exibição, no caso o CSS.

    Responder

Deixar um comentário

  • (não será publicado)

XHTML: Você pode usar estas tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>