Home Quem Somos Clientes Portfólio Blog Contato

CONTEÚDO

Novidades do mercado de tecnologia e muito mais conteúdo para você se manter informado.

05/fev/2017

O que é um site responsivo?

Autor: Bruno Barbosa

O termo da vez no universo do desenvolvimento web é design responsivo, que nada mais é do que uma abordagem pela qual um designer cria uma página web que “responde” ou se redimensiona de acordo com o tipo de dispositivo em que está sendo visualizada, podendo ser a tela grande de um computador, um notebook, um tablet ou um smartphone.

O design responsivo explodiu em 2013, com o grande crescimento dos dispositivos móveis, que permitiu que cada vez mais pessoas passassem a visualizar páginas da web utilizando tela menores, e passou a ser uma ferramenta indispensável nas estratégias de Marketing Digital, principalmente após abril de 2015, quando o Google passou a penalizar sites em seu ranking de acordo com o seu nível de responsividade.

Como é um site com design responsivo?

O propósito de um design responsivo é ter um único site, porém com elementos diferentes que respondem de maneiras distintas quando visualizados em dispositivos de tamanhos diferentes.

Um site tradicional, que não é responsivo, quando visualizado em um desktop pode, por exemplo, mostrar três colunas. Mas quando você visualiza o mesmo layout em um tablete menor, você será forçado à mover a barra de scroll lateralmente, coisa que muitos usuários não apreciam. Ou os elementos podem ficar distorcidos ou fora do lugar. O impacto pode ser ainda mais se considerarmos que muitos tablets permitem que você utilize a tela em orientação de retrato ou de paisagem.

Em telas de smartphones o desafio pode ser ainda maior. As imagens podem “quebrar” o layout e estragar a experiência. Além disso, o site pode ter um carregamento mais lento em smartphones se os gráficos forem muito pesados.

Quando se utiliza o design responsivo, a versão para tablete pode automaticamente se ajustar para mostrar somente duas colunas, por exemplo. Dessa forma, o conteúdo fica legível e o site fica mais fácil de navegar. Em um smartphone, o conteúdo pode aparecer como uma única coluna, talvez empilhado verticalmente. O usuário pode até mesmo passar para visualizar outras colunas. As imagens também passam a ser redimensionadas em vez de distorcidas ou cortadas.

Resumindo: com um design responsivo, o site se ajusta automaticamente ao aparelho que o usuário está utilizando.

Como funciona o design responsivo?

Sites responsivos utilizam grids fluídos. Todos os elementos da página são dimensionados por proporção em vez de pixels. Dessa forma, se você tem três colunas, você não necessariamente ditará quão largas elas devem ser de forma absoluta, mas sim quão largas elas devem ser em relação às outras colunas. Por exemplo, a coluna 1 deverá ocupar metade da tela, a coluna 2 deverá utilizar 30% do espaço e a coluna 3 ocupar os 20% restantes.

Conteúdo de mídia como imagens também são redimensionadas relativamente. Desse modo, uma imagem poderá permanecer dentro de sua coluna ou na posição correta de acordo com seu elemento referencial.

Conforme dito, possuir um site responsivo é essencial para todos que desejam utilizar seu ambiente virtual como parte de estratégias de Marketing. Ainda tem dúvidas? Entre em contato conosco!

Deixe uma resposta

O seu endereço de e-mail não será publicado. Campos obrigatórios são marcados com *

2017 © Todos os direitos reservados. FASTERS