Quão importante é o design responsivo da web?

Ouvi várias opiniões sobre os prós e contras do uso de web design responsivo recentemente e fiquei imaginando se era necessário que pequenas empresas que segmentam pequenas áreas geográficas implementassem o design web responsivo?

Algumas sub-perguntas que tenho sobre isso incluem:

1. É melhor usar o design responsivo da web, em vez de usar um código separado para diferentes dimensões / dispositivos?

2. Pode afetar potencialmente o SEO (positiva ou negativamente)?

3. Quais são os principais problemas que pude encontrar ao otimizar um site para uma empresa usando esse método de design?

Prevê-se que o uso da Internet móvel exceda o uso de computadores dentro de alguns anos, portanto, algum tipo de otimização móvel deve ser uma consideração séria para qualquer empresa.

De muitas maneiras, isso é especialmente verdade para pequenas empresas localizadas: previsivelmente, muitas pesquisas para dispositivos móveis tendem a se concentrar em encontrar coisas nas proximidades - pense em encontrar uma loja, um restaurante, etc.

Em maio de 2012, o design responsivo é a melhor prática recomendada do Google para o setor de design para smartphones. Um dos principais benefícios é que você está executando um site: esse é o site para projetar, criar, manter e promover. É eficiente.

Do ponto de vista do SEO, hospedar um site móvel separado, por exemplo, exemplo.com, significa que você precisa otimizar dois sites separados e dividir o valor da sua empresa (PageRank, autoridade etc.) nos dois locais. Embora você possa evitar isso, exibindo conteúdo nas mesmas URLs por meio da detecção de agente do usuário, isso não lida com a duplicação de esforços (ainda são dois sites separados) e também apresenta mais desafios técnicos, por exemplo, garantindo o seu agente do usuário a detecção funciona e é mantida atualizada, que os mecanismos de pesquisa indexam o conteúdo certo no índice certo etc.

Ao todo, o design responsivo é uma solução elegante.

Para responder suas outras perguntas:

1. Comovido acima, mas também considere a rapidez com que o mercado móvel se desenvolve. Quanto mais flexível sua solução móvel, menos você precisará fazer para acompanhar.

2. Depende do que você está comparando, mas, como mencionado acima, qualquer uma das outras 2 opções principais apresenta desafios significativos de SEO.

   Houve alguma preocupação com a questão da "camuflagem", ou seja, ocultar o conteúdo dos mecanismos de pesquisa, que é inerente ao design responsivo na maioria das implementações. No entanto, embora isso não tenha sido explicitamente respondido por qualquer um dos principais mecanismos de pesquisa, o Google o considera "melhor prática" pode ser visto como uma indicação de que o Google é capaz de discernir entre ocultar legítimo conteúdo para motivos de otimização do dispositivo e outros esconderijos menos legítimos, por motivos de manipulação.

3. Eu acho que o principal desafio é determinar qual conteúdo mostrar aos usuários móveis. Dependendo do seu site, isso pode não ser um problema, mas em muitos casos é. A principal consideração aqui é entender o que seus visitantes móveis estão tentando fazer. Por exemplo, alguém em um iPhone provavelmente deseja informações ou transações rápidas e fáceis. É provável que a mesma pessoa em um iPad esteja interessada em uma experiência de navegação mais tranquila.

A idéia subjacente é proporcionar uma experiência de navegação ideal para o visitante, independentemente do dispositivo. Como o número de visitantes que usam um dispositivo móvel provavelmente aumentará em vez de diminuir, faz todo o sentido seguir esse caminho.

Existem vários temas acessíveis (para não dizer barato) disponíveis para Blogs e CMS. Você pode experimentar imediatamente e ver se gosta do que recebe (verifique com todos os seus dispositivos ou com alguns de seus clientes).

1. Desde que você tenha um motivo especial, tente sempre se concentrar em uma base de código. Uma razão pode ser que você queira oferecer um site especializado como um "aplicativo da web".

2. SEO: não. Tão bom e ruim quanto um layout não responsivo.

3. Você precisa fazer um pouco mais de planejamento no começo. Qual conteúdo deve ser exibido no menor dispositivo, como deve ser a ordem do conteúdo? Coisas assim. Ou: meu conteúdo fica bem em todas as minhas dimensões suportadas? Você também pode otimizar os tamanhos de suas imagens para cada uma das dimensões para fornecer não apenas imagens em escala do navegador, mas também imagens redimensionadas. Se o seu CMS não suportar, é mais trabalho.

Se você planeja incluir anúncios de uma fonte externa, também precisa verificar se os formatos fornecidos funcionam bem juntos.

Editar:

Deixe-me acrescentar que, se você tiver dados históricos de análise da web disponíveis (por exemplo, o Google Analytics), poderá procurar facilmente o número de usuários móveis e não móveis, identificar os dispositivos usados ​​(até o hardware real) e verificar as resoluções de tela ("Eles realmente veem minhas páginas ou apenas uma parte delas e precisam rolar?").

