Notes from “Designing for Performance”

Published on .

I recently finished Lara Hogan’s brilliant and informative book Designing for Performance: Weighing Aesthetics and Speed. If you build websites for a living or work with people who do, stop what you’re doing and get yourself (or your team) a copy! It’s an easy read, replete with clearly and concisely explained examples detailing how you can test and improve the performance of your websites.

The following is a collection of my favorite quotes from Designing for Performance.

Statistics

As you might imagine, Designing for Performance is jam-packed with statistics. Early on, Lara throws down the performance gauntlet:

If you’re looking for a page load time benchmark for your site, this is it: users expect pages to load in two seconds, and after three seconds, up to 40% of users will abandon your site. Moreover, 85% of mobile users expect sites to load at least as fast or faster than sites on their desktop.

Two seconds is all the time you have to get usable content in front of your website’s visitors before they start bailing. More importantly, your users expect your website to function consistently across all of their devices, regardless of the nature of that device or the conditions under which they’re attempting to access it. This may sound unfair—or frustrating or infuriating—but that’s the reality we face.

In one study, researchers found that if Amazon converted all of its image files to JPEGs at 92% quality compression, it would save 20% of the energy needed to load its home page on an Android phone, and Facebook would save 30% doing the same.

Image compression is one of the more obvious performance improvements you can make as images tend to consume high amounts of bandwidth due to their file size. You (or your team) should look for opportunities to automate image compression using tools like ImageOptim.

Akamai has reported that 75% of online shoppers who experience an issue such as a site freezing, crashing, taking too long to load, or having a convoluted checkout process will not buy from that site.

The effect of site performance on e-commerce isn’t news: Luke Wroblewski rounded up a collection of case studies back in 2012. That 75% of online shoppers will abandon a website blew my mind.

These are just a few of the many useful stats in Designing for Performance. Tammy Everts and Tim Kadlec also recently set up WPO Stats with links to a ton of great performance-related resources and case studies.

Designing the Experience

The mobile experience shouldn’t be bare-bones. It should be a deliberate experience.

This bit of insight ties in with the quote from above: users expect not only that your website perform consistently regardless of how they access it, they also expect to accomplish the same tasks regardless of the device they’re using.

Performance is closely linked to aesthetics. Front-end architect and consultant Harry Roberts notes, “it’s not about how nice something looks, it’s about how nicely it works, how it feels. There’s no point designing a nice, shiny, beautiful UI if it’s going to take 20 seconds to end up on a user’s device. They’ll have left before they even got to see it.”

I’ve written previously about the intersection of front-end development and user experience design. Visual designers, front-end developers, and user experience designers all shoulder the responsibility of designing a high-performance website.

When an outcome of an experiment is better for your business metrics, gut-check it to make sure it’s still great for your users.

Ferocious user advocates of the world: unite!

Culture

Culture change is perhaps the hardest part of improving a site’s performance.

Lara dedicates an entire chapter to this very topic. Like so much of software development, the hard part is people. As developers, we have a tendency to ignore that so it’s noteworthy that Designing for Performance covers culture in-depth. In fact, Lara penned today’s 24 ways article “Helping VIPs Care About Performance” in which she summarizes many of her points from Designing for Performance.

Rather than quote every single thing from the chapter on culture, I’ll instead encourage you to read Lara’s 24 ways article and (of course) pick up a copy of Designing for Performance. Get out there, establish a culture of performance in your organization, and build a faster Web!