Guia para site Mobile

Confira dicas sobre como desenvolver, otimizar e anunciar!

Introdução

O que é um site mobile?

É aquele com conteúdo adaptado a dispositivos móveis e com interface agradável para passar a informação de maneira direta.

Por que criar?

O acesso à internet por meio de celulares e tablets tem crescido. Só em 2012, as conexões mobile aumentaram 24%.

A URL é a mesma?

O site mobile pode ter 2 configurações: web design responsivo ou URLs separadas para desktop e dispositivos móveis.

Tipos de site

a) Site responsivo

Seu layout se adapta automaticamente ao display do aparelho. Se a tela for pequena, as informações principais serão mostradas em primeiro lugar.
Essa é a configuração recomendada pelo Google.

Desenvolvimento

1º passo: grids

Consistem basicamente num conjunto de linhas de base que fornecem uma estrutura para layout, ajudando a escolher a melhor localização dos elementos.

Em geral, os grids são usados com colunas definidas. As quantidades mais comuns são:

12, 16, 18 ou 24.

2º passo: imagens

As grandes levam mais tempo para abrir, e os dispositivos móveis nem sempre conseguem carregá-las. Há 2 soluções para isso:

Elemento <picture>

O conceito indica o uso de media queries para selecionar imagens adequadas a cada aparelho.

Atributo “srcset”

Essa solução oferece diferentes resoluções ou dimensões de viewport de uma mesma figura.

3º passo: media queries

Permitem aplicar estilos diferentes de acordo com o tamanho do viewport do dispositivo.

Quando estão configuradas, o navegador exibe o layout apropriado ao aparelho pelo qual o site está sendo acessado, ou seja, interpreta o tamanho da tela configurado na media query e mostra o layout definido no CSS.

Vantagens

Usar só uma URL facilita a interação dos usuários, possibilitando que compartilhem e criem links para o conteúdo.

O user agent do Googlebot precisa rastrear suas páginas apenas uma vez. Isso pode ajudar o Google a manter o site atualizado.

Não é necessário ser redirecionado para chegar à visualização otimizada, o que reduz o tempo de carregamento.

b) Sites com URLs separadas

Cada URL para desktop tem uma URL equivalente para dispositivo móvel. Desde que todas sejam acessíveis ao Googlebot e ao Googlebot Mobile, nenhuma é favorecida pelo Google.

Desenvolvimento

O Google recomenda as seguintes anotações nas URLs:

Na página do desktop, use a tag rel="alternate" de link especial, que direciona para a URL do dispositivo móvel.

Na página do dispositivo, adicione a tag rel="canonical" de link, que direciona para a URL do desktop. O uso dessa tag na URL de aparelhos móveis é obrigatório.

Vantagens

O conteúdo é totalmente adaptado ao dispositivo, sendo a melhor opção para sites que possuem arquivos pesados.

É possível projetar todo o site para mostrar apenas o conteúdo necessário.

Geralmente esses sites são mais rápidos e têm tempo de carregamento até dois terços abaixo das versões para desktop.

Otimização de site mobile

Embora o mobile SEO não seja muito diferente do SEO tradicional, é preciso levar em conta que usuários móveis têm hábitos distintos. Veja algumas técnicas:

a) Palavras-chaves

As menores são mais adequadas a sites mobile. Como a área de busca é pequena, não é comum realizar pesquisas extensas.

b) Especificidade

No geral, o visitante mobile busca algo muito específico, por isso, crie páginas e links direcionados e deixe a informação essencial em evidência.

c) Conteúdo

Como no SEO tradicional, precisa ter qualidade e relevância. É importante que os textos sejam concisos e indexáveis.

d) Sitemaps

Você pode criar uma versão do Sitemap.XML contendo apenas as URLs de conteúdo mobile. Em seguida, envie este sitemap através do Google Webmaster Tools.

Anúncios Mobile

a) Facebook Ads

O Facebook tem feito um grande investimento em Mobile Ads. De acordo com números divulgados pela empresa no segundo semestre de 2012, há um lucro de:

US$ 3 milhões

por dia com publicidade móvel.

Tipos de Anúncio

Histórias patrocinadas

Recomenda páginas e conteúdos com base em atividades de amigos, como curtidas e compartilhamentos.

Mobile App-Install

Permite aos internautas interagir com jogos e aplicativos.

Mensagens promovidas

Destaca o conteúdo das páginas que um amigo curtiu no feed de notícias.

Ofertas

É o tipo mais recente de publicidade móvel e possibilita atrair o público por meio de descontos e promoções.

b) Links Patrocinados

Ao usar o Google Adwords para divulgar o site, o anunciante pode definir um lance diferente para cada dispositivo em que os anúncios serão veiculados.

Tipos de anúncio

Anúncio de texto

Contém três linhas de texto e uma URL que leva ao website.

Download com um clique

Promove os aplicativos para celular diretamente nos resultados de pesquisa do Google.

Múltiplos endereços

Possibilita aos anunciantes exibir suas unidades próximas no Google Maps.

Extensão de local

Inclui o telefone da empresa e rotas clicáveis e pode mostrar a distância entre a pessoa e a loja.

Sitelink de anúncios

Direciona os usuários para páginas específicas do site.

Extensão de chamada

Admite a inclusão de um número de telefone clicável no anúncio.