See how we easily achieved a 97/100 score with Google PageSpeed Insights
Table of contents
- 2.Why care about page speed?
- 3.How to analyze your desktop and Mobile website
- Test your Desktop Site
- Test your Mobile Site
- 4.Here are some of the many ways to increase your page speed
- Enable Compression
- Minify CSS, Java Script, and HTML
- Reduce redirects
- Leverage Browser caching
- Improve Server response time
- Use a Content Distribution Network
- Optimize Images
And when it comes to building a conversion rate and search engine optimized website, speed is a critical factor. If you don’t have a quick website, people bounce faster than you can say “conversions.”Yet speeding up the website is not an easy task.
It’s often hard to diagnose what makes the website run slower than it should. Your issue could be anything from a code that’s not well crafted to photos or wide page components. And you need to effectively diagnose so resolve these issues. If you don’t, Google can blacklist your page.If you run your website via Google’s PageSpeed Insights and find a 100% score, your site is quick.
Yet Google gives preferential treatment to websites that are installed easily. The faster your site loads, the lower the bounce rate. If your site is strong, you have a better chance of Google ranking over slow sites that drive high bounce rates.Luckily, Google is providing this free tool to figure out what you need to repair.
Yet, sadly, they’re not offering you the right directions to get your performance to 100%.
Here’s how to score a perfect 100% on Google’s PageSpeed Insights and why you need to accomplish this feat.
2. Why care about page speed?
Taking these figures from Google’s Web App Speed Guide business benchmarks:
However, as the scale of the website continues to grow, google’s suggested best practice of keeping the website below 500 KB in size is also nowhere near being achieved on average.
Google is simply telling us the hard yet optimistic truth. We have serious room for improvement on our websites.
3. How to analyze your desktop and Mobile website
Test your Desktop Site
It’s 91/100 . It’s not great, it’s good either. But you’ve almost always had room for improvement. My objective here is to get you to 98% by the end of this article while we take this ride together at page speed.
Let’s take a look at the things that I optimized and perfected:
Optimizations found :
- Minify HTML
- Optimize Images
- Prioritize visible content
- Reduce server response time
Apart from the above, here are few elements in this section relative to possible optimization.
- Avoid landing page redirects
- Enable compression
- Leverage browser caching
- Minify Js and Css
- Enable compression
This knowledge shows me that the “Possible Optimizations” products are a little less efficient than those that I have already configured. But clearly, you’re going to have to take care of every item that reaches 100% of the Page Speed Insights tool . You’re going to start with the top priority things.
Test your Mobile Site
Here the recommended time is 3sec or less.
Diagnose your website through this mobile site test to find out what corrections you need for your website
4. Here are some of the many ways to increase your page speed:
Enable Compression :
- Do not use gzip for image files. Then, compress them in a system like Photoshop where you can retain control of the image quality. See the “Optimize Images” below.
Minify CSS, Java Script, and HTML:
- By improving the code (including removing spaces, commas, and other unnecessary characters), you will significantly increase the speed of your website. Also remove code comments, formatting, and unused code.
Reduce redirects :
- Each time a page redirects to another page, the user must face additional time waiting for the HTTP request-response process to be completed.
- Browsers need to create a DOM tree by interpreting HTML before a website can be created. If your browser encounters a script during this process, it has to stop and execute it before it can continue.
Leverage Browser caching :
- Use a device like YSlow to see if you already have an expiry date set for your folder. And configure the “expires” header for how long you want the details to be cached.
- Then set your “expires” header for how long you want that information to be cached. In many cases, unless your site design changes frequently, a year is a reasonable time period. Google has more details about the use of caching here.
Improve Server response time :
- Your server response time is affected by the amount of traffic you receive, the resources that each page uses, the software that your server uses, and the hosting solution that you use.
- To boost the server response time, check for efficiency bottlenecks such as slow database requests, weak routing, or lack of adequate memory, and address them.The optimal server response time is under 200ms.
Use a Content Distribution Network :
- Content Distribution Networks (CDNs), also known as Content Distribution Networks, are server networks that are used to distribute content loads.
- Essentially, copies of your database are housed in several, geographically diverse data centers so that consumers have faster and more reliable access to your web.
Optimize Images :
- Make sure that your files are not bigger than they need to be, that they are in the proper file format (PNGs are generally better for images with less than 16 colors, whereas JPEGs are generally better for photos) and that they are compressed for the web.
- Using CSS sprites to build a template for graphics that you often use on your web, such as buttons and icons.
- CSS sprites merge the photos into one large image that loads all at once (which means fewer HTTP requests) and then shows only the bits that you want to view.
- It ensures that you save load time by not allowing users to wait for multiple images to display.