Introdução em 5min.: Web Design Responsivo

Olá pessoal, faz um tempinho que o Google anunciou para facilitar o acesso para os smartphones. E desde 21/04/2015 a adaptação aos smartphones é considerado na hora da avaliação do ranking de busca.

O Google recomenda criar web design responsivo como o modo de adaptação aos aparelhos(existem alguns outros modos).

Este artigo explica sobre o conceito do ‘Design Responsivo’.

O cardápio de hoje

  • O que é Web Design Responsivo?
  • Para o que serve?
  • Como funciona?
  • Conclusão

O que é Web Design Responsivo

Web Design Responsivo é modo de montar o web site com um arquivo adaptado à vários aparelhos. É chamado também com Design Fluido ou Design Liquido. Normalmente contem 3 pontos de divisões que são para PC, tablet e smartphone.

As divisões são feitas pelo tamanho e resolução das telas do aparelho. O projeto fica mais complexo porque considera vários design ao mesmo tempo e isso traz muitas limitações.

Para o que serve?

Os principais motivos para utilizar o web design responsivo são:

  1. Facilita o search engine e não enviar conteúdos repetitivos(SEO) e analise do site.
  2. Facilita a gestão e manutenção.
  3. Facilita o compartilhamentos dos links.
  4. Evita redirecionamento do link e agiliza o acesso.

Escrevi os lados bons, mas existe vários problemas também. O principal é que a complexidade do projeto aumenta muito e isso afeta o preço e o tempo de construção.

Aumenta o tempo de abrir a página nos smartphones porque utiliza os mesmos arquivos para PC. Muitas vezes por ter que baixar imagens desnecessárias e também da velocidade da rede que costuma ser mais lento.

Como funciona?

No design responsivo utiliza uma função do CSS3, Media Queries para regular a aparência em cada aparelho.

img1

O estilo normal:

How does normal design works

Exemplo dos três pontos de divisões e como a aparência muda:

Responsive Example on each device


Conclusão

O Web Design Responsivo é bom para facilitar o acessos dos usuarios e melhorar o ranking da busca do Google.

Em breve crio outro artigo que fala sobre a parte técnica. Até mais!

© 2016 Walker