Mobile friendly: o que é e as vantagens de ter um site otimizado para dispositivos móveis

Você sabe dizer se o seu site ou o blog da sua empresa é mobile friendly? Se não sabe — ou sequer entende o que esse termo significa—, temos muito o que conversar.

Em 2018, 52,2% de todo o tráfego online aconteceu pelos dispositivos móveis. Pois é, mais da metade de toda a movimentação de dados nas redes se deu por celulares e tablets.

Isso significa que as pessoas estão passando mais tempo na Internet em um dispositivo móvel do que em um computador. Aposto que você já entendeu qual o problema de não saber se o seu site é mobile friendly, certo?

Se a página da sua empresa na Internet não é preparada para dispositivos móveis, pode ser que você esteja perdendo a maior parte dos usuários. Parece grave, não concorda?

Continue lendo para entender mais sobre o assunto e aprender como resolver essa questão!

O que é um site mobile friendly?

Você já parou para reparar no fato de que um computador e um smartphone (ou tablet) são dois dispositivos essencialmente diferentes?

Por exemplo, a tela de um computador é maior do que a de um dispositivo móvel. Além disso, ela segue uma razão de aspecto diferente também (normalmente, a tela do monitor é mais horizontal, com os smartphones sendo mais verticais).

Porém, as diferenças vão além da disposição da tela. Em um computador, o usuário tem um teclado bem grande para digitar informações e um mouse para controlar e clicar onde quer. Em dispositivos móveis, o controle é pela tela tátil e o teclado é bem pequeno.

Outra distinção entre os dois tipos de aparelhos é o tipo de conexão que ambos têm com a Internet. No computador, a conexão é sempre Wi-Fi. No dispositivo móvel, pode ser via 3G ou 4G.

Todas essas questões criam cenários online diferentes para os usuários. No celular, por exemplo, a pessoa não consegue entrar em páginas com muitas imagens, pois usa conexão móvel e isso consumiria muitos dados (além de demorar mais para carregar).

Isso significa que a maneira como programamos nossos sites devem levar essas diferenças em consideração. Uma página que é otimizada para rodar em um dispositivo móvel é chamada de mobile friendly (em tradução livre, amigável aos dispositivos móveis).

Site responsivo é igual a mobile friendly?

Você provavelmente já ouviu falar na importância de otimizar o seu site para dispositivos móveis. Existe até uma grande chance de estar pensando algo como “mas o meu site já é responsivo”.

O problema é que mobile friendly não significa ter um site responsivo. Na verdade, tecnicamente, são coisas diferentes.

Um layout responsivo é aquele cujo código é montado para que o site se adapte à diferentes tamanhos de tela. Um smartphone, por exemplo, tem uma tela bem mais vertical do que um monitor de computador.

O site responsivo vai se adaptar independente das dimensões da tela ou do navegador do usuário. Você pode ver isso na prática agora mesmo.

Faça um pequeno experimento: tire o seu navegador do modo tela cheia e deixe no modo janela. Depois, use o mouse nas bordas da janela para alterar o seu tamanho o quanto quiser.

Viu como o nosso blog se adapta a qualquer tamanho? Conforme você diminui ou aumenta a janela, o texto vai se encaixando automaticamente, assim como outros elementos do layout (como nossa logo ou a barra de pesquisas).

Já um site mobile friendly é aquele que tem uma versão exclusiva para dispositivos móveis. Quando entramos na página via um smartphone ou tablet, vemos uma disposição própria para esses aparelhos.

Mesmo que a página use as mesmas imagens e mesmo conteúdo, seus códigos são outros, pensados para otimizar a experiência de quem usa um dispositivo móvel.

Em uma grande parte dos casos, muitos sites criam até um subdomínio próprio para a versão mobile, normalmente indicada com um “m” na URL, como “m.sitedeteste.com.br”.

CONTEÚDO RECOMENDADO
Google mobile-first index: saiba tudo sobre a indexação do Google baseada em mobile

