Optimize load performance of website or SaaS application
You don't get a second chance to make a first impression! 40% of people on many sites will leave by 3 seconds. By 10 seconds, they are multi-tasking and have probably already left your site, never to return.
Summary:
Initiated project concept, educated stakeholders, analyzed and optimized load times for corporate website.
Challenges:
- bringing together siloed departments and stakeholders,
- changing the company mental model to realize the importance of performance
Process & methodologies:
- analyzed with testing tools GTMetrix and webpagetest.org for individual and competitor benchmarking
- inspected with Chrome Developer Tools
- educated company on image optimization
- showed how all images could be optimized for size with KB savings per image
- set up grunt process to automatically optimize images
- showed how CSS and JS code could be automatically minimized with KB savings
- brought analytics in and identified Chrome as top browser, which meant we could use image srcset with webp,
- created overall and per country desktop and mobile performance dashboards,
- set OKRs for phases
Tools:
- GTMetric and webpagetest.org test sites,
- Chrome Developer Tools,
- Google Analytics,
- Grunt/npm/node (optimizing images)
What's your 5-second impression?
This was the loading performance for the company I was working for. At the time, your site needed to have loaded by 5 seconds.
How do you stack up against your competitors?
If your site is slower than your competitors, you're already losing business. In this case, the company was far behind its main competitors.
Analyze critical paths
Identify where you can streamline your customer's journey. This shows the table, but I have removed the relevant information, in the interest of privacy
Don't force-feed your users
I found a 10MB image that the marketing team had inadvertently uploaded to the site. All customers and potential customers will experience network issues at some point. Plan for it. Some are on data plans. Don't punish them for visiting your site!
Optimize images
Are your images the right size for their containers? Provide srcsets of images so that browsers can pick the best one. For example, if you have a lot of Chrome users, webp is about 35 percent smaller in terms of file size.
Know your audience
Where are your users located? What screen sizes are they using? What devices? What is your most popular browser? How fast is the desktop experience? Their mobile experience? Remember that mobile is generally 2 seconds longer than desktop.
Learn more about load performance.