Chapter 2
Making a Web App Responsive
IN THIS CHAPTER
Using Flexbox, Grid, and viewport units for fluid layouts
Using media, container, and user preference queries for adaptive layouts
Making your page typography responsive
Delivering images responsively
Getting to know the mobile-first approach to layout
The web’s greatest strength, I believe, is often seen as a limitation, as a defect. It is the nature of the web to be flexible, and it should be our role as designers and developers to embrace this flexibility and produce pages which, by being flexible, are accessible to all.
— JOHN ALLSOP
A web app is something like the online equivalent of a desktop program, but that doesn’t mean you should build your web app to look good and work properly only on desktop-sized screens. Why not? For the simple reason that your app’s visitors will be using a wide range of device sizes, from PCs with gigantic displays several feet wide, all the way down to smartphones with screens just a few inches ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access