Shop.org 2017 Tech talk website speed for ecommerce why it matters and how to improve yours_section.io_brewer
Download as PPTX, PDF0 likes67 views
Website speed is important for ecommerce sites as slower sites see decreased conversion rates and revenue. Key metrics for measuring performance include page load time, conversion rates, and bounce rates. Improving performance can be done through minor optimizations like image compression and caching, or more significant changes like implementing a content delivery network or upgrading to HTTP/2. Case studies show sites with faster speeds see more product views, higher checkout rates, and increased revenue.
Shop.org 2017 Tech talk website speed for ecommerce why it matters and how to improve yours_section.io_brewer
- 1. Website Speed for Ecommerce Why it Matters and How to Improve Yours CJ Brewer Software Engineer
- 2. Website Speed for Ecommerce Why it Matters and How to Improve Yours CJ Brewer Software Engineer section.io
- 3. Agenda • Website performance • Performance and revenue • Measuring performance • How to make it better • Case studies 3
- 4. What is website performance? • Page load time • Conversion rates • Bounce rates • Handling traffic spikes
- 6. Amazon lost 1% in sales for every additional 100ms in page load time. Walmart found page speeds of 1- 2 seconds are twice as likely to convert at speeds of 3-4 seconds.
- 7. Synthetic measures • Webpagetest Real user monitoring • New Relic How do you know if your site is slow?
- 8. Visually Complete Fully Loaded Page Load Time Start Render Time What to measure
- 9. What does fast look like? • > 1 second time to start render • 2-3 seconds visually complete
- 10. Little wins to improve performance • Image optimization • Render blocking JS • Unused CSS
- 12. • Caching (Varnish cache) • Use a Content Delivery Network • Upgrade to HTTP/2 • Greatly improves mobile • Choose a good hosting provider How do I get big wins?
- 13. Viewed 9.4% more product pages Reached checkout page 15.5% more often Reached checkout success page 16.5% more often Resulted in consistently higher revenue
- 14. • What website performance means • How performance impacts revenue • Metrics to measure your performance • Steps to take to improve performance What we learned
- 15. Check out section.io to improve your performance Booth #1911 @sectionio info@section.io
Editor's Notes
- #5: Website performance as an umbrella phrase can mean many different things – if your business is focused on upping conversion rate, a website that converts poorly could be considered to be performing badly for your business needs.
- #6: However, technical definition of “website performance” focuses on one element of websites, speed. Website speed tent. impacts all the other elements of performance - bounce rate, conversion rate, cart size, and even scalability because the faster pages load, the more visitors you can serve at once.
- #7: It’s not just user experience that takes a hit – many studies have proved the impact website speed has on sales. Was on slide: Studies by major ecommerce sites have demonstrated impact of speed on revenue:
- #8: Once you know what metrics to collect, here are some of the tools you can use. There are two main categories to website performance monitoring tools - synthetic, which simulates real visitor behavior, and Real User Monitoring, which captures information on the actual visitors using your site. Synthetic monitoring cannot account for the complexities of how actual visitors see and browse around your site, but for basic website performance tests it gives good metrics. Real user monitoring or RUM is an excellent tool if you can get it, but requires your website to have enough actual visitors to test and often requires buying a specific RUM platform. Synthetic platforms we recommend include WebPageTest and Pingdom. WebPageTest will provide you with the metrics we described in the last slide, and a “waterfall test” that shows what elements are taking the most time to load and which may be delaying other elements from loading. New Relic is an excellent RUM tool that provides advanced monitoring, including server-side statistics and scalability monitoring if you are looking for that level of detail.
- #9: Once you know what metrics to collect, here are some of the tools you can use. There are two main categories to website performance monitoring tools - synthetic, which simulates real visitor behavior, and Real User Monitoring, which captures information on the actual visitors using your site. Synthetic monitoring cannot account for the complexities of how actual visitors see and browse around your site, but for basic website performance tests it gives good metrics. Real user monitoring or RUM is an excellent tool if you can get it, but requires your website to have enough actual visitors to test and often requires buying a specific RUM platform. Synthetic platforms we recommend include WebPageTest and Pingdom. WebPageTest will provide you with the metrics we described in the last slide, and a “waterfall test” that shows what elements are taking the most time to load and which may be delaying other elements from loading. New Relic is an excellent RUM tool that provides advanced monitoring, including server-side statistics and scalability monitoring if you are looking for that level of detail.
- #10: Some recommended goals for your website are -Under 200 ms TTFB -Under 1 second start render -Under 2 seconds visually complete
- #11: Where should you start when improving performance? Here are some easy steps anyone can take -Reduce image sizes and optimize them for web. Even if an image appears smaller due to HTML resizing, the browser will have to load the full image size. Avoid this by sizing images for the max width they will appear on your site. You can also save at a lower quality for many online uses. There are several free online tools that will both resize and compress images for free. -3rd party Plugins such as Google Analytics and other marketing tools can dramatically slow down your site. Regularly review your code and view Waterfall tests to see what javascript plugins are setup on your site and how much they are slowing it down. -Smaller CSS files will load more quickly, so review your CSS code regularly and use a free minifying tool if needed.
- #12: For real performance improvements, you’ll have to implement some of these tips. Some will require a developer to setup however the speed improvements are worth the time and cost of implementation. -Go through this list briefly
- #13: For real performance improvements, you’ll have to implement some of these tips. Some will require a developer to setup however the speed improvements are worth the time and cost of implementation. -Go through this list briefly
- #14: Consistently those going through a faster website were shown to view more pages overall, more product pages, bounce less, and reach both checkout and checkout success page more often. We left the tests in place for several weeks to ensure results were real and found the same thing week after week.
- #16: Website performance as an umbrella phrase can mean many different things – if your business is focused on upping conversion rate, a website that converts poorly could be considered to be performing badly for your business needs.