Quick answer
Responsive design means a website adapts to any screen, from a small phone to a large monitor, and stays usable.
What it is
Responsive design makes a website work on any screen size. The same page reflows on a phone, tablet and desktop. It uses flexible grids, images and CSS rules to adjust the layout.
Why it matters
Most web traffic comes from phones. A site that does not adapt loses those visitors. Responsive design is the minimum standard for any new site.
How to use it
- Design for mobile first, then add layouts for larger screens.
- Use relative units like rem and percent instead of fixed pixels.
- Test on real phones and tablets, not only browser tools.
- Use CSS grid and flexbox to build the layout.
Examples
- A marketing site shows a 4-column grid on phones, 6 on tablets and 12 on desktops.
- A blog post reflows its text for narrow screens without breaking line length.