Quais os critérios para ser mobile friendly?

Ok, se chegamos a conclusão que um site responsivo não é a mesma coisa, então quais os critérios para ter um mobile friendly?

Vamos ver!

Fácil de navegar

Um site mobile friendly precisa ser de fácil navegação. Isso significa que o site precisa ser bem estruturado para facilitar ao usuário encontrar o que ele procura ou precisa.

Um exemplo prático é desativar todos os tipos de pop-up na versão mobile. Isso se faz necessário porque, ao contrário de outros elementos, dificilmente as pop-ups se adequam ao tamanho da tela.

Por causa disso, elas ficam grandes demais, obstruem toda a visão do usuário e é difícil de fechá-las em um dispositivo móvel.

Outro ponto importante, que vale mencionar, é organizar os conteúdos do site em menus de fácil acesso. O ideal é que o usuário chegue exatamente onde ele quer, com poucos toques.

Carregamento rápido

Uma estatística: 53% de todos os usuários mobile deixam um site se ele levar mais de 3 segundos para carregar. E, quanto mais o carregamento demora, mais essa porcentagem cresce.

Portanto, um site mobile friendly precisa ser mais rápido para carregar, até para não consumir muitos dados do usuário.

Afinal, ninguém quer voltar a um site que gastou todo o seu pacote diário por causa de uma imagem que não ficou otimizada, por exemplo.

Funciona bem em telas pequenas e diferentes

Um site mobile friendly precisa compreender que as telas de dispositivos móveis, como smartphones e tablets, é bem diferente dos monitores de computadores.

Isso significa que os designers precisam pensar nisso e planejar todo o conteúdo, desde a homepage até o layout dos artigos, para funcionar bem em telas de tamanhos diferentes, especialmente as pequenas.

Uma das maneiras de conseguir isso é com um site responsivo, claro. Outra maneira é trabalhar o design da página já pensando nas condições específicas dos dispositivos móveis.

Usa controle por toque

Por fim, os sites mobile friendly estão otimizados para usar comandos de toque durante as suas navegações.

Você provavelmente já encontrou algum site que não era muito amigável ao seu celular. Por exemplo, ele carregava no “tamanho normal”, como se estivesse abrindo em um monitor de computador.

Por causa disso, as letras ficavam todas pequenas e era impossível ler o que estava escrito. Quando você tentava usar o comando de zoom para ampliar o texto simplesmente não funcionava.

Se isso já aconteceu com você (ao mesmo tempo que problemas como links não funcionarem ou a tela não rodar ao toque) é porque o site não foi otimizado para lidar com esses comandos diferentes.

Qual a importância de ser amigável aos mobiles?

Pode impactar seu rankeamento

Em 2015, o Google lançou uma atualização do seu algoritmo para começar a dar destaque aos sites que eram mobile friendly nas buscas feitas em dispositivos móveis.

A razão para isso é óbvia: com o uso de celulares e tablets aumentando, as pessoas começam a pesquisar na Internet com eles. Se os sites não estão otimizados para isso, a experiência dos usuários é ruim e isso é péssimo para o Google.

Portanto, o mecanismo de busca começou a dar mais destaque para os sites otimizados para esses dispositivos. Se a sua página ainda não é assim, está sofrendo no rankeamento de buscas móveis.

Melhor experiência do usuário

Como foi descrito anteriormente, a experiência do usuário sofre muito se o site não for otimizado para dispositivos móveis.

Imagens pesadas, que consomem o pacote de dados, e navegação ruim fazem com que o visitante não queira mais voltar ao seu site.

Aumento das taxas de conversão

Você sabia que mais de 84% da população faz compras online pelo smartphone? Isso mesmo: cerca de 8 em cada 10 pessoas costuma fazer compras de algum tipo em um dispositivo móvel.

Isso significa que, se você tiver seu site otimizado para esse público, verá um aumento na sua taxa de conversão. Afinal, quantas vendas você já não perdeu porque os usuários não conseguiram acessar o botão de compras ou navegar na sua loja?

