Responsive design
Responsive design adapts the presentation of an interface to the space and conditions of the device it is used on
What it means, how it is used and where it comes up, with its related concepts.
What it is and how it works
It combines flexible structures, adaptable resources and layout rules. It should maintain legibility, functionality and hierarchy at different sizes. It is not just about shrinking a desktop version: it may require reorganising content and rethinking forms of interaction.
Variants and linked concepts
- Adaptive design. Adaptive design serves a set of fixed layouts for specific screen sizes, whereas responsive design adapts fluidly. Both aim to fit the content to the device.
- Responsive cropping. Responsive cropping changes the framing of an image according to the medium. It should preserve the image's relevant information and the purpose of the content.