Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

Web Performance Optimization: The Silver Bullet of SEO and UX

How can companies increase conversion, drive more traffic, and increase customer satisfaction? By focusing on web site performance. It's like the silver bullet of customer experience!

In this presentation at SMX Advanced 2012 in Seattle, Jonathon Colman, the in-house SEO at REI walks us through the business case around site speed optimization and shares five key tips to make your site perform faster for the benefit of your customers.

There's also quite a few references to Twilight, Jacob Black, werewolves, and Taylor Lautner.

You can learn more about Jonathon Colman at

Web Performance Optimization: The Silver Bullet of SEO and UX

  1. Photo © Flickr user Nayara - Oliveira at
  2. WEB PERFORMANCE OPTIMIZATION: The Silver Bullet of SEO and UX Jonathon Colman Twitter @jcolman Agile SEO for REI www.REI.comPhoto © Flickr user eschipul at
  3. While you’re here, check out REI’s Flagship Store…Photo © Flickr user Sonofabike at
  4. Then get out and explore our native forests and woodlands on a hike…Photo © Flickr user sha-put-ski at
  5. But watch out for… WEREWOLVES!Image found at
  6. They’re snarly! And mean! And shirtless!Image found at
  7. And yet so vulnerable…Image found at
  8. Some people find them oh so attractive…Image found at
  9. They even have their own fan clubs!Photo © Flickr user spacedustdesign at
  10. What’s the only thing that can stop them? A silver bullet! (or, uhh, love I suppose)Image found at Photo © Flickr user eschipul at
  11. Site Speed is Your Silver Bullet For conversion rate optimization For customer experience and satisfaction For lowering bounce rate For increasing organic traffic for the most competitive keywords For increasing overall competitiveness For saving money on operations For getting out even the toughest stains!
  12. MAKE THE CASE FORWEB PERFORMANCEOPTIMIZATION Tip: it’s easier than you might think…
  13. Google uses speed as an organic % search ranking factor for the top 1% of competitive queries.Sources: Google, Matt Cutts [via Search Engine Land]
  14. Customers expect your web site to load in 2 seconds or less.Source: Forrester/Akamai [via GetElastic]
  15. 40% of customers will abandon any site that takes longer than 3 seconds to load.Source: Forrester/Akamai [via GetElastic]
  16. The average Fortune 500 company web site takes 7 seconds to load.Source: Andrew Davies, Web Performance: A Whistlestop Tour…
  17. % For every 1 second of load time, conversion drops by 7%.Source: Strangeloop
  18. % For every 1 second of load time, user satisfaction drops by 16%.Source: Strangeloop
  19. % A faster site reduces the costs of infrastructure and releases by 50% or more.Source: Shopzilla [via O’Reilly]
  20. “When [web sites] are fast, you feel good. What that comes down to is that you feel in control.” “That feeling… FYI: THIS IS NOT translates to ACTUALLY MATT. happiness.” Matt Mullenweg Co-founder of Wordpress Source: Improving Performance in Mature Web AppsImage found at
  21. Hey Girl, I’m convinced…Image found at
  22. Back off, Gosling. This is my show. GRRRRR…Image found at
  23. Image found at
  24. 5 KEY STEPSFOR OPTIMIZINGWEB PERFORMANCE You – yes, you! – can get started today…
  25. Study and learn from the bestSources: Yahoo, Google, Steve Souders
  26. Free tools can help you get started nowSources: Yahoo! YSlow, Firebug, Google Page Speed, Google Analytics, WebPageTest and Pingdom
  27. Set a far-future Expires header EXAMPLE HEADER: Expires: Tue, 06 June 2023 22:00:00 GMT RATIONALE: Helps with re-loads of static page objects and components by caching them. Use across all content types.Source:
  28. Don’t dupe JS, remove unused CSS ON-PAGE CODE EXAMPLE: <script type="text/javascript" src="taylor.js"></script> … <script type="text/javascript" src="taylor.js"></script> RATIONALE: Creates unnecessary HTTP requests and wasteful JS execution. As team size/code complexity increases, so do duplicates and unused code! Refactor or remove code you’re not actively using.Sources: and
  29. <link> your CSS, avoid @import ON-PAGE CODE EXAMPLE: <link rel="stylesheet" href="jacob.css"> <link rel="stylesheet" href="edward.css"> RATIONALE: Allows for parallel downloading and avoids additional delays.Source:
  30. Avoid redirects WTF?! RATIONALE: Cuts down on wait time for users by avoiding an entire request-response cycle and the latency that goes with it.Source:; Image found at
  31. CSS sprites reduce HTTP requests CSS PROPERTIES USED: background-image: url(img/twilight-icons.png); background-position: 0 0; RATIONALE: Reducing total HTTP requests greatly improves site performance. Combining common images into “sprites” reduces requests, latency, overhead, and total page file size.Source:
  32. Best practices for CSS sprites Combine images into sprites when:  Images load together  Images have similar color palettes  Images are PNGs and/or GIFs  Images are both small and cacheable Do not use for large JPGs/photos.Source:
  33. Here’s a site-wide sprite on Implementing these CSS sprites saved us nearly a whole second of avg. page load time.Source:
  34. Here’s a complex Google exampleSource:
  35. This sprite is a 60-frame animation!Source:
  36. RESULTSOF OPTIMIZINGWEB PERFORMANCE “Racing down the road like that had been amazing. The feel of the wind in my face, the speed and the freedom…”
  37. A-50% decrease in the time it tookfor Google to crawl an average page.
  38. A+100% increase in the amount oftotal pages Google crawled per day.
  39. We saved customers -1.5 seconds perpage view. Multiplied by all page views…
  40. We saved customers 22 years of time.Image found at
  41. Time they’ll spend outside vs. onlineImage found at
  42. In Conclusion Requiem: The site performance business case isn’t just about SEO – it’s about customer UX Plan a budget/time for performance work Start with quick wins, “shrink the change” Set speed targets for all new features Measure, celebrate, repeat  And release a sequel in two separate parts
  43. Thank you! Jonathon Colman Agile SEO for REI Home: Twitter: @jcolman E-mail: jcolman@rei.comNote: no werewolves were harmed in the making of this presentation.