How We Hold Our Gadgets

Touch adds a new dimension to our designs, and asks us to think not only about the canvas of the screen, but also about how users interact physically with the screen itself. We need to consider the ergonomic needs of holding a smartphone, tablet, or hybrid device—switching hands, swapping grips, and pointing, clicking, and typing. In this excerpt from Chapter 1 of Designing for Touch, Josh Clark examines the role of thumbs in driving our device interactions, no matter the size of the screen.

How Do We Get It Done, Now?

In the future that’s forever one short year away, brilliantly functional, widely implemented APIs will redeem us from our toil and trouble. We just have to get ready for their coming, while seeing to the nitty-gritty of making the web work in the present. Sadly, it’s a lot less predictable than that. Every new standard has to start small, and we’ll always need to choose which API to back and which to pass over.

Container Queries: Once More Unto the Breach

Media queries have been the go-to tool in building responsive sites, allowing us to resize and recombine modules to suit multiple contexts, layouts, and viewports. But relying on fixed viewport sizes can quickly twist stylesheets into Gordian knots. We still need a future-friendly way to manage responsive CSS. Mat Marquis explores the problem and the progress toward the solution—and issues a rallying call.

Instant Web

For some, Facebook’s Instant Articles is a sign that the traditional web stack is incapable of giving users a first-class reading experience. But the sluggish performance of the web isn’t due to an inherent flaw in the technology. That particular problem originates between the seat and the keyboard, where builders make choices that bloat their sites. For Mark Llobrera, Instant Articles is a sign that we need to prioritize performance like we actually mean it.

Readable Wearables

Displays that are more tiny than our lowest-size breakpoints require a more condensed range of type sizes. If you don’t already have in place a typographic system that can absorb the demands of this new context (watches, wearables, digital sticky notes, whatever), now might be the time to consider it. Matt Griffin was ready for anything because his site was simple and built to be future friendly.

Planning for Performance

We should build websites that are not merely responsive, but sustainable, globally accessible, and, well, responsible, as Scott Jehl suggests in his new book, Responsible Responsive Design. Our approaches to responsive websites need to consider ever-changing devices, limited networks, and unexpected contexts. In this excerpt from Chapter 3, Scott discusses page load times and the responsible delivery of code.

Awkward Cousins

As users we switch seamlessly between the web and apps, yet as designers and developers we huddle in separate rooms. Wouldn’t this party be livelier if we mingled?

Look at the Big Picture

It’s easy to see that automation can streamline image-optimization for all the varied contexts on the pan-device web. What’s harder to imagine is a future where foregrounding meaningful content in images can be handled by an algorithm. Art direction still requires human intervention, and that’s often a luxury in high-production environments.

Designing Offline-First Web Apps

We assume our users are like us—with the latest devices, the most recent software, and the fastest connections. And while we may maintain a veritable zoo of older devices and browsers for testing, we spend most of our time building from the comfort of our modern, always-online desktop devices. But what happens when our users descend into the subway, board a plane, go to live in the country, or just happen to find themselves in the wrong corner of the room? The truth is, offline is a fact of life—but there are ways to design for it. Alex Feyerke tells all.