Desde Coca-Cola contra a Pepsi, não houve um debate tão amplo e uma intensa controvérsia em um tópico singular. Blogs de tecnologia e design na Web estão envolvidos em debates acalorados sobre design responsivo versus sites para dispositivos móveis, discutindo sobre qual solução oferece melhor a experiência móvel.

Não podemos todos apenas concordar? Não, não nesta vida, especialmente por um assunto tão debatido quanto este. Com o grande número de desenvolvedores e designers da Web atendendo clientes hoje, e a grande aceitação em dispositivos móveis que tem atraído o foco para o problema, seria quase impossível que todos concordassem.

Quer ser uma mosca na parede para ouvir o que as empresas profissionais pensam sobre design responsivo e como eles estão atendendo seus clientes?

Entrevistei quatro organizações proeminentes que criam experiências móveis para seus clientes diariamente. Abaixo, você encontrará informações privilegiadas sobre seus processos de desenvolvimento para dispositivos móveis

Duas posições opostas

Embora existam muitos pontos de vista diferentes, parece haver duas opiniões predominantes circulando na web.

No canto azul ...

Os fãs do design responsivo contam com os muitos benefícios como evidência suficiente de que essa tecnologia deve ser aplicada a todos os sites ou à maioria dos sites para dispositivos móveis.

De acordo com os proponentes de design responsivo:

  • Os usuários querem uma experiência completa no site, independentemente do dispositivo, e não uma versão simplificada do que os webmasters acham que os usuários desejam visualizar. Usabilidade centra-se em fazer o visitante do site se sentir como se estivesse no controle e tomar as decisões. Especialistas argumentam que um site para celular separado pode frustrar o usuário final.
  • O design responsivo é uma opção econômica, pois há apenas um site para manter. As empresas precisarão criar sites móveis separados para cada dispositivo, o que pode aumentar a longo prazo com os requisitos de conteúdo e manutenção.
  • Com sites responsivos, não há atualizações futuras caras quando novos dispositivos móveis chegarem ao mercado.
  • Muitos especialistas em SEO acham que os sites construídos com design responsivo são mais amigáveis ​​aos mecanismos de busca porque não passarão links para outros domínios, como é o caso de sites específicos para celular - alguns SEOs contestam essa teoria e citam a atualização de redirecionamento do Google como evidência. Segundo o Google, esta atualização "usa o URL de destino final do smartphone" em seus resultados de pesquisa para celular, evitando os redirecionamentos, permitindo um tempo de carregamento mais rápido.

De acordo com Michael Wyszomierski, que trabalha para o Google em Operações de Qualidade de Produto, o design responsivo está onde está. Aqui está sua postagem no Google+:

Michael Wyszomierski

Michael respondeu às críticas nos comentários afirmando que em alguns casos os sites móveis podem ser necessários, mas no geral ele é um forte defensor do design responsivo e acredita que muitos sites poderiam melhorar muito sua experiência de usuário utilizando-o.

Então, se o design responsivo é tão legal, moderno e moderno, por que há histeria em massa em torno do tópico? Aqui estão algumas razões do porquê…

No canto vermelho ...

O outro lado do argumento não é teimosamente oposto ao design responsivo, mas eles sentem que é apropriado apenas em situações específicas. Esse campo enfatiza que a decisão sobre a criação de um site para dispositivos móveis separado em um design responsivo depende das necessidades do usuário móvel.

Aqui estão alguns dos argumentos contra o design responsivo:

  • Velocidade - Quando um usuário móvel abre um site com design responsivo, todos os elementos do site para computador são baixados e redimensionados para caber na tela. Isso torna o site lento para carregar, pois todo o código JavaScript e HTML original ainda está presente. (Quando os designers criam sites específicos para dispositivos móveis, eles consideram o dispositivo ao projetar o site e otimizá-lo de acordo.)
  • Conteúdo Distinto - O campo em favor de sites específicos para dispositivos móveis geralmente argumenta que os usuários de dispositivos móveis podem precisar de outro nível de conteúdo que não esteja presente em um site para computador. O design responsivo pode caber no dispositivo, mas não aproveita a otimização da experiência do usuário em relação à satisfação de suas necessidades exclusivas.

