Responsive web design

[1][2] A responsive design adapts the web-page layout to the viewing environment[1] by using techniques such as fluid proportion-based grids,[3][4] flexible images,[5][6] and CSS3 media queries,[7][8][9] an extension of the @media rule,[10] in the following ways: Responsive web design became more important as users of mobile devices came to account for the majority of website visitors.

[11][12] In 2015, for instance, Google announced Mobilegeddon and started to boost the page ranking of mobile-friendly sites when searching from a mobile device.

Many web developers resorted to ordinary HTML tables as a way to customize the layout and bring some basic responsiveness to their websites at the same time.

First major site to feature a layout that adapts in a non-trivial manner to browser viewport width was Audi.com launched in late 2001,[32] created by a team at razorfish consisting of Jürgen Spangl and Jim Kalbach (information architecture), Ken Olling (design), and Jan Hoffmann (interface development).

[35] Ethan Marcotte coined the term responsive web design[36]—and defined it to mean fluid grid / flexible images / media queries—in a May 2010 article in A List Apart.