A importância do Design Responsivo

O termo já é bem conhecido na área da comunicação e passou a ser uma característica comum no Web Design. De uma maneira simples, Design Responsivo é a capacidade do site de se adaptar a diferentes plataformas, resoluções e navegadores, sem perder as características de layout original.

Com a evolução das plataformas móveis e o aumento da gama de resoluções, surgiu a necessidade de criar layouts que se adaptem a todos este requisitos permitindo uma melhor navegação sem perder características importantes como resolução e design.

A pouco tempo, a principal característica de desenvolvimento de um site se restringia a uma resolução de 1024 x 768px e se este funcionaria nos principais navegadores, inclusive o Internet Explores, o pesadelo de qualquer programador.

Apesar de parecer uma solução simples, criar plataformas com estas características causava muito mais transtornos do que hoje em dia, pois nem todos os navegadores aceitavam as mesmas diretrizes apresentando diversos problemas no layout.

A internet não era pensada para o celular, sendo que a opção para criar um website para celulares estava em criar 2 plataformas, uma para a visualização no computador (os monitores geralmente aceitavam muito bem a resolução de 1024 x 768px) e outra para celulares, que inicialmente apresentaram diversos problemas para adaptação.

Na prática como funciona:

O layout original na tela do computador, está exemplificado com uma resolução de 1920 x 1080px, que é muito comum para monitores acima de 21 polegadas. Ao lado, o celular está representado com uma resolução de aproximadamente 480px. É fácil notar a maneira que o layout se adapta a ambas as mídias, criando diferentes "colunas" transformando o design horizontal (tela do computador) em uma plataforma vertical (tela do celular).

O Design Responsivo determina que o layout siga as limitações de seu dispositivo, mas para isso, o layout deve ser criado pensando nestas plataformas e neste tipo de redimensionamento.

Para criação de nosso website www.moriniestudio.com.br, partimos de um formato padrão de 1024px de largura, ou seja, nosso design foi criado dentro de um "espaço" que pode se adaptar melhor a diversos tipos de resolução de monitores. Neste exemplo as imagens de nosso portfólio estão representadas em um monitor com resolução de 1920 x 1080px.

Conforme a resolução é alterada, neste caso na utilização de um dispositivo móvel como um iPad (768px aproximadamente), as imagens seguem um padrão vertical transformando o layout que antes possuía 4 colunas de imagens em 2 colunas. Esta adaptação é pré determinada na criação do design, permitindo a melhor navegação e otimização do site.

Para celulares, a adaptação é ainda mais perceptível, sendo que em média um Smartphone possui 480px. O Design Responsivo neste caso permite que as 4 colunas de imagens vistas em um monitor se torne apenas uma, oferecendo ao usuário uma experiência mais agradável de navegação e permitindo que nosso portfólio fique em evidência com imagens maiores em um layout Responsivo.

Diversas adaptações podem ser feitas, como por exemplo exibir duas colunas de imagens no celular ao invés de uma, mas o que queremos exemplificar é a dinâmica do Design Responsivo e sua capacidade de adaptação para tornar a navegação mais atrativa e objetiva.

Apesar deste avanços, ainda existem problemas. Um deles é com relação ao tamanho das imagens. As imagens são adaptadas ao dispositivo ou resolução, mas elas permanecem com o mesmo "peso", tamanho do arquivo original. Isso ainda é um problema pois apesar de se adaptar ao layout (desktop para smartphone) o "peso" dificulta a navegação em celulares. Este problema deve ser resolvido em versões mais recentes do HTML e CSS.

Outro problema ainda enfrentado para o desenvolvimento de websites é a falta de diretrizes para criar regras específicas para o funcionamento dos sites. Existem hoje os padrões da W3C para tornar as ferramentas de web mais funcionais, mas não é seguida por todos e mesmo assim existem muitas lacunas e discussões a respeito.

De qualquer forma o Design Responsivo é sem dúvida a melhor solução para a otimização de plataformas online. Permite intervenções rápidas e soluções de uma maneira mais abrangente para o funcionamento de um site independente do sistema, navegador e plataforma.

para conhecer mais a respeito desta ferramenta, entre em contato com a Morini Estúdio www.moriniestudio.com.br.

#responsivo #websiteresponsivo #webdesign #publicidade #layout #site #programação

Posts Em Destaque
Posts Recentes