Responsive Web Design

Responsive Web Design: entrevista com Luís Vieira

Publicado em Tempo de leitura: 3 minutos

O que é o Responsive Web Design?
O Responsive Web Design é a capacidade de criar um website cujo layout se adapta ao tamanho do ecrã do dispositivo usado pelo utilizador. Um website ou aplicação web que utilize um responsive layout pode ser visto em qualquer dispositivo garantindo sempre uma boa experiência ao utilizador. Esta nova técnica surgiu devido ao número crescente de dispositivos diferentes que as pessoas usam para aceder aos seus websites e aplicações favoritas na web. Assim os web designers já não têm que fazer um website específico para cada dispositivo. Um único website adapta-se ao dispositivo escolhido pelo utilizador.

E como é que este sistema, “adaptável” ao dispositivo do utilizador, funciona?
Os principais conceitos por trás do Responsive Design são as grelhas fluídas e as media queries. Para criar um website com uma grelha fluida os web designers devem utilizar valores percentuais nas suas CSS (folhas de estilos de um website) em vez de valores fixos. Isto faz com que os diferentes elementos do layout se adaptem proporcionalmente ao tamanho do ecrã, incluindo a tipografia e as imagens. Quanto às media queries estas servem para alterar o layout do website quando este chega a um determinado ponto, isto é, podemos dizer na media querie que quando o nosso website for visto por um ecrã, por exemplo com 300×900 px, ou o tamanho da janela do browser atingir esse tamanho, os elementos serão reposicionados para manter uma boa leitura e experiência para o utilizador.

A experiência do utilizador é, cada vez mais, um ponto-chave. Deste modo, que aspectos devem ser considerados na construção de um Responsive Website?
Na construção de um Responsive Website e em qualquer outro projecto na web deve-se privilegiar sempre à experiência do utilizador. Deve ser tido em conta que o website vai ser usado em diferentes dispositivos com diferentes tipos de interação (rato, dedo), portanto deve ser garantido que o utilizador consegue aceder com facilidade à informação em desktop, tablet ou smartphone. Neste tipo de websites o bom planeamento é crucial e existem várias metodologias.

Podes descrever uma dessas metodologias?
Sim, claro. Temos, por exemplo, o mobile first. Esta metodologia sugere que, em primeiro lugar, deve ser desenhada a versão mobile e, a partir daí, crescer. É o chamado upscale. Este conceito desenvolveu-se devido ao facto do mobile já não ser uma segunda alternativa mas, em muitos casos, o principal acesso ao website. É também uma forma de forçar os web designers a focarem-se no essencial do website devido ao menor espaço disponível no mobile. No Responsive Design, os web designers também assumem um papel diferente pois está-se a tornar cada vez mais difícil desenhar uma versão do website para cada dispositivo.

E como podemos contornar esta situação?
A solução para este problema passa por desenhar apenas os principais elementos do website ou aplicação. Os web designers devem, cada vez mais, usar o Photoshop ou o seu editor de imagem de preferência para criar apenas visual guidelines e passar para o browser o mais cedo possível. Naturalmente, isto vem também aumentar a necessidade de haver web designers que saibam programar em HTML e CSS. Esta é, na minha opinião, a única maneira de um web designer conseguir garantir uma boa experiencia em todos os dispositivos sendo este o futuro da profissão.

Luis Vieira é um Web Designer/Frontend Developer e Digital Marketer.

E-mail Marketing

Se gostou deste artigo subscreva a newsletter e não perca a publicação de novos artigos.