Decidimos levar este argumento às ruas para ver como empresas lucrativas atendem às necessidades de mobilidade de seus clientes. Conversei com quatro organizações de alto nível e perguntei sobre sua abordagem ao design responsivo. Eu os escolhi porque eles são bem sucedidos em entregar um excelente trabalho para seus clientes e seu crescimento é um testemunho desse fato.

Eu perguntei a cada uma das mesmas perguntas para examinar o quão diferente / similar a abordagem delas era no tópico.

Colin Proctor, Esmagando Ideias

O primeiro é Esmagando Idéias , uma agência interativa baseada em Seattle em atividade desde 1996. O diretor de arte Colin Proctor teve a gentileza de compartilhar seus pensamentos sobre design responsivo.

P: Com que frequência você desenvolve sites para celular para seus clientes?

A: Nós fizemos um punhado deles. Com muitos de nossos clientes, vemos iniciativas de web móvel decolando agora. As experiências da Web para dispositivos móveis têm sido um importante tópico de planejamento e conversação no último ano para a maioria de nossos projetos. Os sites para celular que desenvolvemos têm sido m.sites responsivos ou como um único layout responsivo. A maioria deles tem conteúdo muito focado. Temos um amplo portfólio de experiências para dispositivos móveis, sejam aplicativos nativos ou híbridos, aplicativos da web etc.

P: Você usa automaticamente o design responsivo para todos os clientes móveis? Explique brevemente por que ou por que não.

R: Não, mas é sempre uma parte da conversa. Exploramos o contexto do público antes de tomar decisões sobre a tecnologia. Para ser transparente, os layouts totalmente responsivos ainda têm limitações técnicas que causam preocupação para as grandes empresas: publicidade, imagens responsivas e suporte à integração de terceiros são algumas das principais preocupações. Para os sites de brochuras, quase sempre usamos design responsivo, porque a hierarquia de conteúdo desses sites tende a se degradar bem em vários pontos de interrupção. Muitas vezes, o contexto do usuário para sites de brochura é consistente em todos os dispositivos.

Q: Você diria que você é ...

a) Em favor do design responsivo
b) Não a favor de design responsivo
c) Em favor de design responsivo e sites móveis separados

Explique brevemente por que você escolheu sua resposta ...

R: Eu acho perigoso usar o layout responsivo como um todo e que uma estratégia responsiva determinará as maneiras pelas quais o sistema de design responde ao contexto do usuário (que é fundamental). O design / layout responsivo é uma abordagem muito escalonável, mas ele sempre leva em consideração o que o usuário está fazendo? Não, porque é um sistema de muitas soluções de design para dispositivos móveis.

Se eu estivesse construindo um site de transporte público, eu teria que considerar que um usuário sentado em sua mesa provavelmente está planejando sua programação ou rotas, enquanto um usuário em seu telefone está tentando descobrir onde seu ônibus / trem está e está buscando mais soluções imediatas. Esses dois contextos exibem comportamentos diferentes, necessidades de conveniência, necessidades de navegação e qual conteúdo deve ser apresentado antecipadamente. Um conjunto de modelos com estilo e layout contextual pode não ser a solução - pode ser necessário um conjunto de recursos totalmente diferente.

P: Qual é o seu melhor conselho para web designers / desenvolvedores que desejam criar experiências móveis com sucesso para seus clientes?

R: O design responsivo não é um ponto de partida. É uma ótima tecnologia que muitos na comunidade da Web dedicaram muito tempo a resolver os problemas que a impedem de ter uma presença mais global. Acho que veremos a adoção de layout / design responsivo ao longo dos anos.

Na minha opinião, a melhor coisa a sair da explosão da web móvel é uma ruptura com a ideia de que nossa tela está pronta e que só precisamos preenchê-la. Somos forçados a superar nossas antigas suposições sobre a experiência do usuário e são responsáveis ​​por nossos processos de pensamento mais do que temos sido na história recente. Como sociedade, nós não somos mais um público cativo olhando para um retângulo de uma área de visualização média como 1024 × 768, então as regras estão sendo reescritas. Como indústria, este é um momento para experimentar e crescer.

Evoluir Grupo Criativo

