Preparado?
1.3
Mas meu site já está bom para Android e iPhone!
Você pode ter um site focado para cada dispositivo, mas há diversas desvantagens
nessa abordagem. Em especial, e quando houver um novo dispositivo móvel, com
uma tela bem diferente? E quando precisar fazer uma alteração, terá de tomar cui-
dado com cada uma das várias versões do seu site.
Tomemos como exemplo o Wikipédia que, atualmente, vai redirecioná-lo para a
página http://en.m.wikipedia.org/ se o acesso for mobile. Chamamos isto de estratégia do m ponto (m.website.com). Se você abri-la no desktop, a página flui e ocupa a
tela toda. Fica feio e meio ruim de usar, mas é aceitável. Eles não usam media queries (que ainda veremos neste Livro) e nem nada mais avançado para responsivar. Mas é
responsivo? Ninguém sabe dizer ao certo, fica numa área cinza...
Um outro conceito um pouco diferente
é o de One Web. Que devemos ter uma
URL só pra tudo, um sistema só e servir mesmo conteúdo pra todo mundo. O De-
sign Responsivo costuma ser uma forma de implementar One Web com usabilidade
adequada pra todo mundo.
Há ainda quem fale de uma outra técnica chamada RESS - Responsive design +
Server Side components. Você serve a mesma URL, mesma página, mas ajusta no server-side algumas coisas sabendo qual browser é. Faz-se user-agent sniffing, que é menos preciso, mas ajuda em algumas coisas, como decidir se um link para ligação
direta no celular deve ser exibido.
Você pode usar server-side pra manter a mesma URL (One Web), mas servir pá-
ginas específicas (não responsivas). Ou seja, há combinações diversas dessas técnicas (oneweb+responsivo, oneweb não responsivo, dois sites e responsivo, etc).
14
Casa do Código
Capítulo 1. Introdução
Nesse livro, focaremos em Design Responsivo com One Web. Ou seja, explora-
remos os exemplos e cenários de sites únicos se adaptando através Media Queries,
CSS flexível e recursos flexíveis. Esse cenário ninguém questiona se é responsivo ou não.
1.4
Para quem é este livro?
Web design responsivo é um assunto que, principalmente no Brasil, ainda é novidade. Até os mais veteranos (e, talvez, principalmente eles) desconheçam as técnicas e/ou, mesmo, seu conceito - gostaria de acreditar que não é o caso da maioria dos
desenvolvedores, mas, caso seja, temos um trabalho de conscientização ainda maior
a fazer! Por isso, querendo ou não, este livro destina-se a quem já possui alguns
conhecimentos específicos na área de desenvolvimento web.
Este livro é destinado a todo e qualquer profissional, estudante ou aspirante a
desenvolvedor web que deseja começar ou aprofundar seus estudos em web design
responsivo. Através dos tópicos, tentamos encontrar a melhor maneira de expor este assunto - que, na verdade, não é tããão complexo, assim - da forma que, para nós, foi a cronologicamente adequada e didaticamente satisfatória.
Portanto, caso queira ter seu primeiro contato com design responsivo ou, caso já
o tenha tido, mas, por algum motivo, não tenha entendido muito bem como as coisas
funcionam, relaxe, prossiga com a leitura e tenha a certeza que, ao final do processo, você será mais um conhecedor dos mistérios profundos do web design responsivo!
1.5
Para aproveitar melhor este livro
Para entender e absorver bem o conteúdo, é bom que você já esteja um pouco famili-
arizado com HTML e CSS. Saber um pouco de JavaScript é desejável, não para acom-
panhar os conteúdos principais e mais importantes do livro, mas sim para acompa-
nhar o conteúdo complementar, dicas extras, o plus do design responsivo, que muitas vezes precisa de um js para ser feito.
Mas fique tranquilo! Não é na maioria das técnicas que isso é preciso e, quando
o for, tratam-se de materiais não-essenciais, sem os quais você ainda conseguirá entender como funciona o design responsivo para web.
Então, se você já é profissional do ramo e já passou (ou se encontra ou se inte-
ressa) pela área de front-end, não terá maiores problemas ao continuar com a leitura.
Se você é do back-end e não se interessa tanto pelo que acontece lá na frente,
acredito que, ainda assim, poderá aproveitar os conteúdos, dado que, geralmente,
15
1.5. Para aproveitar melhor este livro
Casa do Código
mesmo o profissional não sendo exclusivamente alocado a uma área de atuação, co-
nhece, pelo menos, as nuances do trabalho dos outros colegas de equipe.
Caso seja você um praticante-militante de web design, profissional de usa-
bilidade, UX e afins, então, ou você dá uma lidinha em alguns tutoriais sobre
HTML/CSS (caso já não saiba alguma coisa) ou, fique sabendo desde já, seu apro-
veitamento maior será sobre como planejar um site, desde sua concepção, para ser
responsivo - principalmente, na filosofia mobile first, que será apresentada -, já que, desde que seja preciso ou acordado na equipe que tal ou qual projeto contará
com web design responsivo, será obrigação sua (ou da equipe a qual você faça parte) pensar e apresentar as soluções visuais para os diferentes
breakpoints do design.