Logo Design Responsivo

Design Responsivo

Mobile First

Mobile First

Possivelmente pelo fato de que a web nasceu e proliferou em computadores muitos designers e desenvolvedores acostumaram-se a pensar na construção de sites projetando inicialmente para desktops. E quando se dão contam que não é possível mais conceber um projeto sem pensar nos dispositivos móveis o que acontece é procurar o "caber" o site desktop em uma versão mobile. Essa forma de pensar é Desktop First, que podemos interpretar como pensar primeiro no desktop.

O crescimento da utilização de dispositivos móveis já é uma realidade então é sensato que se priorize pensar primeiramente em projetar uma melhor experiência nestes dispositivos do que fazer caber toda estrutura de um site projetado para desktop para um mobile. E é ai que entra o conceito de Mobile First.

O conceito de Mobile First foi elaborado por Luke Wroblewski em seu blog e se aplica em projetos web onde o foco é que o desenvolvimento destes deve ser direcionado inicialmente para os dispositivos móveis e em seguida para os desktops.

Quando iniciamos um projeto pelo desktop será preciso muito esforço para que tudo funcione depois no espaço reduzido de um celular. Possivelmente terá que cortar conteúdo parar adequação. Aplicar os conceitos de Design Responsivo desta forma é um desperdício potencial de tecnologia. E não resulta em uma boa solução para navegar por dispositivos móveis.

Mas quando projetamos para dispositivos menores enfrentaremos desafios de design que promoverão uma melhor experiência do usuário. Com a vantagem de que quando iniciar a parte do projeto para desktop importantes decisões de design já foram tomadas em conjunto com a priorização dos conteúdos realmente relevantes para o projeto. Isso porque se o um site é bom em um dispositivo móvel, ele é melhor para todos os dispositivos.

Pensar Mobile First é pensar na otimização do site, priorização de conteúdos e dos recursos essenciais. O emprego de conceitos de Arquitetura de Informação, Usabilidade e Acessibilidade ajudam na definição e disposição das informações mais importantes para o projeto.

Mobile Fisrt + Design Responsivo

Pensar em Mobile First não quer dizer que você tenha que ter uma versão separada com url dedicada para celulares. Nada disso.

Não é interessante para o usuário ficar pensando que vai navegar na versão mobile ou desktop. O que ele quer é acessar o domínio de projeto e que o mesmo proporcione a melhor experiência independente do dispositivo de acesso. O Design Responsivo contribui neste sentido porque pode complementar os conceitos de Mobile First enquanto funciona dentro de um endereço único.

Mas o Design Responsivo realmente desempenha seu melhor papel quando destinado a desenvolver projetos pensando primeiro em dispositivos móveis. Ao estabelecer os breakpoints pode-se pensar na menor largura possível e desenvolver o restante conforme for ajustando o conteúdo e o design das páginas.

Projete o conteúdo para que ele caiba primeiro em uma tela pequena e expanda a tela até que um breakpoint se torne necessário. Isso permite que você otimize pontos de interrupção com base no conteúdo e mantenha o menor número possível de breakpoints. Com a abordagem Mobile First, os breakpoints se desenvolvem naturalmente em torno do conteúdo.

Para entender melhor o conceito de Mobile First assista o vídeo a seguir.

13 / 14