Em seguida é Evoluir Grupo Criativo , uma empresa de soluções web de serviço completo baseada em Akron, Ohio. Eu perguntei aos desenvolvedores as mesmas perguntas e aqui estão suas respostas:

P: Com que frequência você desenvolve sites para celular para seus clientes?

R: Desenvolvemos websites para dispositivos móveis provavelmente cerca de 30% do tempo. É uma combinação de desejo, orçamento e necessidade para nossos clientes. Muitos clientes não têm a necessidade ou o desejo de oferecer suporte a dispositivos móveis devido ao público e ao orçamento. Devido à flexibilidade dos sites que criamos (não móveis), eles funcionam bastante bem em dispositivos móveis que os clientes não podem justificar o custo. Pode ser difícil de vender, mas à medida que as tendências móveis crescem e se solidificam, mais clientes estão aderindo.

P: Você usa automaticamente o design responsivo para todos os clientes móveis?

R: Não, não usamos para todos os clientes móveis. Nós simplesmente fazemos o que é do melhor interesse do cliente e de seus usuários. Avaliamos cuidadosamente a abordagem móvel, caso a caso, dependendo de suas necessidades.

Se os usuários de dispositivos móveis do cliente tiverem um subconjunto de interesses ou uma meta específica que exija uma alteração no layout ou na quantidade de informações fornecidas, recomendaremos um site para dispositivos móveis separado em um subdomínio, o que nos permite simplificar o site para o experiência móvel. Mas por outro lado, se o site já é simples e universal em mensagens e objetivos (como blogs, landing pages e pequenos sites informativos, por exemplo), então ter um único site flexível em todas as plataformas é definitivamente vantajoso.

Q: Você diria que você é ...
a) Em favor do design responsivo
b) Não a favor de design responsivo
c) A favor de design responsivo e sites móveis separados.

Explique brevemente por que você escolheu sua resposta ...

R: Como tudo neste negócio, a abordagem móvel é um dar e receber, pois existem prós e contras de cada método. Os sites para dispositivos móveis separados oferecem a vantagem de concentrar o usuário em conteúdo específico que seja conciso e otimizado. Mas a desvantagem inerente é que o cliente pode ter o dobro da manutenção para futuras atualizações.

É aqui que o design responsivo entra em sintonia com o argumento “um site para governá-los todos”. Ter um único site que seja universal, rico em flexibilidade e que ofereça todo o site para que os usuários interajam com eles, é uma ideia muito interessante. Ele coloca poder nas mãos dos clientes e usuários e resolve o problema de projetar e construir sites para um dispositivo específico (desktop ou outro). Mas os argumentos contra o design responsivo, como o tempo de download, os custos de desenvolvimento e o excesso de informações, podem ser igualmente convincentes.

A moral aqui é adaptar a solução com base no projeto e nos usuários, e não ficar preso ao debate cada vez mais intenso.

P: Qual é o seu melhor conselho para web designers / desenvolvedores que desejam criar experiências móveis com sucesso para seus clientes?

R: O maior conselho que podemos oferecer é ser inteligente ao escolher sua abordagem. Não pule apenas na perua de banda responsiva, porque é a coisa nova ou ficar com sites de celular separados, porque é seguro e familiar. Você precisa avaliar cuidadosamente os prós e contras de cada abordagem para o projeto específico em questão.

Além disso, baseie-o no usuário final da solução. Eles são do tipo que tem um objetivo específico e sem tempo de atenção? Eles querem entrar, sair e continuar com sua vida? Ou eles estão em um café e querendo aproveitar toda a experiência? A resposta para essa pergunta provavelmente irá render a escolha correta.

Ryan Anderson, Alquimia50

Em seguida, falei com Ryan Anderson, presidente da Alquimia50 , uma agência digital sediada no Brooklyn, NY. Aqui está o que Ryan tinha a dizer sobre o processo de sua empresa:

P: Com que frequência você desenvolve sites para celular para seus clientes?

R: Raramente Acho que sites específicos para celular estão se tornando uma coisa do passado. Há tantos tamanhos de tela, resoluções, etc ... a considerar hoje em dia que criar um site "móvel" específico é mais trabalhoso do que vale a pena e não resolve completamente o problema.

P: Você usa automaticamente o design responsivo para todos os clientes móveis?

