Squishy Pixels
summary
Claims that Adaptive Web Design is a superset and Responsive is just one technique, then demonstrates concrete tools: flexbox (grow/shrink/basis, nesting, production use in Ionic), server-side image resizing plus picture element or imager.js/mobify.js, responsive typography via viewport units and rems or flowtype.js, and progressive enhancement with cutting the mustard. Shows migration patterns (BBC’s mobile-first seed) and ad-handling examples (Words site). Practical performance notes include profiling, GPU-avoid relayouts, and when server templates still pay off.
AI-written summary · about
chapters (13)
- 0:00Start
- 1:54Responsive Web Design
- 3:44RESS: RWD + Server Side Components Device Detection Adaptive Layouts
- 4:01Progressive Enhancement
- 4:58The purpose behind responsive design should be separated from the specific techniques used to achieve it.
- 5:21Responsive Adaptive Web Design
- 5:35Create A Single Web Experience
- 6:02Content
- 10:11Server Side Templates Headaches Included
- 10:33Presentation
- 14:24Responsive Tables Squishing VS Grouping
- 15:31Optimize Animations for 60fps Everywhere
- 16:05What Triggers Re-Layouts? What Triggers Re-Paints? How To Leverage the GPU?
related talks
15mResponsive Design vs. Adaptive Design
33mResponsive Design in 2020
01h 01mThe Evolution of Responsive Web Design: What's Next?
45mHow Responsive Are You in CSS? 2026 Edition
50mLaziness in the Time of Responsive Design
49mPanel 4: Responsive Layout
39mWhat about CSS? Progressive Enhancement and CSS
38mWhat Doesn't Fit Gets Made Responsive