Até pouco tempo atrás, o termo “site responsivo” era algo totalmente desconhecido e utilizado apenas nas rodas de conversa técnica dos desenvolvedores mais atualizados.

Aos poucos o termo foi sendo incorporado ao linguajar técnico de todos os desenvolvedores, até ganhar importância tal que hoje os clientes já nos procuram para desenvolver sites que sejam responsivos.

AFINAL, O QUE É UM SITE RESPONSIVO?

Quando falamos em site responsivo estamos na verdade nos referindo a forma como o conteúdo do site (menus, imagens, textos, tabelas e outros elementos do conteúdo) se comportam frente aos diferentes tamanhos e resoluções de telas do usuário que está navegando no site.

Antigamente o site era desenvolvido pensando em uma largura máxima de tela, e o conteúdo ficava centralizado, assim se o usuário que estivesse navegando no site tivesse uma tela maior que o planejado, o browser deixava bordas brancas nas laterais, isso dava um conforto visual e ficava adequado para a grande maioria dos visitantes, uma vez que “navegar na internet” apenas era feito com um computador de mesa ou um notebook. Para melhorar a experiência de quem navegava no site, alguns até orientavam: este site é melhor visualizado em resoluções acima de “800×600” por exemplo.

Com a popularização dos Smartphone e tablets, cada vez mais os sites passaram a ser acessados pelos usuários com dispositivos que possuem telas muito menores que as de um computador e de tamanhos diversos, com o agravante de o usuário poder navegar com o dispositivo em diferentes orientações (celular de pé, ou deitado por exemplo).

Dependendo de como o site foi desenvolvido, alguns sites até “cabem” no celular, mas o tamanho fica tão pequeno que dificulta a leitura, obrigando o usuário a rolar o texto ou fazer zoom em partes que ele estiver lendo.

Outros sites simplesmente ficam completamente desconfigurados o que não só torna a experiência do usuário muito ruim, mas realmente inviabiliza o uso pois some texto, imagens aparecem fora do local projetado, enfim uma experiência muito longe de ser a ideal para quem está navegando.

Um site responsivo, leva em conta todas estas variáveis de tamanhos de tela, diferentes resoluções, e até orientação do dispositivo na hora de exibir um site no browser do usuário. Assim, os menus, imagens, textos e todos os elementos visuais se reposicionam conforme o ambiente do usuário, possibilitando uma experiência de uso confortável e pensada no usuário sem necessidade de tirar o foco do usuário para poder rolar ou ampliar o conteúdo.

Nos dois exemplos aqui (mesmo site demonstrado em um iPhone), você percebe que no site responsivo, o menu se tornou um botão na lateral esquerda, que vai se expandir ao toque do usuário. Os textos ampliaram e ficaram legíveis, sem necessidade de dar zoom, nem de rolar na horizontal.

Os botões de ação, caixa de procura e demais elementos são ampliados, permitindo que o usuário toque no elemento correto sem dificuldade alguma.

Um detalhe importante: mesmo nos dispositivos modernos, com telas de alta resolução como as telas de retina do iPhone ou a tela Super Amoled da Samsung, o problema de exibição de um site não responsivo vai continuar: Uma tela de 5 polegadas sempre vai ter 5 polegadas independente da sua tecnologia ou da sua qualidade, assim o browser é obrigado a diminuir o tamanho do site para que ele caiba no pequeno espaço disponível, exigindo constantemente que o usuário aplique zoom, ou e role horizontalmente o texto.

PORQUE É IMPORTANTE TER UM SITE RESPONSIVO?

A experiência do usuário é o fator mais importante que você tem que ter em mente ao projetar seu site, e até mesmo escrever conteúdos de qualidade e úteis para ele. São detalhes como dar zoom repetidas vezes ou rolar texto horizontalmente que podem fazer com que o usuário abandone seu site antes mesmo de ter contato com os conteúdos que você deseja.

Em um recente estudo do Google, disponibilizado na plataforma Google´s Think, 61% dos usuários tendem a deixar a página se ela não oferecer uma boa experiência móvel.  Ou seja, é tão complicado conseguir visitas para a página, que não justifica e não é lógico correr o risco de perder quantidades significativas dessas visitas por não ter um site responsivo.

Nos últimos anos, o número de dispositivos móveis cresceu tanto que no ano passado (2015), o número de buscas no Google feitas em dispositivos móveis ultrapassou o número de buscas feitas em dispositivos convencionais (notebooks / computadores).  72% dos usuários de smartphones no Brasil acessam a web todos os dias de seus dispositivos móveis.

A partir de Abril.2015, o Google passou a usar como um importante critério de ranqueamento, o fato de um site estar preparado para receber visitas de dispositivos móveis. Se o seu site não está adaptado – não é responsivo – não quer dizer que ele está sendo diretamente penalizado, mas significa que nas buscas, o Google declaradamente está priorizando aqueles sites que são responsivos e por consequência são mais amigáveis ao usuário.

O Google oferece uma ferramenta (e muitas dicas) para você saber se o seu site é amigável aos dispositivos móveis.  A ferramenta de teste de compatibilidade é gratuita, e está disponível neste endereço: https://www.google.com/webmasters/tools/mobile-friendly

Faça o teste e veja os resultados. Se o seu site não estiver preparado, veja as dicas que ele vai lhe apresentar, e passe a trabalhar nisso imediatamente.