Segunda edição:

De acordo com este post "Sites móveis versus design responsivo: qual é a solução certa para sua empresa?" "no blog do Google Analytics, um site criado com o design responsivo tem os seguintes profissionais:

• Facilidade de atualização
• Otimizado para mecanismos de pesquisa
• Adicionando códigos de conversão e redirecionamento

Os profissionais do site móvel separado:

• Projetando para as necessidades do usuário móvel
• Criação de site Quicke
• Ótimas opções de bricolage

O artigo "Design responsivo - aproveitando o poder das consultas de mídia" no Blog oficial da Central para webmasters do Google fornece uma boa introdução sobre como o "Design responsivo" é realmente implementado.

"Criando sites otimizados para celular" no Google Developers afirma:

"O Google recomenda que os webmasters sigam as práticas recomendadas do setor de usar web design responsivo, ou seja, veicular o mesmo HTML para todos os dispositivos [...]"

Eu acho que é importante perceber primeiro que "design responsivo" (RD) é um termo de alerta (se eu colocar Largura: 100% em um elemento, eu tenho um RD ali mesmo, para exagerar) e, portanto, sua importância parece mais importante do que realmente é como no final é condicional como todo o resto.

É necessário implementar o RD?

Para responder, você precisará declarar algumas definições:

1. Quem é seu público alvo
2. Que tipo de público é seu alvo
3. Qual é o objetivo do seu site
4. De onde o site será acessado (na maioria dos casos)
5. etc.

Isso é muito semelhante à análise de marketing. Trata-se de ter o meio certo para o público certo (talvez o seu público fique sentado na frente de um computador a maior parte do dia ou esteja em movimento com o iPhone mais recente e assim por diante). Eles fazem os dois, então é claro que RD é central.

É melhor usar o design responsivo da web, em vez de usar um código separado para diferentes dimensões / dispositivos?

Depende da complexidade da interface do usuário e como você a usará. Na maioria dos casos, uma página típica pode ser renderizada usando diferentes conjuntos de CSS para as várias exibições. No entanto, interfaces de usuário mais complexas ou sofisticadas podem exigir abordagens diferentes, portanto, é aconselhável apresentar uma estrutura e estratégia de página diferentes, dependendo do dispositivo usado (mapas do Google, por exemplo, interface multi-touch ..).

Isso pode afetar o SEO (positivo ou negativo)?

SEO tem mais a ver com conteúdo do que com design. Somente o Google sabe se eles pesam no design, mas no design / layout, mas, em geral, se o seu conteúdo for de alta qualidade, esse peso será maior do que o design real.

Quais são os principais problemas que pude encontrar ao otimizar um site para uma empresa usando esse método de design?

Projetando para o público errado. Analise seu destino e forneça dados técnicos atualizados, se possível (por exemplo, registros de visitantes que fornecem informações sobre a plataforma etc.)

A nova tecnologia é sempre arriscada, ref. o problema HTML5 para o Facebook. Não está totalmente maduro neste momento e convida vários problemas semelhantes ao IE6 versus problemas de padrões.

Mantenha-o o mais simples possível. As páginas da web sofisticadas são valiosas apenas por um período muito curto até que o usuário realmente precise usar sua página. Se precisar aguardar 1/2 segundo para que o desbotamento termine a cada clique, o usuário se perderá rapidamente. Coisas assim.

Analisei as outras respostas, perdoe-me se eu for redundante ... Estou fazendo design responsivo todos os dias por mais de 8 horas por dia neste momento ... Meus clientes querem isso porque querem que os usuários móveis tenham um 'único' experiência, meus empregadores querem, porque é considerado o Google como o método preferido e simplifica bem. (e se ostentar o Google como a maneira de fazer algo provavelmente funcionará melhor para SEO)

É melhor usar o design responsivo da web, em vez de usar um código separado para diferentes dimensões / dispositivos?

Eu diria que é melhor, sim. A maior parte do seu código é o mesmo código, resultando em menos trabalho do que escrever um aplicativo para iPhone, um aplicativo droid, um aplicativo para iPad, um aplicativo para kindle ... você entendeu.

Pode afetar potencialmente o SEO (positiva ou negativamente)?

Do ponto de vista do projeto, sinto que é neutro; no entanto, do ponto de vista estatístico, meus projetos responsivos estão indo muito bem. Os clientes adoram e os clientes adoram usá-los.

Quais são os principais problemas que pude encontrar ao otimizar um site para uma empresa usando esse método de design?

É um pouco difícil de fazer no início ... você precisa fazer uma pesquisa sobre consultas de mídia e, de preferência, ter alguns dispositivos móveis para testar. Lembre-se de que o redimensionamento da janela na área de trabalho está próximo, mas como os dispositivos móveis renderizam a Internet às vezes é diferente do que você esperaria. Por exemplo, eu projetei um site responsivo em que usei uma repetição BG para o cabeçalho e, na área de trabalho, ele se estende por toda a área visível; no entanto, no iOS, ele encurta por algum motivo ...

