Design responsivo é uma ótima solução para quem precisa fazer um site que fique bem em Desktop e Smartphones, porque projetar layouts diferentes para mobile é coisa do passado.
Por isso, vamos esclarecer alguns princípios básicos do design responsivo fluido através de alguns GIFs animados.
Como os tamanhos das telas são diferentes, o conteúdo começa a ocupar mais espaço vertical e o que estiver abaixo é “empurrado” para baixo.
Usando unidades relativas com os valores em porcentagens o conteúdo fica proposicional e adaptado para as diferentes telas.
Os pontos de interrupção permite que o layout mude em pontos pré-definidos, ou seja, se tivermos três colunas em um desktop, mas apenas uma coluna em um dispositivo móvel .
Determinar uma largura minima e máxima pode ser a solução para que em uma tela grande (TV) o conteúdo não ocupe 100% da tela, tenha uma largura máxima e para um Smartphone o layout pode ocupar toda a tela, já que tem menos espaço.
WebFonts
Imagens X vetores
Este estudo foi desenvolvido por Front
