Sabe aquele site que você abre no celular e a tela até fica ajustada, mas com letras tão pequenas que você precisa utilizar o zoom para ler? Então, esse não é um site responsivo.
Sites responsivos são inteligentemente projetados para serem adaptados a qualquer tipo de resolução, sem distorções. Um design responsivo identifica qual é a largura de cada dispositivo e, dessa forma, consegue determinar o quanto de espaço está disponível e como a página será mostrada para que esses espaços sejam aproveitados da melhor forma. Também ajusta as dimensões das imagens, das fontes e dos demais elementos de uma página para que eles não fiquem desproporcionais.
Em termos bem práticos, é aquele site que, com o mesmo layout, se ajusta perfeitamente a qualquer resolução de forma harmônica, passando a mesma experiência de leitura ao usuário, independentemente do dispositivo pelo qual está sendo acessado.
Uma outra confusão comum acontece entre sites responsivos e versões mobile de um site. Há algumas diferenças entre essas duas definições, como veremos abaixo.
Diferenças entre um site responsivo e uma versão mobile
Responsivo é todo o site projetado para ser adaptado para qualquer tipo de tela. É uma única estrutura de códigos que funciona em diferentes resoluções.
Um mobile template é um pouco diferente, é um segundo site separado, feito exclusivamente para ser aberto em determinados tipos de dispositivos.
