Quais as vantagens de ter um site responsivo? - AFC Web Design

Dicas para você

Quais as vantagens de ter um site responsivo?

Creio que já não é novidade de que o acesso a internet através de smartphones está crescendo a cada dia que passa. Segundo o IBGE, já em 2014 (já fazem 4 anos, veja bem), o celular se consolida como principal meio de acesso à internet no Brasil! Desta forma, não há como deixar de pensar em como nossos blogs e sites aparecem na telinha de nossos leitores, não é? E é ai que entra o design responsivo!

O que é design responsivo?

É a técnica de estruturação do código HMTL e CSS de um site que permite que seu layout se adapte a diversas telas de dispositivos, desde o desktop gigante de 27″ até o smartphone de 4″ ou até menor! E o melhor tudo: é o mesmo layout, porém, sua versatilidade permite que o usuário mantenha uma boa experiência de navegação, não interessa onde.

Desde novembro de 2017 tenho oferecido aos meus clientes o design responsivo no pacote básico sem mais o custo adicional no orçamento, pois estamos no ponto em que o design responsivo é praticamente uma obrigação na pauta de um projeto de web — ainda mais quando estamos falando do público da blogosfera que faz parte do grupo por idade (em sua maioria com menos de 34 anos) que mais acessa internet via smartphone. Veja abaixo por que um site com design responsivo é tão importante:

As 4 principais vantagens de um site responsivo

  1. Facilidade na gestão. O conteúdo que é publicado no site é o mesmo que será apresentado tanto nos celulares quanto notebooks e desktops.
  2. Custo-benefício. Com o design responsivo, o site não precisará necessariamente de uma versão mobile, do qual requer a criação de um outro layout, outra programação, que seria independente de sua versão desktop (ou seja, um novo projeto de design). Tudo se concentra no mesmo layout e, com isso, economizando no bolso.
  3. Indiretamente ajuda no SEO. Com o avanço dos acessos à internet por celular, o Google dá mais relevância para sites responsivos do que para os que não possui este recurso — ou que tenham versão mobile, já que geralmente a URL muda nestes casos, enquanto um site responsivo mantém a mesma URL e, portanto, se mantém no rankeamento nos buscadores. O mesmo link compartilhado nas redes sociais será o mesmo acessado em todos os navegadores, não importa o dispositivo.
  4. Melhora a experiência de usuário. Concorda que a experiência de ver um site quando estamos no conforto de nossa cadeira de frente ao computador é completamente diferente quando o vemos enquanto estamos indo de ônibus ao trabalho, certo? O ambiente influencia em nossa experiência, assim como o tamanho da tela. Se o layout de um site não for responsivo, a leitura passa a ser mais complicada no celular, sem fluidez, e sentimos a obrigação de ficar dando zoom para conseguir ler algo — fora que é bem mais complicado de achar as informações e de navegar, haja paciência! — Com essas dificuldades desistimos do site muito mais fácil, aumentando a sua taxa de rejeição nas estatísticas do Analytics, perdendo a oportunidade de ver um conteúdo que poderia ser bacana (para você ver como conteúdo legal não basta hoje em dia). Com o design responsivo isso não acontece, pois com o conteúdo se adaptando a tela, a leitura torna-se muito mais fluida e a navegação muito mais amigável! 🙂

O “calcanhar de Aquiles” do design responsivo

Entretanto, não podemos negar que existe uma desvantagem (nem tudo é flores nesta vida, não é mesmo?), principalmente quando estamos lidando com imagens. O design responsivo, apesar de ser maravilhoso para conteúdo textual, ele não é tão amigável assim quando se trata de arquivos de imagem. Isso acontece pois o responsivo apenas redimensiona, “comprimindo” a imagem — o que não significa otimizar.

Uma imagem que é apresentada no desktop será a mesma apresentada no celular, e no quesito de redimensionamento, o design responsivo perde um pouco de terreno em comparação a sites que possuem uma versão mobile que já é dedicada a esta visualização de conteúdo mais otimizado. Este é o “tendão de Aquiles” do design responsivo, pois redimensionamento das imagens não se ganha em nada no carregamento, pois o navegador do smartphone lerá a imagem em seu tamanho original (ou seja, grande) e redimensiona-la ao tamanho ordenado pelo HTML e CSS.

Otimização é a chave

É por isso que ter um layout projetado nas melhores condições possíveis de otimização de forma geral é tão importante! Com um código limpo e seguindo boas práticas de desenvolvimento, ajudamos o navegador a ler nosso site de forma mais rápida e recuperar um pouco esta desvantagem diante dos itens redimensionados, fazendo com que o design responsivo ainda seja bastante vantajoso.

Enquanto os padrões web ainda estejam evoluindo neste sentido, o ideal é já otimizar as imagens antes mesmo de inseri-las no site, para sofrerem o menos possível. No meu blog pessoal dou algumas dicas de otimização de imagens que poderão te ajudar nesta empreitada para deixar seu site ou blog mais rápido!