Dicas: Layout Responsivo - Passo 1

Antes de começar a escrever sobre qualquer dica relacionada a construção de layouts responsivos, preciso esclarecer dois pontos:

1- As dicas que darei são baseadas em minhas experiências e em meus estudos (tem muita referência boa por ai).

2- Apresentarei esses posts em formato de passo a passo, porém será com o intuito de organizar as ideias, pois você poderá pular algumas etapas e/ou acrescentar outras - apesar de eu não aconselhar...

Pois bem, pingos nos "is" colocados, vamos por a mão na massa!

Analise o contexto do site a ser feito, qual é sua área de atuação, quais serão os conteúdos que mais aparecerão, exemplo: imagens e textos ou mais vídeos. Enfim, ter uma primeira conversa com o cliente e colher dele essas informações é primordial para a elaboração de um layout bem estruturado e que contenha informações bens distribuídas, inclusive quando ocorrerem as quebras (caso você não sabe o que é isso, falaremos mais tarde).

Vá para a primeira reunião com o cliente, munido de perguntas elaboradas de forma a conseguir extrair dele todas as informações possíveis sobre o site. Preparar um briefing o ajudará muito nesse momento.

Atente-se a cumprir bem essa primeira etapa do projeto, afinal não queremos ter retrabalho, por não ter pensado nesses "detalhes" antes de iniciar o projeto.

Saiba Mais: Design Responsivo

Até pouco tempo atrás, pouco se pensava em responsividade de layouts, adaptação do conteúdo em diferentes resoluções de telas ou na experiência do usuário que iria acessar seu site em dispositivos móveis. O máximo que tínhamos, em alguns casos, era o redirecionamento de tela mediante o auxílio do JavaScript e a elaboração de um template exclusivo para mobile.

Quem nunca entrou num site www.exemplodesite.com, pelo computador, mas pelo celular era m.exemplodesite.com?

Entretanto, hoje em dia, não podemos mais pensar em construir layouts e elaborar templates sem pensarmos (e muito!) em como ele agirá ao ser exibido nas mais diferentes resoluções disponíveis.

Existe uma série de medidas que podemos tomar para deixar nosso trabalho mais fácil, mas se você preferir poderá pular algumas etapas e partir direto para a codificação.

Seja qual metodologia de trabalho utilizar, o importante é que o resultado final seja um site charmoso e responsivo.

Deixarei as dicas de criação responsiva para nossa sessão de "Dicas". E elas virão quentes!