R: Não automaticamente, mas com freqüência. Isso realmente depende da natureza do projeto - seja um aplicativo da web ou um site corporativo - ambos têm parâmetros exclusivos que devem ser considerados. Nós também não separamos muito o "mobile", mas sim, entramos em um projeto sabendo que na maioria dos casos é multi-dispositivo, multi-resolução, multi-browser, etc ... ele tem que funcionar em qualquer lugar e com um base de código para ser rentável.

É aqui que uma boa estrutura responsiva é a chave - você pode abordar a maioria das permutações com uma boa estrutura. O Alchemy50 criou seu próprio framework que é uma mistura de elementos rígidos e dimensionamento dinâmico. Descobrimos que sites mais complexos tendem a ser um pouco indisciplinados usando frameworks elásticos, então nosso framework usa consultas de mídia para ajustar nossas páginas em resoluções definidas. Está provado ser extremamente útil e eficaz em nossos esforços para suportar vários dispositivos e navegadores com uma base de código.

Q: Você diria que você é ...
a) Em favor do design responsivo
b) Não a favor de design responsivo
c) A favor do design responsivo e dos sites para celular separados, dependendo do cliente e de seus usuários

Explique brevemente por que você escolheu sua resposta ...

R: É realmente a única maneira de se desenvolver na web atualmente. Temos que nos colocar no lugar do nosso cliente e considerar - custo total, prazo, escalabilidade, suporte, etc. - e quando o fazemos, ele geralmente suporta a noção de um framework responsivo. É importante ressaltar, no entanto, que às vezes o que está sendo solicitado não pode ser feito sem as bibliotecas nativas do sistema operacional - portanto, uma estrutura da Web responsiva não é a resposta para tudo.

P: Qual é o seu melhor conselho para web designers / desenvolvedores que desejam criar experiências móveis com sucesso para seus clientes?

R: Não escolha uma solução até entender completamente o que o cliente deseja fazer. E cuidado, muitas vezes um cliente dirá que quer "um site HTML5" ou um "aplicativo para dispositivos móveis que funcione em qualquer lugar". Descobrimos que eles geralmente não entendem completamente o que estão dizendo. Peça-lhes para esquecer a tecnologia por um minuto e explicar em linguagem simples o que estão procurando construir. Qual é o mercado alvo? Quais são os hábitos desse mercado (tecnologia, navegador, eles se sentam nas mesas, etc) Qual funcionalidade o site / aplicativo fornecerá? Muitas vezes, quando você fala sobre esses pontos com o cliente, uma abordagem eficiente (e às vezes muito diferente!) Irá surgir.

Nicholas Davison, Digitaria

Por fim, conversei com o Diretor de Desenvolvimento da Web em Digitaria Nicholas Davison. A Digitaria é uma agência digital de serviços completos fundada em 1997 com cinco locais nos Estados Unidos. Aqui está o que Nicholas tinha a dizer sobre design responsivo:

P: Com que frequência você desenvolve sites para celular para seus clientes?

R: A maioria das nossas construções inclui um componente móvel nos dias de hoje. Com um portfólio tão amplo e tão profundo quanto o da Digitaria, isso significa que minha equipe normalmente tem vários sites com componentes móveis em um determinado momento.

P: Você usa automaticamente o design responsivo para todos os clientes móveis? Explique brevemente por que ou por que não.

R: Ignorando Zeldman e honrando a definição de Marcotte… se você separar Responsivo como, essencialmente, Layouts e imagens adaptativos mais líquidos, não escolhemos automaticamente Responsivo sobre Adaptável. A principal razão para isso é o retorno do investimento.

Os layouts líquidos introduzem uma série de desafios: misturar dimensões fixas e porcentagens tende a exigir elementos div adicionais para suspender o design. Os erros de arredondamento causam problemas em versões mais antigas do Internet Explorer e geralmente deixam intervalos de um único pixel mesmo em navegadores mais modernos. O controle de qualidade, se executado corretamente, deve verificar todos os elementos em todos os tamanhos em todos os navegadores, o que aumenta enormemente os custos do controle de qualidade.