Eu recomendo aprender e experimentar um design responsivo. confira este site para começar: http://html5boilerplate.com

Para responder à pergunta no título: é importante e é recomendável que você esteja ciente disso e como projetá-lo; caso decida não usá-lo, você deve estar preparado para defender essa postura, pois seu cliente pode estar definido em ter esse design. Pela minha experiência, clientes e clientes adoram o design responsivo. Clientes satisfeitos e clientes satisfeitos são uma razão suficiente para eu prosseguir com isso :)

O design responsivo da web é fundamental - se você estiver criando um novo site, DEVE torná-lo responsivo. 50% do tráfego já é de dispositivos móveis e tablets e isso não apenas crescerá, mas também será a forma claramente dominante de uso da Internet.

Para pequenas empresas que visam pequenas áreas geográficas, é ainda mais crítico - o SEO será muito difícil para uma nova empresa de pequeno porte, mas se o seu produto for bom, você poderá maximizar o quanto as pessoas compartilham o que você está fazendo.

Quando se trata de ler mídias sociais, as pessoas estão usando dispositivos móveis agora - geralmente na cama de manhã e na noite.

Se seu site não puder ser usado em um dispositivo móvel, todos os compartilhamentos que atingirem seu público relevante serão desperdiçados. Você não quer isso. É fundamental evitar que isso aconteça.

Em relação ao código responsivo ou separado: a principal desvantagem do design responsivo é que ele não é tão rápido quanto as bases de código separadas. Essa perda de velocidade será insignificante, certamente no caso de uma pequena empresa local, quando outros fatores aparecerem na mente dos usuários sobre o motivo pelo qual o site é 0,2 segundos mais lento que outros.

A grande vantagem do design responsivo é que você mantém a mesma base de código. Isso reduz os custos de manutenção, testes e desenvolvimento.

O grande diferencial do SEO hoje em dia é a 'Qualidade do site' - a qualidade do site é difícil de medir, mas de maneira geral o Google usa a Taxa de rejeição e o Tempo no site para medir isso. Se o seu site é ruim para celular, 50% do seu tráfego terá uma alta taxa de rejeição e um grande número de visitantes com pouco envolvimento (menos de 10 segundos na página).

Isso coloca você em risco de penalidades do Google - observe o Google Panda e as novas penalidades (na semana passada) do domínio de correspondência exata , que penalizam os sites por terem 'baixa qualidade'.

Os principais problemas que você pode encontrar ao otimizar um site para uma empresa usando esse método são que é um novo chavão, todo mundo precisa dele, então existem cowboys por aí cobrando preços ridiculamente altos por algo incrivelmente fácil de fazer.

Por exemplo, recentemente criei um site que possui uma loja, um fórum, uma seção de perguntas e respostas, além de várias outras páginas, blogs etc. totalmente responsivos a todos os dispositivos em aproximadamente um dia.

Aqui está o básico do que você precisa fazer:

1. Ajuste o preenchimento do corpo e as margens
2. Mova os menus do lado esquerdo ou direito para as listas suspensas, talvez oculte-os abaixo de um botão de opções na parte superior.
3. Redimensione contêineres, use largura 100% onde puder
4. Altere todas as suas imagens para largura 100%
5. Decida quais itens não são necessários no telefone (anúncios?) E remova-os (visor: nenhum)

Aqui está um código de exemplo:

@media screen and (max-width:480px) {
body {
margin:5px;
padding:0px;
}
.advertbox {
display:none;
}
}

O que isso faz é remover qualquer coisa com uma classe de 'advertbox' dos smartphones (com largura máxima de 480px) e reduzir a margem do corpo.

Se você estiver criando um novo site, isso é ainda mais fácil, pois você pode garantir que você crie um design limpo com boas classes limpas e um bom estilo para todos os dispositivos.

Eu espero que isso ajude!

Eu gostaria de me envolver com uma perspectiva diferente:

Não, não é obrigatório nem recomendado. Depende de quem é seu público-alvo. Olhe para as suas análises e veja qual a porcentagem proveniente do celular e das pessoas que acessam o celular há uma queda significativa em comparação aos usuários do computador?

Para dar um exemplo em que trabalho, nosso site não responde. No entanto, 90% do nosso tráfego é proveniente de usuários de computadores, e as taxas de rejeição e as taxas de conclusão de eventos são quase idênticas entre computadores, dispositivos móveis e tablets.

Até que haja uma justificativa de custo para alterá-lo, simplesmente não há um incentivo financeiro para fazê-lo. Dizer declarações abrangentes como 50% dos usuários estão no celular ou algo é aplicável apenas se todos os usuários forem seu público-alvo. Caso contrário, é completamente lógica irrelevante e ruim seguir.

Você precisa analisar apenas a% de usuários no celular que você está segmentando. Particularmente para aplicativos B2B, a maioria das pessoas não vê seus telefones em seu tempo livre. Você receberá tráfego de segunda a sexta-feira em computadores desktop.