The less time it takes for your website to load a page, the better. Page speed is not only a ranking factor, it is also crucial for a positive user experience and for your conversion rate.
Having a fast website is therefore all the more important. Browser caching is one way to turbocharge your loading speeds. In this article, we explain all about browser caching.
Caching involves storing data in a small cache. This means that the data in the cache no longer has to be reloaded when needed for various applications - whether on the desktop, a smartphone, or tablet. The cache can therefore increase the loading speed of computer programs as well as websites.
Caching can be carried out for websites both on the server and in the browser. When the server creates a cache, this cache is also stored on the server, meaning that the files do not have to be reloaded every time a browser makes a server request. The number of requests to databases can therefore be reduced, and at the same time, you reduce the amount of data volume and resources.
Once the server cache is created, the previously stored content is available to all users accessing your site. However, if you change content or files on your website, you will also need to refresh the server cache. Server-side caching can consist of entire HTML pages.
In the cache, web browsers can store forms, layouts, or videos as well as cookies or files such as login names. Browser caching is particularly useful when you have visitors returning or visiting lots of URLs on your site. The static elements are then available in the browser and do not have to be reloaded each time. This protects your server and increases the speed of your website at the same time.
One drawback of browser caching: if a user deletes their browser cache, the data stored is gone. This data must be downloaded again the next time the user visits your website.
Browser caching can be enabled with many CMS using a plugin of the .htaccess file.
Browser caching can be activated via plugins or extensions for many CMS solutions. Possible plug-ins for browser caching with WorldPress include:
If you want to enable browser caching from your Apache web server's .htaccess file, there are two modules that you need to activate. The corresponding commands are stored in the .htaccess file, which is retrieved from your server every time you access the page.
Usually mod_headers are already activated on most managed web servers. If not, the module must first be activated by the server administrator. The command for that is:
After that, the types of files to be stored in the browser cache are specified. The information is either included in an existing.htaccess file or saved in a new file.
Header set Cache-Control "max-age=604800, public"
The browser now receives instructions to save the file types in parentheses for a certain period of time (max-age). In this example, that is 2,592,000 seconds, or 30 days.
You can also specify different cache run-times for each file type. In this case, add another line with <FilesMatch…> </FilesMatch> and enter the desired file type and time of expiration.
Header set Cache-Control „max-age=604800, public“
Header set Cache-Control „max-age=2592000, public“
Usually, this module is already enabled on your server. If not, it can be activated with this command:
## Cache Expiration ##
ExpiresByType image/jpg „access plus 1 year“
ExpiresByType image/jpeg „access plus 1 year“
ExpiresByType image/gif „access plus 1 year“
ExpiresByType image/png „access plus 1 year“
ExpiresByType text/css „access plus 1 month“
ExpiresByType text/html „access plus 1 month“
ExpiresByType application/pdf „access plus 1 month“
ExpiresByType application/x-shockwave-flash „access plus 1 month“
ExpiresByType image/x-icon „access plus 1 year“
ExpiresDefault „access plus 1 month“
## Cache Expiration
The "IF command" first ensures that the files expire once the expires module is activated. The message "access plus ..." indicates the expiration time of the corresponding file type. It can be individually customized.
Browser caching can be used for different types of files. The following file types can be cached:
With the single page analysis from Ryte, you can check if browser caching is enabled on your website. You can carry out a single page analysis in Website Success - enter a URL from your website in the search bar and click on "Single Page Analysis". If browser caching is not enabled, you will receive a warning message.
Whether or not your website's browser caching is enabled can also be determined by using Google's PageSpeed Insights. With this tool, you can test the loading speed of your websites. The tool will then provide you with tips for optimization, including tips about using browser caching.
Figure 1: Control browser caching with Google PageSpeed Insights.
Browser caching is a practical method with which you can significantly improve the performance of your website. If your website has many visitors, browser caching can reduce the workload for your server, as frequently used files are loaded into the cache of the user’s browser.
Browser caching is suitable for websites of any size and can be implemented with relatively little effort. There’s no excuse for being lazy when it comes to optimizing with browser caching!
Monitor, analyze and optimize your website with Ryte FREE
Published on 08/08/2018 by Philipp Roos.
Philipp is an extended member of the Ryte family and supports Ryte with the latest SEO know-how and digital marketing news.Become a guest author »
Get more traffic and customers by optimizing your website, content and search performance. What are you waiting for?Register for free