Customers will be thrilled to visit a site with high page load speed. A slow loading page forces the customer to leave the site, killing the conversion rate.
Website page load speed depends on numerous factors like unoptimized images, HTTP requests, bulky codes, and JavaScript issues, and more. It is difficult to identify an exact reason for a slow page load, however, identifying the root cause and rectifying the same is crucial for your website!
This article details page speed, what makes your page score lesser, and how to optimize page speed.
Importance of Page Speed Optimization
Faster page speed is essential for ranking and keeping your profits high!
1. Efficiency and Convenience
Most users rely on faster pages because they tend to believe, faster pages are user-friendly and efficient. Our attention span is eight seconds, however Kissmetrics’s study states that the attention span is even shorter for World Wide Web, ie, three seconds. If the page load takes more than 3s, one-quarter of the customers will leave the page abruptly, affecting conversion!
Inshort, every second matters as it has a huge impact on customer engagement and sales.
A few extra seconds could have a huge impact on your ability to engage visitors and increase sales.
2. Better Conversions
Page speed has a huge impact on customer behavior. The conversion rate is defined as the percentage of customers who have taken the desired action. The conversion rate is directly proportional to the website revenue. The amazon theory states that if their site speed slows down by just one second, every year they would lose $1.6 billion.
Let us take Walmart as an example.
They increased their site speed and the analysis surprised them!
- 1S site speed improvement = 2% increase in conversions
- 100ms improvement = 1% of growth in revenue
This means,
For one second delay in page load results.
- Page views reduced by 11%
- Customer satisfaction decreased by 16%
- 7% loss in conversions
3. Google Ranking
Google has announced, from May 2021, page experience signals will be a prominent factor for Google Search rankings. These signals are the experience of users when interacting with a web page. This interaction helps users to determine whether the page is helpful and efficient.
According to this new announcement, core-web vitals will be a crucial ranking factor. Till now, mobile-friendliness, safe browsing, HTTPS security were considered as the major ranking factors.
Web Vitals: An Overview
Web Vitals is an initiative by Google to guide users on quality signals that are unavoidable to deliver a comfortable user experience. There are a number of tools provided by Google to measure these performances. End-users don’t have to worry about these Vitals as they aim to ease the landscape and help websites concentrate on Core Web Vitals- the metrics that matters the most.
Core Web Vitals: The New Ranking Signal
Core Web Vitals are the metrics that primarily focus on responsiveness, speed, and visual stability. According to the latest news, the ranking signal will be called as page experience signal and it comprises of the Core Web Vitals and the existing page experience metrics.
- Mobile-friendliness
- Safe-browsing
- HTTPS-security
- Intrusive interstitial
Why Does Core Web Vitals Matter?
As Google puts it:
“Core Web Vitals are a set of real-world, user-centered metrics that quantify key aspects of the user experience. They measure dimensions of web usability such as load time, interactivity, and the stability of content as it loads (so you don’t accidentally tap that button when it shifts under your finger – how annoying!)”
However, content relevance is still important when it comes to rankings. Even if the page has a poor signal but offers content that’s highly relevant to a query will rank well.
Google states:
“A good page experience doesn’t override having great, relevant content. However, in cases where there are multiple pages that have similar content, page experience becomes much more important for visibility in search.
- Largest Contentful Paint (LCP): Largest Contentful Paint (LCP) is the time taken for the main content of the page to load. 2.5 seconds or faster is an ideal LCP measurement.
- First Input Delay(FID): First Input Delay(FID) is the time taken by a page to be interactive. 100 ms is regarded as an ideal FID measurement.
- Cumulative Layout Shift (CLS): Cumulative Layout Shift (CLS) is a user-centric metric that measures visual stability. It is the unexpected layout shift of a page’s visual content. An ideal measurement is less than 0.
You should care about Core Web Vitals because:
- Customers love faster sites
- Better user experience
- Google Ranking factor
Tools to Measure Core Web Vitals
According to Google, the Core Web Vitals are significant to the overall web experience. In all popular tools, Google has incorporated these metrics. The tools that support Core Web Vitals are detailed below.
Core Web Vitals can now be measured using:
- Search Console
- PageSpeed Insights
- Lighthouse
- Chrome DevTools
- Chrome UX Report
- Web Vitals Extension
Search Console
In Search Console, there is a new Core Web Vitals report to help site owners to analyse the progress of pages of an entire site. This report details the page that needs attention according to the data received from the Chrome UX report. With this report, URLs without a minimum amount of reporting data will be omitted.
PageSpeed Insights
PageSpeed Insights is upgraded to use Lighthouse 6.0, making it capable of measuring Core Web Vitals .
In performance analysis, Google Pagespeed Insights is considered as the leading field-testing tool. The report is generated separately for both web and mobile devices, providing suggestions for improvement, if required. To improve pagespeed insights , enter the webpage URL and within a few seconds a complete analysis of the webpage will be received.
ChromeDevTools
ChromeDevTools are built in the Google Chrome browser. It is a set of web authoring and debugging tools. It provides deeper access, helps edit websites, analyse problems and measure performance. To improve First Input Delay (FID), Chrome DevTools measures Total Blocking Time (TBT).
In 4 steps, Chrome DevTools give access to Core Web Vitals.
- Open DevTools and navigate to the Performance tab.
- Click record button and reload the page manually
- Once the page is reloaded, stop the recording
Chrome UX Report
CruX, otherwise known as Chrome User Experience Report is the real user measurement offering public dataset. Crux measures the field versions of Core Web Vitals along with other diagnostic metrics. The CruX Dashboard has a customizable data visualization tool which is built on Data Studio.
Web Vitals Extension
The Web Vitals extension acts as a diagnostic tool that helps to identify problems with your site and evaluate the performance of Core Web Vitals.
9 Tips to Improve Page Speed
After measuring the Core Web Vitals , identify the areas to improve and optimize these vitals. By rectifying these issues and optimizing the same, you can improvise the page speed.
Firstly, let us see what are the common causes of a poor LCP
- Slow server response times
- Render-blocking JavaScript and CSS
- Slow resource load times
- Client-side rendering
Next comes FID.
The cause of a poor FID is heavy JavaScript execution. To reduce FID, you can optimise how JavaScript compiles, parses, and executes on a web page.
To improve this:
- Break up Long Tasks
- Optimize your page for interaction readiness
- Use a web worker
- Reduce JavaScript execution time
Lastly, let us focus on the common causes of a poor CLS.
- Images without dimensions
- Ads, embeds, and iframes without dimensions
- Dynamically injected content
- Web Fonts causing FOIT/FOUS
- Actions waiting for a network response before updating DOM
What are the factors that affect page speed?
There are a few common mistakes that slow down a page and they are as follows.
1. Unoptimized Images
Unoptimized images slow down websites as high-resolution images require lots of bandwidth. . Another major factor is image format, PNG or GIF formats are large sized when compared to JPEG images. Using small sized images help your site load faster.
Takeaways:
- Anything above 1MB is really unacceptable
- Use JPEG
- Scan image size before uploading
2. JavaScript Issues
Incorporating dynamic content has become convenient with the availability of JavaScript/jQuery plugins. However, JavaScript can cripple a website page load speed if implemented incorrectly. They need time to load, interpret and execute. Also, using multiple API calls can result in a delay to load the web pages.
Takeaways:
- Audit JavaScript scripts to identify what is required
- Asynchronous loading is mandatory
- Use a single script for all your tools Segment or Google Tag Manager
3. Too Much Flash Content
Flash makes websites interactive but slows down page load time because it is bulky in size. When files get bigger, page load speed will slow down.
Takeaways:
- Look for HTML5 replacements.
4. Excessive HTTP Requests
HTTP requests are a result of JavaScript, CSS, and image files. When these files are too many, the browser requires more time to load, affecting page load speed.
Takeaways:
- Reduce the number of files.
- Minify CSS and Javascript files
5. Caching Techniques
Caching improves website performance by bounds and leaps. This technique allows us to store frequently used data points in the ‘cached memory’, saving page load time.
Takeaways:
- Caching drastically improves performance
- Use HTTP, Database Queries, to images for caching
6. Unclean Code
Unclean coding can make the website stylesheet size larger, resulting in high page load time. Remove unnecessary elements and compress the code, reduce file size resulting in better page load speed. This technique is called minifying and directly benefits SEO performance as well.
Takeaways:
- Attention to detail matters.
- Use inline CSS
- Use single CSS stylesheets
- Minify
7. gZIP Compression
gZIP compression, reduce response time by minimizing the data size transferred between server and browser.
Takeaways:
- Wraps web objects (images, CSS, jS) in a single container
8. Too Many Ads
Too many Ads kill the page though they are a great source of income. Ads can overload the website and also affects user experience.
Takeaways:
- Advertisements are additional HTTP requests
- Use ads in a limited number for better user-experience
8. Not Using a CDN Service
The distributed servers in different geographic locations are CDN service. It can serve web content with maximum availability and greater performance.
Takeaways:
- CDN can help when you have visitors from around the globe
- CDN caches frequently accessed data from distributed datacenters
- They minimise round-trip-time (RTT) and provide content faster
9. Bad Hosting
Web hosting has a direct impact on websites performance. If your page takes time to load, even after rectifying the above mentioned factors, it’s time to choose a hosting provider.
How to calculate PageSpeed Score ?
The performance metrics in the Lab Data Section calculates the page speed using the seconds in the Lab Data section. The score for each metric ranges from 0 to 100 and has a different weightage.
The 6 metrics performance metrics are as follows.
3 – First contentful paint
1 – First meaningful paint
2 – First cpu idle
5 – Time to interactive
4 – Speed index
0 – Estimated input latency
Google has included a Sheet file which you can access to learn how the score is generated.
The Best Way to Improve eCommerce Site Performance
Take some time to run through Google’s PageSpeed Insights and find what’s your page score. If you are getting a 90+ score, you are enjoying preferential treatment from google, otherwise, you are losing customers beyond your imagination.
Is your score below 90? Don’t worry!
Experts at Virtina can help you optimize your page speed. We identify the reasons that slow down your page and optimize page speed bringing in better conversion and Google ranking.
Feel free to connect with us!
