Responsive design

Responsive design is building one site that adapts its layout to the size of the screen it is on, rather than maintaining a separate mobile version. Columns become rows, navigation collapses, images scale.

It has been the default for over a decade, and the reason is arithmetic: most traffic to most sites is on a phone, and two separate sites means two of everything, including two places for content to go out of date.

The discipline it requires is designing for the small screen first. A layout designed at desktop width and then squeezed produces the familiar result — a phone view that is technically functional and clearly an afterthought.