Static layouts are the traditional web: one design that sits in the center of the page and requires horizontal scrolling if the window is too small for it. Wap sites (with domain like m.website.com or website.com/m) are the traditional answer to this, providing a wholly separate site for mobile browsers.
Adaptive — First regeneration of “One size fit all”
Adaptive is characterized by having defined layouts for different resolutions. Within each layout, re-sizing the window does not change the layout.
You can think of Adaptive as a series of Static layouts.
Liquid is characterized by scaling the width of parts of the design relative to the window. It tends to fail when the window is much smaller or much larger than it was originally designed for.
Responsive — hottest trend of last year
Responsive is characterized by having defined layouts for different resolutions. Within each layout, the design is liquid and re-sizes the width of elements relative to the changing window size.
You can think of Responsive as a series of Liquid layouts.
Currently I’m working on 2 separated projects, with different content and display requirement. One for news, and other for e-commerce. For series of news website, I choose responsive layout. Because the content and structure of each article is the same. I just have to care about the structure of website, and care-free about the display.
About e-commerce website, out system is changing every day, fixed layout for both desktop and mobile is too risky. So we keep mobile and desktop version are separated, so we can maintenance it easily.
For visual test: http://liquidapsive.com
Email me when Thang Pham publishes or recommends stories