Most popular layout patterns

Fixed, fluid, adaptive, and responsive are the four main categories of layouts for websites. Responsive layouts can be categorized even further. In 2012, Luke Wroblewski released an article titled Multi-Device Layout Patterns (http://www.lukew.com/ff/entry.asp?1514). Here, Luke categorizes responsive layouts under 5 labels; tiny tweaks, mostly fluid, column drop, layout shifter, and off canvas. His categorizations caught on and are now commonly used when talking about RWD layout patterns. Together, we will review these patterns and see how they are made.

Note

You can view all these patterns live at http://chelmyers.github.io/RPL/layouts/.

Tiny tweaks

Let's start by looking at the easiest layout pattern. This pattern doesn't ...

Get Responsive Web Design Patterns now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.