Diminuição da taxa de rejeição

Lembra que 53% dos usuários mobile saem de um site se ele demorar mais de 3 segundos para carregar? Então, isso contribui para aumentar a taxa de rejeição dessa página.

Isso também acontece quando a pessoa entra e vê o site todo desorganizado ou quando não consegue navegar direito.

Por isso, ter uma otimização para dispositivos móveis diminui muito a taxa de rejeição do site, pois elimina todos os fatores que “expulsam” o usuário da página.

Como transformar seu site em mobile friendly?

Depois disso tudo, você com certeza quer trabalhar o mais rapidamente possível para transformar seu site em uma página amigável aos dispositivos móveis. Mas como fazer isso? Siga nossas dicas!

Faça o teste do Google

O Google oferece uma ferramenta gratuita para testar e descobrir se seu site é mobile friendly ou não. Faça esse experimento!

Uma das partes boas é que, além de ter uma confirmação do Google, o relatório do teste ainda oferece dicas do que melhorar no seu site. É um ótimo ponto inicial para seu trabalho!

Use um layout responsivo

“Mas vocês não disseram que responsividade e mobile friendly eram coisas diferentes?”. São coisas diferentes, mas se complementam também.

Um layout responsivo ajuda o seu site a se organizar melhor em qualquer tamanho de tela e garante boa parte do trabalho em obter uma boa usabilidade na sua página.

Agilize o carregamento da página

Você já sabe que, quanto mais seu site demorar para carregar, pior é para os seus usuários móveis. Portanto, trate de agilizar essa velocidade.

Uma das maneiras de fazer isso é reescrevendo o código do seu site, para deixá-lo mais organizado e fácil de ser lido pelos navegadores e servidores. Outra forma é diminuir o uso de imagens ou, pelo menos, otimizá-las com técnicas de compressão. Assim, uma foto que antes tinha 1 MB, pode diminuir de tamanho para 100kb ou equivalente.

Formate seu conteúdo corretamente

Você já tentou ler um parágrafo de 5, 6, talvez 7 ou 8 linhas em um celular? Parece que é um texto gigantesco, que ocupa toda a tela e não acaba nunca.

Isso cansa o leitor e o afasta do seu site. Lembre-se de que as características dos dispositivos afetam até mesmo na hora de produzir o seu conteúdo.

Ou seja: você precisa formatar seu texto para que ele seja melhor escaneado pelo usuário. Confira algumas dicas:

• use negrito em partes importantes;
• use bullet points para organizar informações;
• mantenha parágrafos curtos e diretos;
• divida seu conteúdo em intertítulos.

Use fontes de fácil leitura e adaptação

Se você usa em seu site uma fonte personalizada ou customizada, há a grande chance de afastar todos os seus visitantes de dispositivos móveis.

Isso acontece porque, quando entramos com o celular em um site com fontes customizadas, recebemos um pedido para fazer o download dessa fonte e acessar o conteúdo. Muita gente não quer fazer isso (seja por medo de vírus, seja pela simples inconveniência) e acaba saindo da página.

Outro ponto importante é usar fontes claras e em um tamanho aceitável. O ideal são fontes sans serif, em um tamanho um pouco maior do que a versão desktop da página.

Estruture o site para melhor navegação

Um usuário de dispositivo móvel tem menos disposição para navegar por menus até encontrar aquilo que estava procurando.

Por isso, você deve facilitar o trabalho dele ao estruturar o seu site da maneira mais simples e intuitiva possível. A ideia é que o conteúdo que ele procura esteja ao mínimo de toques possível de distância.

Seguindo essas dicas, você transformará seu site em mobile friendly e começará a sentir os resultados dessa mudança em pouco tempo.

E não pare por aqui! Agora que você já sabe como tornar o seu site mobile friendly, aprenda a otimizá-lo para conversões no mobile e garanta a melhor experiência possível ao usuário.