Como o design responsivo é diferente do design adaptável?

Tanto o design responsivo quanto o design adaptável tentam otimizar a experiência do usuário em diferentes dispositivos, ajustando-se a diferentes tamanhos de viewport, resoluções, contextos de uso, mecanismos de controle e assim por diante.

O design responsivo funciona com base no princípio da flexibilidade - um único site fluido que pode ter uma boa aparência em qualquer dispositivo. Sites responsivos usam consultas de mídia, grades flexíveis e imagens responsivas para criar uma experiência do usuário que se flexiona e muda com base em uma infinidade de fatores. Como uma bola única que cresce ou diminui para se ajustar a vários aros diferentes.

O design adaptável é mais parecido com a definição moderna de aprimoramento progressivo. Em vez de um design flexível, o design adaptável detecta o dispositivo e outras características e, em seguida, fornece o recurso e layout apropriados com base em um conjunto predefinido de tamanhos de viewport e outras características. O site detecta o tipo de dispositivo utilizado e fornece o layout pré-configurado para esse dispositivo. Em vez de uma única bola passando por aros de tamanhos diferentes, você teria várias bolas diferentes para usar dependendo do tamanho do aro.

Ambos esses métodos têm alguns problemas que precisam ser avaliados:

• O design responsivo pode ser bastante desafiador, pois você está essencialmente usando um único layout, embora responsivo, para se adequar a todas as situações. Definir os pontos de interrupção de consulta de mídia é um desses desafios. Você usa valores padronizados de ponto de quebra? Ou, você utiliza pontos de interrupção que fazem sentido para o layout específico do seu site? E se o layout mudar?
• O design adaptável geralmente requer a detecção de agente do usuário ou detecção de DPI, etc., todos os quais podem se mostrar pouco confiáveis.