Topo

Mobile first: porque (e como) você deve utilizar esta técnica na hora de construir seu site

Tendência diz que é preciso começar a criar o site pelo mobile e depois pensar nas telas tradicionais

Um levantamento do IBGE apurou que 80,4% das casas com acesso à internet usam o smartphone para navegar. O número superou até os computadores, que são utilizados em 76,6% dos domicílios e costumavam ser os mais populares.

Como o smartphone passou a ser a principal ferramenta de acesso à web, os usuários estão exigindo que os sites sejam responsivos, ou seja, que se adaptem para telas de todos os tamanhos.

Mas há uma tendência que prega que só isso não é o suficiente. É preciso começar a criar o site pelo mobile e depois pensar nas telas tradicionais. Este é o chamado mobile first.

O conceito de mobile first (ou móbile primeiro, em português) consiste em que todo site, sistema ou qualquer outro projeto para web tem de ser planejado e executado primeiro para os dispositivos móveis e só depois para desktops.

O assunto está tanto em voga que até o Google anunciou que está trabalhando na criação de um novo indexador de resultados de buscas exclusivamente para pesquisas feitas em aparelhos mobile. Dessa forma, a empresa estaria procurando uma solução mais adequada para se manter como o buscador mais relevante em uma web “mobile first”.

⇒ Leia também: 7 dicas para tornar seu e-mail marketing mobile-friendly

Fazendo um site mobile first: entendendo o usuário

A prática do mobile first leva os desenvolvedores a pensar em quais elementos são prioridade na exibição para o usuário e quais podem ser descartados. A tendência é que essa cultura crie sites mais limpos, bonitos visualmente e funcionais.

É só pensar em duas situações. Quem acessa um site em um desktop, provavelmente, está acomodado em um lugar fixo e deve ter conexão de internet via banda larga.

Por outro lado, quem está visitando o mesmo site pelo smartphone talvez esteja em movimento, em pé e utilizando apenas uma mão para segurar o aparelho. Além disso, provavelmente, o usuário está conectado via dados móveis do celular, que normalmente não são suficientes para carregar uma grande quantidade de objetivos, sobretudo os conteúdos multimídia, como fotos pesadas e vídeos.

Uma saída, neste caso, é usar o carregamento progressivo, que permite que o dispositivo carregue apenas os blocos iniciais de conteúdo que são indispensáveis, e vá, gradativamente, carregando o restante do site quando necessário.

Até o conteúdo em texto pode ser reduzido e otimizado para ser mais direto, curto e pontual. Tudo com o objetivo de economizar espaço em texto e se comunicar de forma mais rápida com o visitante.

Fazendo um site mobile first: escrevendo o código

Se você gostou da ideia de começar (ou recomeçar) a construção do seu site pensando na usabilidade em mobile, a primeira etapa prática é adequar a linguagem.

⇒ Leia também: 4 coisas a se considerar para uma boa UX em Android

É necessário escrever as linhas de código e fazer o estilo CSS pensando no tamanho da tela padrão dos smartphones. Por exemplo, uma fonte 12 no desktop talvez seja adequada para leitura em telas de 15 a 22 polegadas. Mas, provavelmente, não é o melhor tamanho para um smartphone com tela de 5 ou 6 polegadas.

⇒ Leia também: O que é Flat Design (e como aplicá-lo a seu site)

As cores também precisam receber uma atenção especial, já que o contraste da tela e a forma de visualização também são diferentes. Mesmo as divisões de conteúdos devem ser estruturadas para que todas as dimensões caibam corretamente em uma tela que é, em média, 80% menor em relação à de um notebook ou PC.

O código CSS criado para mobile first também tem uma outra vantagem interessante. Ele é mais simples, curto e por isso os arquivos ficam mais leves e fáceis de manter. Para quem cria sites isso é uma verdadeira mão na roda.

Na prática, não existe certo e errado e não se pode dizer que criar um site mobile first é exatamente fácil. É preciso conhecimento e tempo para fazer com que todos os elementos se encaixem e funcionem perfeitamente em um ambiente com menos espaço e poucos recursos. Mas as vantagens dessa tendência são tantas que, realmente, vale a pena estudar a possibilidade de criar um site mobile first e facilitar a vida do seu público.