Quais são esses custos para obter um design adaptativo que já atende 320, 480, 720, 960 e 1140? Eles fazem um uso ligeiramente melhor do espaço e adicionam um leve fator de uau. Se esses benefícios justificarem o custo, construiremos Responsivo. Se não o fizerem, o Adaptive é mais apropriado.

Se, como Zeldman sugere, usarmos o Responsive e o Adaptive de forma intercambiável e não estivermos olhando para variantes líquidas, isso ainda não deve ser uma decisão automática. Quem pensa em seu cliente olha para as ferramentas certas para o trabalho certo.

Adaptável tem muitas vantagens e geralmente faz sentido. No entanto, sempre há exceções: o Mdot geralmente funciona melhor quando o cliente deseja conteúdo diferente para dispositivos móveis. Os aplicativos geralmente funcionam melhor quando o cliente deseja uma funcionalidade muito avançada que requer uma interface e interações personalizadas para cada fator de forma.

Ocasionalmente, o celular não faz sentido, ponto final. Se um cliente simplesmente tiver que ter um site mínimo para fins legais ou de concessão e quiser manter os custos baixos enquanto simplesmente verifica uma caixa, o excesso não é apropriado.

Então, adaptativo é algo que geralmente recomendamos, mas, como um bom parceiro, nunca devemos recomendar automaticamente nada sem ouvir primeiro.

Q: Você diria que você é ...
a) Em favor do design responsivo
b) Não a favor de design responsivo
c) Em favor de design responsivo e sites móveis separados

Explique brevemente por que você escolheu sua resposta ...

R: O design adaptativo é incrivelmente atraente em quase todos os casos. Ignorar o celular e o tablet está rapidamente se tornando uma decisão tão ruim quanto ignorar a web há dez anos. Você simplesmente tem que considerá-los para a maioria dos projetos. Os dias de sites Mdot parciais são numerados. Os usuários esperam todo o conteúdo em qualquer dispositivo que eles usem. Uma vez que dispositivos móveis inexistentes ou parciais não são nem mesmo opções, o Adaptive é a maneira mais econômica de entregá-lo na grande maioria dos casos. Comparado a um site Mdot completo e desktop completo, é mais barato. Comparado com o Mdot, Tablet e Desktop, é muito mais barato.

E esses são apenas os argumentos para hoje: o Adaptive é mais barato de se manter e desenvolver, já que é uma plataforma. Sites não são apenas para hoje. Com o tempo de vida de vários anos na maioria dos sites, precisamos não apenas pensar sobre o quanto as pessoas usam tablets e tablets hoje, mas quanto eles as usarão muito antes do fim de vida útil do site.

P: Qual é o seu melhor conselho para web designers / desenvolvedores que desejam criar experiências móveis com sucesso para seus clientes?

Um: plano. Considere mobile e desktop ao mesmo tempo. Retroceder e adaptar a estrutura subjacente para acomodar o que você precisa agora para um projeto surpresa é muito mais caro do que planejar e construir uma estrutura limpa que sirva a ambos.

Use o response.js para que seu site funcione em todos os navegadores, não apenas nos que conhecem as consultas de mídia. Não construa líquidos apenas porque o Responsive é a versão mais fria do Adaptive. Tem vantagens, mas também tem custos. Certifique-se de escolher o que é certo para você.

Teste cedo e teste frequentemente. Era verdade quando estávamos desenvolvendo em quatro navegadores de desktop e tinhamos que considerar o Internet Explorer mais antigo. É duplamente verdade, agora estamos adicionando muitas plataformas móveis: um problema é fácil de corrigir de forma limpa, se você pegá-lo quando ele aparece pela primeira vez. É quase impossível consertar quando dezenas de camadas são construídas sobre ele, obscurecendo o problema central. Se você não está testando, multiplataforma, depois de cada novo recurso adicionado, você está fazendo errado.

Para sanidade, você tem que concordar com uma lista de plataformas para as quais você está dando uma garantia de código. Há tantas variantes do Android, versões antigas do iOS, dispositivos Windows Mobile que você vai oferecer patches gratuitos para a vida se você for tolo o suficiente para simplesmente concordar com "todos os smartphones". E depois há o Blackberry onde as versões mais antigas parecem Projetado com um amor perverso de quebrar.

O debate continua

Obrigado a todos os participantes por nos fornecerem insights sobre seus processos diários.