Web-en

Fix Google PageSpeed Insights issues and get green

Googleicon PageSpeed Insights [1] is a great tool to see how your website perform. In case you got a poor score, here is a series of articles with easy to implement solutions to solve most of the issues.

This allowed me to go green on the Googleicon PageSpeed Insights [1], going up from a score of 17 on mobile (Fig 1) to 89 (Fig 14), and up from 35 (Fig 3) to 89 on desktop (Fig 16).

Google Page Speed - Score before image optimization of 17 on mobile
Fig 1 : Google Page Speed – Score before image optimization of 17 on mobile
Google Page Speed - Score before image optimization of 35 on desktop
Fig 3 : Google Page Speed – Score before image optimization of 35 on desktop
Google Page Speed - Score after activating gzip compression of 89 on mobile
Fig 14 : Google Page Speed – Score after activating gzip compression of 89 on mobile
Google Page Speed - Score after activating gzip compression of 89 on desktop
Fig 16 : Google Page Speed – Score after activating gzip compression of 89 on desktop

Optimize images

This allowed me to pass the Google PageSpeed [1] test Optimize images [2] on a website, going up from a score of 17 on mobile (Fig 1) to 51 (Fig 2), and up from 35 (Fig 3) to 59 on desktop (Fig 4).

Eliminate render-blocking JavaScript and CSS in above-the-fold content

Google Page Speed - Score after image optimization of 51 on mobile
Fig 2 : Google Page Speed – Score after image optimization of 51 on mobile
Google Page Speed - Score after image optimization of 59 on desktop
Fig 4 : Google Page Speed – Score after image optimization of 59 on desktop

This allowed me to pass the Googleicon PageSpeed [1] test Eliminate render-blocking JavaScript and CSS in above-the-fold content (along with Leverage browser caching [6]) on a website, going up from a score of 51 on mobile (Fig 5) to 72 (Fig 6), and up from 59 (Fig 7) to 79 on desktop (Fig 8).

Leverage browser caching

Google Page Speed - Score before eliminating render-blocking JS and CSS in above-the-fold content of 51 on mobile
Fig 5 : Google Page Speed – Score before eliminating render-blocking JS and CSS in above-the-fold content of 51 on mobile
Google Page Speed - Score after eliminating render-blocking JS and CSS in above-the-fold content of 72 on mobile
Fig 6 : Google Page Speed – Score after eliminating render-blocking JS and CSS in above-the-fold content of 72 on mobile
Google Page Speed - Score before eliminating render-blocking JS and CSS in above-the-fold content of 59 on desktop
Fig 7 : Google Page Speed – Score before eliminating render-blocking JS and CSS in above-the-fold content of 59 on desktop
Google Page Speed - Score after eliminating render-blocking JS and CSS in above-the-fold content of 79 on desktop
Fig 8 : Google Page Speed – Score after eliminating render-blocking JS and CSS in above-the-fold content of 79 on desktop

This allowed me to pass the Googleicon PageSpeed [1] test Leverage browser caching [5] (along with Eliminate render-blocking JavaScript and CSS in above-the-fold content [4]) on a website, going up from a score of 51 on mobile (Fig 9) to 72 (Fig 10), and up from 59 (Fig 11) to 79 on desktop (Fig 12).

Enable compression

Google Page Speed - Score before leveraging browser caching of 51 on mobile
Fig 9 : Google Page Speed – Score before leveraging browser caching of 51 on mobile
Google Page Speed - Score after leveraging browser caching of 72 on mobile
Fig 10 : Google Page Speed – Score after leveraging browser caching of 72 on mobile
Google Page Speed - Score before leveraging browser caching of 59 on desktop
Fig 11 : Google Page Speed – Score before leveraging browser caching of 59 on desktop
Google Page Speed - Score after leveraging browser caching of 79 on desktop
Fig 12 : Google Page Speed – Score after leveraging browser caching of 79 on desktop

This allowed me to pass the Googleicon PageSpeed [1] test Leverage browser caching [7] on a website, going up from a score of 72 on mobile (Fig 13) to 89 (Fig 14), and up from 79 (Fig 15) to 89 on desktop (Fig 16).

Google Page Speed - Score before activating gzip compression of 72 on mobile
Fig 13 : Google Page Speed – Score before activating gzip compression of 72 on mobile
Google Page Speed - Score before activating gzip compression of 79 on desktop
Fig 15 : Google Page Speed – Score before activating gzip compression of 79 on desktop

Links and credits

  • [1] – PageSpeed Insights – developers.google.com
  • [2] – Optimize Images PageSpeed Insights Google Developers – developers.google.com
  • [3] – Mass process and update a batch of images using GIMP – www.ybierling.com
  • [4] – Fix Google PageSpeed Eliminate render-blocking JavaScript and CSS in above-the-fold content – Yoann Bierling, International SAP/Web Consultant – www.ybierling.com
  • [5] – Leverage Browser Caching PageSpeed Insights Google Developers – developers.google.com
  • [6] – Fix Google PageSpeed leverage browser caching in htaccess – www.ybierling.com
  • [7] – Optimizing encoding and transfer size of text-based assets — Web Fundamentals – developers.google.com
  • [8] – Fix Google PageSpeed enable compression in PHP and htaccess – www.ybierling.com

Images