SEO para dispositivos móveis e outros dispositivos

Tablets

Ao pensar em como configurar seu website para usuários de dispositivos móveis, é comum lembrar-se de usuários que usam tablets para acessar seu site. Embora não haja recomendações específicas sobre a criação de websites otimizados para tablets e compatíveis com mecanismos de pesquisa, existem algumas dicas para criar websites 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 seu site exibe o mesmo código HTML para todos os dispositivos com regras diferentes de estilo de 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 website 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 seu site tenha páginas diferentes para usuários de computadores e smartphones, mas não tenha páginas específicas a tablet, conforme nossa experiência, os usuários de tablet esperam ver a versão do seu site para computador, e não para smartphone.

Se o website 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 websites para smartphones, sugerimos que você use o cabeçalho HTTP Vary.
  • URLs distintos dedicados a tablets: neste caso, recomendamos permitir que o Googlebot possa rastrear os URLs do tablet e usar um rel=”canonical" em cada URL de tablet para levar o usuário à página equivalente ao URL de computador.

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 os recursos necessários para acompanhar as consultas de mídia CSS, os webmasters que desejam veicular conteúdo nesses dispositivos precisam configurar os sites para usar a veiculação dinâmica ou URLs diferentes com o conteúdo de feature phones.

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 deve incluir o cabeçalho de resposta HTTP "Vary: User-Agent", e é importante levar em conta 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 com suporte para atender a usuários em computadores, smartphones e feature phones por meio de URLs distintos. Essas configurações usam as anotações que descrevemos 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:

  • 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 celulares convencionais.

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 têm URLs diferentes. 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 seria:

<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:

<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 móvel usará esse sinal para rastreamento.

Configuração de URLs separados para feature phones

Nesta configuração, um website 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 seria:

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

Em http://m.example.com/page-1, seria:

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

Redirecionamentos e o cabeçalho HTTP Vary

Caso seu site redirecione automaticamente os visitantes de dispositivos móveis que acessam a versão para computador para a versão para dispositivo móvel, ou vice-versa, configure seu 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…