O que é design responsivo?

Seu site não é responsivo? Saiba mais sobre design responsivo e as vantagens que ele pode trazer ao seu negócio.

Você certamente já ouviu falar sobre design responsivo (também chamado de “design adaptativo” – termos em inglês: responsive design e adaptive design). A essa altura do campeonato, se você trabalha com internet (ou apenas acompanha as novidades), você já deve estar cansado de saber o que é design responsivo.

Mas muita gente ainda desconhece isso, mesmo já tendo acessado sites responsivos. Então decidi escrever esse artigo pra explicar de forma simples não só o que é esse tal de design responsivo, mas por que ele é importante para seu negócio.

» Siga-me no twitter e assine a newsletter para ler mais novidades!

O que é design responsivo?

Sabe quando você abre um site em seu smartphone e ele aparece de uma forma diferente de quando você abre em seu notebook, por exemplo? Isso pode significar uma dessas duas coisas:

Versão mobile

O site tem uma versão mobile, ou seja, quando você o acessa através de seu smartphone, o site detecta que um usuário está tentando acessar o site de um dispositivo com uma tela pequena, então é exibida uma versão “compacta” do site (normalmente boa parte do conteúdo é resumido ou removido de vez dessa versão, deixando o site mais “limitado”). Alguns sites têm duas versões mobile: uma para smartphones e outra para tablets.

versão mobile

Versão “original” e versão mobile da loja online Ponto Frio.

Site responsivo

O site responsivo se adapta a qualquer tamanho de tela, exibindo exatamente o mesmo conteúdo tanto em monitores grandes quanto em smartphones pequenos (uma coisa ou outra pode ser removida ou resumida para melhorar a navegação, mas normalmente o conteúdo é o mesmo). Ou seja, se você está em seu notebook ou computador de mesa agora, você pode abrir um site responsivo em seu navegador e brincar de redimensionar a largura do browser (ou seja, arraste o canto lateral direito, por exemplo, do seu navegador, deixando-o menor aos poucos – quando um site é responsivo, ele irá acompanhar a largura do site, diminuindo aos poucos). Faça o teste, ó: http://fabiolobo.com.br

design responsivo

Sim, meu site é responsivo! :D

Aqui vai um vídeo – em inglês – que resume bem a ideia:

Por que ter um site com design responsivo?

Bom, são várias vantagens, mas um dos pontos mais importantes é: se seu site não é responsivo, quando alguém acessá-lo pelo smartphone, a navegação será bem complicada. O usuário precisa dar zoom para ler o conteúdo, arrastar a tela várias vezes até encontrar o que precisa e, muitas vezes, o site vai apresentar vários bugs. Certamente você já deve ter perdido algum cliente por causa disso… e nunca saberá.

site não responsivo

Se meu site não fosse responsivo, ele seria assim. Veja como a navegação no smartphone fica prejudicada!

Outra vantagem que sempre costumo citar: vamos supor que você é um arquiteto e está na casa de um cliente para orçar um projeto. Seu cliente pede para que você mostre alguns de seus trabalhos, e normalmente você tem duas opções: carregar sempre seu notebook ou então uma pasta com fotos. Com um site responsivo você poderia apresentar seu portfolio no seu próprio celular (ou então seu próprio cliente poderia acessar seu site do smartphone dele), o que é bem mais prático.

Praticidade é uma palavra forte na web: um usuário deve navegar em seu site com a maior facilidade possível. E design responsivo só tem a contribuir, nesse caso.

Seu site ou blog com design responsivo

Tá na hora, hein? Qualquer coisa, sinta-se à vontade para pedir um orçamento quando quiser.

Esses dias uma pessoa me solicitou um orçamento, através de seu smartphone, quando estava dentro do ônibus. Com o crescimento de dispositivos móveis, a oportunidade também se tornou móvel. Então, não fique parado!