Vicky's Blog

google page speed tips

Google has indicated site speed (and as a result, page speed) is one of the signals used by its algorithm to rank pages. In other words, your web site's page loading speed can affect your SEO ranking.

Google’s reason for prioritizing site speed as a ranking factor is simple: Faster pages create a significantly better experience for users.

You've no doubt experienced this yourself. How long do you stay on a web site when the pages are slow to load? Web pages with longer load times tend to have higher bounce rates and a lower "average time on page". Longer load times have also been shown to negatively affect conversions.

Some very nice features for desktop viewing are really cumbersome or slow-loading on mobile devices.  So, Google provides a way to test your web pages for both types of devices, called PageSpeed Insights.  We don't build separate pages for each, but use responsive design to create one web site with a goal to provide a great user experience regardless of the device it is viewed on.

To achieve this, we include these steps - they are not only good design standards, but also support faster page speed:

Optimize Images

Larger file sizes create slower page loads. So, we size and optimize all images for the space allocated to them. Typically, these images are then small enough to also allow for fast mobile page speeds. In some cases, we create smaller images just for the mobile view of pages.

Optimize Web Pages

We consider replacing complex features (that typically provide a great visual and user experience) with simpler substitutions on mobile pages to reduce mobile page load times. In making these decisions, we consider the desired user experience on mobile devices.

Host Files Locally

Local files load faster. Avoid files hosted externally, such as on sites like Flickr, unless you have a very good reason for this (and sometimes you will). If a client wants to introduce an externally-hosted file that has a slow page load, we consider an image or button on the web page (which loads very fast) that links to this external page, with text to encourage the user to select it.

Avoid Slow-Loading Features

Plugins, add-ons, widgets, forms - added software that adds some nice feature - can also add complexity and increase page load times. Consider each one and remove (or replace) them if slow or unneccessary. To help you decide, stay focused on the goals of your web site and evaluate each add-on component with those goals in mind.

More Technical Steps

OK, this next section is admittedly technical. I want to share more details about how I've improved the speed score for web site pages. I spent hours reviewing recommendations and experimenting on the last couple of sites I designed, and hope this blog post will save others time in achieving similar goals.

With Google's PageSpeed Insights, you can identify ways to make your site faster and more mobile-friendly. Another very useful tool is GMetrix.

After installing and redesigning this web site, but before optimizing it for speed, I tested it via Google's PageSpeed Insights Tool.  The results were not good for page speed - 43/100 for mobile devices and 53/100 for desktop. This was a standard Joomla! CMS installation before optimization for speed issues.

rfweb pageinsights mobile before optimization

I made adjustments in the Joomla Administrator, at the server level and edited the .htaccess files. On Joomla! 2.5 sites, you also need to edit robots.txt.  

A disclaimer: I am not very knowledgeable about server administration and I may use the wrong technical terms below (for example, I'm not sure if you actually "enable" the mod_deflate module, or if there is a better term for this).  

For server issues, I depend and trust 100% my server administrators at Tranquil Hosting.  I contacted them with my questions and, in their quick and knowledgeable manner, they answered my questions and implemented their recommendations on my Managed Virtual Server (MVS).

"Technical" Steps to Improve Page Speed

  • I enabled the "Gzip Page Compression" setting in the Joomla's Global Configuration. I had learned earlier this year that just turning the gzip feature on does not insure gzip compression.  Tranquil Hosting enabled the mod_deflate module in my Apache MVS, as this was necessary for gzip to work. You can test your web page's gzip compression here: https://varvy.com/tools/gzip/
  • Also in Joomla's Global Configuration, I set the system cache to "ON - conservative caching".
    Caching can cause unexpected problems.  For example, I had to set the breadcrumbs module to "Caching = No Caching" in the Advanced Settings for this module to consistently display correctly.
  • We globally disabled ETag headers at the server level.  If you can't do this, add this to your .htaccess file:

    ## DISABLE ETAG or Disable ETags Globally at Server##
    Header unset ETag
    FileETag None
    ## DISABLE ETAG ##

  • I took advantage of mod_expires by setting longer expiration dates for web files.  This can reduce the server response time as it won't serve a new file if the browser has a cached copy of the file within the expiration times.  This is done via the .htaccess file.  I use Akeeba's Admin Tools Professional, and it makes this quite easy.  I found this code after researching recommendations found on the Joomla Forum and other sites. Here is what I added:

    ## EXPIRES CACHING ##
    <IfModule mod_expires.c>
    ExpiresActive On
    ExpiresDefault A2592000
    ExpiresByType image/x-icon A2592000
    ExpiresByType image/gif A2592000
    ExpiresByType image/png A2592000
    ExpiresByType image/jpg A2592000
    ExpiresByType image/jpeg A2592000
    ExpiresByType text/html A2592000
    ExpiresByType application/pdf A2592000
    ExpiresByType text/x-javascript A2592000
    ExpiresByType application/x-shockwave-flash A2592000
    ExpiresByType text/html A2592000
    ExpiresByType text/css A2592000
    ExpiresByType image/x-icon A2592000
    ExpiresDefault "access 1 month"
    </IfModule>
    ## EXPIRES CACHING ##

  • I optimized the very few images that that PageSpeed Insights suggested could be more compressed.
  • Finally, I installed the free version of JCH Optimize, and set the automatic settings to "Average".  I plan to explore the additional features offered in the professional version soon.

Then is was time to test the site again via Google's PageSpeed Insights.  

Drum Roll, Please ....

Wow, I saw a great improvement in the page speed scores!  For mobile, the score improved from 43 to 69.  For desktop, the score improved from 53 to 87. 

But I'm a Gal Who Strives for 100%

So, is 69/100 and 87/100 "OK" for page speed?  To answer this, you have to look at the details of the results.  The analysis was basically the same for both mobile and desktop, so I'm showing the mobile results here:

rfweb pageinsights mobile after optimizing page speed

 

I was able to improve all the measures except the three listed next. You need to look at the "How to Fix" details of each section in your results to find out more details.

Above the Fold Content

Honestly, I haven't done anything about this ... yet.  My commercial template company sets it up this way, and they do have their reasons for this. Given that my web pages load very fast in testing, I am not pursuing a solution for this yet.

Reduce Server Response Time

I wish I had noted the server response time before taking the optimization steps I outline above.  A page load in 0.4 seconds on a mobile device is, in reality, quite good.  

Leverage Browser Caching

As you can see, the only file identified here is the javascript file from googleanalytics.com.  I can't affect browser cacheing on outside sites, so there is nothing I can do.  Does anyone else see the irony of Google not passing one of its page speed metrics? 

What this does tell me is the the EXPIRES caching I set in .htaccess is working. Yay!!

Some extensions also serve files remotely (I've seen this with some facebook modules), and you can't affect files not on your server.  If this becomes a bigger issue, I could contact the developer for action.

Going Forward from Here ...

You can also analyze your web page for mobile-friendly here: https://www.google.com/webmasters/tools/mobile-friendly

mobile friendly results

After the steps outlined above, RFWebDesign.com is "mobile friendly".  

But Wait, There's More!

Page speed is only one of MANY factors that affect SEO.  You can learn about our SEO practices here. Also, you want your web site to be attractive, with relevant content and a clear message.  

If you are our client, know that we are taking steps to stay informed on SEO issues.

If you found this page while looking for answers, I sure hope this information is helpful to you!