SEO para dispositivos móveis e outros dispositivos

Tablets

Ao pensar em como configurar o site para usuários de dispositivos móveis, é comum lembrar-se dos visitantes que usam tablets para acessar o site. Embora não haja recomendações específicas sobre a criação de sites otimizados para tablets e compatíveis com mecanismos de pesquisa, existem algumas dicas para criar sites para a exibição em computadores, smartphones e tablets.

Web design responsivo

Nossa recomendação geral é a utilização do Web design responsivo. Isso significa que o site usará o mesmo código HTML para todos os dispositivos com diferentes regras de estilos CSS para otimizar a interface do site em computadores, smartphones e tablets.

Se você usar o Web design responsivo em seu site, teste-o em tablets de tipos variados para verificar se o site é processado corretamente. Assim como smartphones, também há tablets com diferentes tamanhos e resoluções de tela.

Conteúdo específico ao dispositivo

Um site pode retornar páginas diferentes (HTML, CSS, JavaScript etc.) em dispositivos diferentes. Essas páginas podem ser exibidas no mesmo URL (configuração chamada exibição dinâmica) ou em URLs específicos e distintos.

Caso o site tenha páginas diferentes para usuários de computadores e smartphones, mas não tenha páginas específicas para tablet, conforme nossa experiência, os usuários de tablet esperam ver a versão do site para computador, e não para smartphone.

Se o site tiver sites otimizados para tablet, estas diretrizes poderão ajudar você a configurá-lo:

  • Exibição dinâmica: com ela, os mesmos URLs são exibidos para usuários de computador, smartphones e tablets. Dependendo do user agent, essa exibição pode fornecer HTML e CSS diferentes. Como descrito nas recomendações dos sites para smartphones, sugerimos que você use o cabeçalho HTTP Vary.
  • URLs distintos e específicos para tablet: neste caso, sugerimos que você permita que o Googlebot indexe os URLs para tablet e use um rel="canonical" em todos esses URLs para indicar o URL para computador equivalente.

Feature phones

Nossa recomendação para os sites que atendem usuários de smartphones é a utilização do Web design responsivo, se possível. No entanto, como os feature phones não têm um recurso para acompanhar as consultas de mídia CSS, os webmasters que quiserem exibir nesses feature phones precisarão configurar seus sites para usar exibição dinâmica ou URLs distintos na publicação do conteúdo do feature phone.

Também recomendamos que as páginas compatíveis com feature phones incluam a tag <link rel="alternate" media="handheld"> conforme descrito abaixo.

Esta seção demonstra como implementar cada uma dessas configurações.

Veiculação dinâmica

Ao configurar o servidor a fim de veicular dinamicamente um conteúdo otimizado para feature phones com o mesmo URL de outros dispositivos, você usa a mesma implementação da veiculação em smartphones. O servidor precisa incluir o cabeçalho de resposta HTTP Vary: User-Agent, e é importante considerar os problemas comuns ao detectar user agents. Além disso, inclua a seguinte tag na sua página:

<link rel="alternate" media="handheld" href="[current page URL]" />

URLs diferentes

Os webmasters dispõem de três configurações compatíveis para atender a usuários em computadores, smartphones e feature phones por meio de URLs distintos. Essas configurações usam as anotações descritas anteriormente para a criação de sites otimizados para smartphones e feature phones.

Configuração de URLs específicos

Nesta configuração, as definições seriam as seguintes:

  • http://www.example.com/page-1 é usado para usuários de computador.
  • http://m.example.com/page-1 é usado para usuários de smartphones.
  • http://phone.example.com/page-1 é usado para usuários de feature phones.

Nessa configuração, recomendamos que as seguintes anotações sejam adicionadas para ajudar nossos algoritmos a compreender a relação entre páginas equivalentes que segmentam dispositivos diferentes:

Em www.example.com/page-1, adicione:

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page-1" />
<link rel="alternate" media="handheld" href="http://phone.example.com/page-1" />

Em m.example.com/page-1, adicione:

<link rel="canonical" href="http://www.example.com/page-1" />

Em phone.example.com/page-1, adicione:

<link rel="canonical" href="http://www.example.com/page-1" />

Configuração de URLs para computadores e todos os dispositivos móveis

Nesta configuração, um site usa um URL para os computadores e outro para todos os dispositivos móveis, ou seja, smartphones e feature phones. Por exemplo:

  • http://www.example.com/page-1 é usado para usuários de computador.
  • http://m.example.com/page-1 é usado para usuários de smartphones e feature phones.

Nesse caso, a anotação em http://www.example.com/page-1 é a seguinte:

<link rel="alternate" media="only screen and (max-width: 640px)" href="http://m.example.com/page-1" />
<link rel="alternate" media="handheld" href="http://m.example.com/page-1" />

Na página m.example.com, inclua a seguinte tag:

<link rel="canonical" href="http://www.example.com/page-1" />

Esse rel="canonical" precisa ser incluído, independentemente se elas são páginas de feature phones / smartphones ou não.

O servidor deve incluir o cabeçalho HTTP Vary: User-Agent na resposta. Isso envia aos caches de Internet e ao Googlebot o sinal de que a resposta do servidor pode diferir com base no user agent. O Googlebot usa esse sinal para rastreamento.

Configuração de URLs separados para feature phones

Nesta configuração, um site atende a computadores e smartphones em um URL usando o Web design responsivo ou a exibição dinâmica e os feature phones com um URL distinto. Por exemplo:

  • http://www.example.com/page-1 é usado para usuários de computador e smartphones.
  • http://m.example.com/page-1 é usado para usuários de feature phones.

Nesse caso, a anotação em http://www.example.com/page-1 é a seguinte tag:

<link rel="alternate" media="handheld" href="http://m.example.com/page-1" />

A anotação em http://m.example.com/page-1 é a seguinte tag:

<link rel="canonical" href="http://www.example.com/page-1" />

Redirecionamentos e o cabeçalho HTTP Vary

Caso o site redirecione automaticamente os visitantes de dispositivos móveis que acessam a versão para computador para a versão para dispositivos móveis, ou vice-versa, configure o servidor de modo a incluir o cabeçalho HTTP Vary.

Sitemaps

Nossas recomendações quanto ao uso de sitemaps de feature phone e sitemaps para URLs alternativos de smartphone permanecem as mesmas.

Enviar comentários sobre…