Responsive vs Adaptive

Responsive, adaptive, flow, relative units, breakpoints, max and min values, nested or desktop or mobile… and more.

Saving these for reference. Great visuals:

Responsive / Adaptive:

01_Responsive-vs-Adaptive

Relative Units / Static Units:

02_Relative-Units-vs-Static-Units-1

With Breakpoints / Without Breakpoints:

03_With-Breakpoints-vs-Without-Breakpoints-1

Flow / Static:

04_Flow-vs-Static-2

Nested / Not Nested:

05_Nested-vs-Not-Nested-1

System Fonts / Webfonts:

06_System-fonts-vs-Webfonts-1

Max Width / No Max Width:

07_Max-width-vx-No-max-width-1

Desktop First / Mobile First:

08_Desktop-first-vs-Mobile-first-3

Vectors / Images:

09_Vectors-vs-Images-1

h/t: froont

%d bloggers like this: