Responsive Design
In one sentence
Layouts that adapt to screen size through CSS media queries, rather than serving a separate mobile site.
Analogy Mental model
A stretch shirt. It fits everyone and looks intentional on all of them.
In practice What you actually do
Flexbox or grid, a viewport meta tag, fluid images, and testing at several widths rather than two. Build mobile first and widen, because the constraint produces better decisions than shrinking a desktop layout afterwards.
Where people get burned Pitfalls
User-agent detection that redirects to a separate mobile subdomain doubles the maintenance and halves the attention each version receives. It was the standard a decade ago and it is now the source of most mobile indexing failures.
This entry was written in English from the Chinese original, not machine-translated. Read the Chinese version →