Page speed – time taken by the user’s browser to receive the information from your  server and load the requested page, is one of the most crucial ranking signals in the Google search results. Since fetching assets over the network takes time and resources, reducing the number of assets is a great way to lower load time.

Using the browser caching, you can reduce the number of files needed to download without actually reducing the number of images or scripts on a page.

SEO tips for your site’s caching?

When you visit any site, the browser stores the files and photos of that site to your computer and when you revisit the same site next time, it loads these files from the computer. This ability of browsers is called browser caching. This can eliminate the need to redownload those assets which can automatically reduce the time it takes to load that page. 

When a user request any page, the browser needs to a lot different things:

• Images
• CSS files
• Scripts
• Various other widgets and files

You will when you open the same page the second time it takes less time to load as browser caching loads the assets to the computer at first visit to the page. It’s just possible because of caching.

What is browser caching for SEO?

There are two ways to leverage browser caching to speed up your page’s load time:

1. Expires headers
2. Cache-control headers

Both these methods are enabled by adding code to your website’s .htaccess file. This file is very important for your site. Make sure you make changes to this file very carefully.

• Expires headers: To use expires headers add the following coding to your .htaccess file.

# # EXPIRES CACHING # #

<IfModule mod_expires.c>

ExpiresActive On

ExpiresByType image/jpg “access 1 year”

ExpiresByType image/jpeg “access 1 year”

ExpiresByType image/gif “access 1 year”

ExpiresByType image/png “access 1 year”

ExpiresByType text/css “access 1 month”

ExpiresByType text/HTML “access 1 month”

ExpiresByType application/pdf  “access 1 month”

ExpiresByType text/x-javascript “access 1 month”

ExpiresByType application/x-shockwave-flash “access 1 month”

ExpiresByType image/x-icon  “access 1 month”

ExpiresDefault  “access 1 month”

</IFMODULE>

# # EXPIRES CACHING # #

The line ExpiresActive On enables the expires modules. After that each line has “Access 1 year” or month that indicates that the browser should  keep a particular type of file in its cache. In the above code any file having extension jpg, jpeg, png or gif should be cached for 1 year. While pdfs, html,  and javascript should be cached for one month according to the above code. If you want  to change the time period for files to be cached you can change it easily by removing 1 year or 1 month to whatever time you want. 

• Cache-control headers: Expires method works with most servers but not with all servers. Moreover, it’s a lengthy process to add each and every file type that you want to cache. 

There is a simple and a bit advanced method of enabling caching called cache-control headers can save your time. To use cache- control you need to add the following code to your .htaccess file.

# 1 Month for most static assets

<filesMatch “.(css|jpg|jpeg|gif|js|ico)$”>

Header set cache-control “max-age= 2592000, public”

</filesMatch>

First line with # is just for your reference or a note for you. Your will i gone this but this is useful for others who are working on this site and will help you to understand the code when your optimization grows more complex. 

The next line <filesMatch “.(css|jpg|jpeg|gif|js|ico)$”> this means you will set a time period for these types of file assets. 

Header set cache-control “max-age= 2592000, public” this line means cache- control and actual time period is defined here. The max-age=2592000 means the browser should cache the given file assets for 1 month (2592000 seconds). The time in this method is also given in seconds. The public  value says that it’s public on your server. The last line </filesMatch> closes the block of code. 

SEO tips for your site’s caching?

You will notice that most of the files have a cache time for 1 year or 1 month. If you give close attention to it then you will find there are some things in your site that do not change very often. For instance your company logo, CSS and blog images. So it’s beneficial for you to set the time period for 1 years that will not change. 

What is URL fingerprinting for SEO?

Use unique names when you update the things in your website like logos and css files. For instance if your css file is named as home.css then give it a new name like home_1.css. When a browser sees a file that doesn’t match one it’s stored in its cache, it will download the new one. This method is known as “URL fingerprinting” and useful for files that will change from time to time.

What are Etags?

Another method to handle changing files is to use entity tags. ETags, as they’re known, are unique identifier tokens for assets on your website. When a browser loads a page, it looks at the tokens for the assets currently on the page and compares them to the ETags for the files stored locally.

It will then only download any assets that don’t match the ETags stored in the cache. There is no specific way to generate ETags. All that matters is that they change every time to load a new version of a file onto your site.