Site building · Website glossary

Responsive design

Quick answer · What is Responsive design?

An approach that adapts content presentation to available space and device characteristics.

IN PRACTICE

Responsive design: an example

A product grid changes column count while controls remain readable and usable on a phone.

KEEP IN MIND

Shrinking a desktop page is not sufficient; test real content, navigation, zoom, and touch targets.

Put the idea to work

Frequently asked questions

What is a practical example of Responsive design?

A product grid changes column count while controls remain readable and usable on a phone.

Is shrinking a desktop page enough for responsive design?

Shrinking a desktop page is not sufficient; test real content, navigation, zoom, and touch targets.

Which concepts should I read alongside Responsive design?

Viewport: The region through which a user views a web document, with layout and visual viewport concepts on mobile devices.
Responsive images: Image markup that lets a browser select suitable sources for layout size, resolution, or art direction.