O que é o Design Responsivo?

O design responsivo permite que um site se adapte, dinamicamente, às características e às dimensões da tela do dispositivo em que o site está a ser acedido e visualizado.

O design responsivo nada mais é do que idealizar e construir um único site que se adapte à tela de todos os dispositivos com acesso à internet e a todos os browsers, para que o utilizador tenha uma experiência standardizada de navegação no site.

Media Queries e User Agent

Para se criar um site com uma estrutura de design responsivo é necessário considerar vários factores, embora haja dois fundamentais:

  • User Agent – é a função que existe dentro do site que verifica qual o browser e em que sistema operativo o utilizador está a aceder ao site. Ou seja, é através do user agent que se consegue diferenciar se o site é acedido através de um laptop ou através do tablet.
  • Media Queries – são a “espinha dorsal” do design responsivo. São trechos de código CSS que permitem que determinadas características de um site, como a largura, a altura e a cor, se adaptem ao dispositivo em que o mesmo está a ser renderizado

Vantagens do Design Responsivo

As duas grandes vantagens na idealização e criação de um site em formato de design responsivo são a flexibilidade e a melhoria em termos SEO.

  • Flexibilidade – Se um site com design responsivo se adapta a qualquer resolução de monitor é fácil de perceber que o utilizador terá sempre a mesma experiência de navegação, esteja ele a aceder ao site através do seu tablet, do seu smartphone ou do seu laptop.
  • Melhoria SEO – Se adotarmos o design responsivo na criação de sites, a presença e a posição na pesquisa orgânica é melhorada.

Existindo apenas um site o conteúdo não se encontra repetido. Além disso, se temos um único site com o mesmo design e conteúdo, o utilizador irá passar mais tempo no site, mesmo que esteja a aceder num dispositivo móvel, uma vez que o site já lhe é familiar.

Desvantagens do Design Responsivo

A principal desvantagem do design responsivo é o tempo de download do site. Para além de ser necessário fazer o download de um código específico de HTML/CSS é necessário que todos os elementos do site sejam renderizados de início.

Quanto aos custos de produção há quem defenda que a construção de um único site adaptável aos diferentes dispositivos pesa mais no orçamento do que constuir vários sites e teorias que defendem o inverso.