Key Takeaways from Google’s Site Speed Hackathon in NYC

Roy Hodges / 23rd May 2017 / Comment

Site speed is about dollars.

Pause on that — it’s that important.

Whether you’re working in paid advertising, digital marketing strategy, SEO, email marketing, or any other channel, this cannot be emphasized enough. It’s clear that improving site speed is one of the most important CRO efforts out there. Knowing this, we jumped (yes, quite literally) at the chance to be one of the only marketing agencies invited to attend a new series of site speed hackathons hosted by Google (this was the third one ever).

The concept was simple. Spend a day (in the form of a competition) working with Google and our client’s developers to hack sites to increase speeds. The clients committed to supply a few of their UX engineers and Google in turn provided a venue, food and a team of UX engineers led by Ryan Warrender, a Mobile UX Lead for Google.

“That’s really what my team does, we find all the little things that can make a huge impact on your business.” – Ryan Warrender, Winning on the Mobile Web, Brazil

“It’s great to have a day to focus on increasing speed, with no interruptions…” – Every Engineer in Attendance

Our agenda was short and sweet!

We met, broke the ice, Ryan presented, we started the hack session, ate lunch in Google’s wonderful cafeteria and then at the end of the session, we voted who we thought deserved the award for the best “hack session”.

Finally, the winning team received Google Homes for each team member and we had a feedback session to improve future events with the promise of being first in line for future invites to events, some longer, around User Experience Design etc. (our group’s suggestions).

What is Mobile Speed?

Mobile speed is the speed at which mobile users perceive your website to perform.

Your corporate network environment is faster than a phone’s connection to the internet through a cellular provider, and probably less prone to this nasty thing called “packet loss.”

Mobile devices are slower, and it’s important to see what a website looks like on a mobile device connected to 3G rather than WiFi.

Why Does Mobile Site Speed Matter?

We know site speed is theoretically important — faster is always better! But in order for it to get the attention it deserves, site speed needs to be put it in the context of business value. To get there, let’s first look at data around device usage and connection speeds in 2017.

A few takeaways:

  • Mobile is growing FAST GLOBALLY (~10%)
  • 53% of customers will abandon a site that takes over 3 seconds to load
  • 1 in 5 users will NEVER return to a website with which they were not satisfied

And a few memorable quotes from Ryan:

  • “Would you shut your door to 20% of users?” – Ryan
  • “Speed thrills, friction kills!” – Ryan
  • “Amazon doesn’t just focus on seconds, they focus on milliseconds.” – Ryan

So Where Does Revenue Come Into Play? “Every second counts…”

SPEED = MONEY!

Top 3 Metrics to Focus On for Site Speed

1. Speed Index: Average Time Everything Above the Fold Is Rendered

Everything above the fold should load preferably in less than 3 seconds at 3G speeds!

2. Total Requests: < 80 requests

Efficiently deliver the page and all supporting resources in less than 80 requests.

3. Page Weight: < 1.00MB

Keep the weight small, keep images compressed as small as possible, and use the least amount of images to get the intent across to the user!

These are fixes you can do in 24-48 hours! They are not six-month projects.

Design + Performance = Great User Experience

Design isn’t hindered by performance, it should go hand in hand. The way things look and the way things feel when interacted with are critical in delivering a rich experience to skate past competitors, compress the funnel and increase revenue. Be sure to design with performance in mind — and involve engineers during the design phase! Good software designers will design with performance in mind.

This pairing of design and performance can manifest in all kinds of creative ways. One interesting use case came up during the Hackathon: some companies approach site performance through a complete redesign rather than iterative improvements. Flipkart, for example, even went so far as completely abandoning the stock ecommerce site (I have to wonder how that was pitched to the board), building a web application, completely simplifying their user experience and increasing conversions by 70%! This “stuff” is important – it’s service design. Your site’s performance is a reflection of your brand, and that reflection sticks forever in the mind of a new user.

Some tips from Ryan:

  • Paradigms from Uber, Amazon, Twitter, etc. drive consumer/customer expectations; brands that approach these paradigms stand above their competitors.
  • Consider Google’s “25 Design Principles”
  • Track mobile users
  • A/B test!
  • Consider AMP (Accelerated Mobile Pages)
  • Consider PWA (Progressive Web Apps)

So Where Do You Go From Here?

You might be asking: this is great, but what’s next? Where do I start? Typically this is the point where a UX engineer will dive into a site and examine where the most meaningful value can be made from speed tweaks. Some tweaks are larger and more involved, some are smaller, so having a prioritized list is important.

Want some help? Wheelhouse has an in-house engineering team with a background in product management and marketing. We can work with your teams to prioritize, estimate, and hit the ground running in your upcoming Agile sprints.

Last but not least… if 87% of mobile users spend time in native apps and 13% on the web, how fast do you think your website should be to get more of their attention?

By Roy Hodges