“It’s pretty simple. On a phone, full-size websites suck.”
On most small viewports—such as those on phones—we can only view the content of a web page in a linear fashion. It’s possible to place things side-by-side on many devices, but not all of them. It depends on both the size of the device and the level of CSS support. In this chapter, we’ll look at determining breakpoints for our design and content based on device classes and what the content and design do at certain screen widths.
When I speak of linear design, I mean the design of linear content. Color, type, and images may be used, but the design has no layout other than that the content is stacked vertically.
First, though, we need to accept the ...