Web design responsivo (RWD) é uma abordagem de web design que visa criação de site para fornecer uma ótima experiência de visualização e interação – fácil leitura e navegação com um mínimo de redimensionamento, panorâmica e rolagem – em uma ampla gama de dispositivos (de computador desktop monitores para telefones celulares).
Um site desenvolvido com RWD adapta o layout ao ambiente de visualização usando grades fluidas e baseadas em proporção, imagens flexíveis e consultas de mídia CSS3, uma extensão da regra @media, das seguintes maneiras:
- O conceito de grade fluida exige que o dimensionamento do elemento da página seja em unidades relativas, como porcentagens, em vez de unidades absolutas como pixels ou pontos.
- As imagens flexíveis também são dimensionadas em unidades relativas, de modo a evitar que sejam exibidas fora do elemento que as contém.
- As consultas de mídia permitem que a página use regras de estilo CSS diferentes com base nas características do dispositivo em que o site está sendo exibido, mais comumente a largura do navegador.
O design responsivo da Web está se tornando mais importante, já que a quantidade de tráfego móvel agora representa mais da metade do tráfego total da Internet. Essa tendência é tão predominante que o Google começou a aumentar as classificações de sites compatíveis com dispositivos móveis se a pesquisa foi feita em um dispositivo móvel. Isso tem o efeito de penalizar sites que não são compatíveis com dispositivos móveis.
