How To Improve Grade Of Browser Caching Of Static Content/Assets For Website On An Apache Server

The following instructions are applicable if your website is on a server using an Apache web server software, but the the concept applies to all web servers.  Most of the time it is an Apache.  Your hosting company would tell you, or you would see it listed on your hosting control panel.  The hosting company of $1 Website Hosting (known by several brand names) provides Apache 2.2.26 and higher web servers, at the time of this article writing, and thus my focus on the commands for it.

This article assumes you know of and are using a Web Page Test site, or a Website Performance checking site, or a Speed Testing site, or a Load Testing site or software that checks if a site is slow or fast to help you figure out what needs to be improved.   Typically done to check on the performance of a website and improve the websites performance.

This article will step you through on How To Change Cache Static Content Grade from F to A. 

Same as improving Browser Caching Of Static Content/Assets.

Also same as improving the Leverage Browser Caching results.

IMPORTANT INITIAL COMMENT

First I want to point out something important that most do not seem to realize.  People commonly assume that a Grade of A or a rating of 100% is better than a lower grade of F, D, C, B or a something lower than 100%.  This is not correct.  An F rating can be just as good as an A rating!  The testing sites and softwares are setup to grade according to the time period the static content of a website is set to expire.  It is common for the results to show an A grade for cache expiration periods of 7 days or more, and for smaller periods the grade drops to B, C, D and F respectively for shorter periods.  If you are busy making changes, and constantly, to your website, you may want your site to indicate to browsers to only cache (temporary store) 5 minutes.  Because you are regularly updating the page(s), and you want the visitors to get the updated content and not be displayed old content from the browser's cache.  The lower expiration period of 5 minutes or even several hours would cause a grade of F or a low number rating to show for the measurement of your website during a performance test of your site.  As you can see, this is fine, since that is what you would want.  If you have completed your site design and do not expect changes for a long time or for a time period outside of a week, then it is perfectly fine to have the Browser Caching indicated as 7 or more days.  Indicating a cache period of 7 days or longer would cause a Grade of A or 100 to be displayed for the measurement of your site after the performance testing is done.

Steps For How To Change Grade or Rating for Browser Caching Of Static Content/Assets.

1. Make use of a file management tool or software.  Such as the hosting control panel (cpanel) File Manager tool provided by Web Hosting With $1 (WHW1.com) or a FTP software (List of FTP softwares and tutorials here).  Modern versions of Internet browsers, like Firefox and Internet Explorer (IE), can also access your files as an FTP connect when used with your FTP login information. 
   
   
2. Locate and edit the .htaccess file in the root folder (directory) of your hosting.  The root location (just /) is typically located above your website's content folder, which is commonly /public_html or /www.   In other words, you want the /.htaccess and not just the /public_html/.htaccess (or /www/.htaccess), since you want a broader impact.  Note that the following changes implemented in the .htaccess file of either folders of /public_html or /www or other folder locations will still work, but the effect gets limited to only what is within that .htaccess folder (directory) and sub-folders.
   
   
   
   
3. In the .htaccess file, at top or at bottom, add the following commands, assuming that no portion of it already exists.
   
   # Info provided by Tech Notes (TechNotes.whw1.com).  START.
<ifModule mod_expires.c>
ExpiresActive On
# Default Expiration set to 1 week
ExpiresDefault A604800

# These Expire after 1 month
ExpiresByType image/gif A2592000
ExpiresByType image/png A2592000
ExpiresByType image/jpg A2592000
ExpiresByType image/x-icon A2592000
ExpiresByType application/pdf A2592000
ExpiresByType application/x-javascript A2592000
ExpiresByType text/plain A2592000

# These Expire after 1 week
ExpiresByType text/css A604800

</ifModule>
# Info provided by Tech Notes (TechNotes.whw1.com).  END.


4. Redo the Performance Test or Speed Test, and you should see green grade of A or 100%, or high good rating for the "Cache Static Content" or the "Leverage Browser Caching" or other similar titles. . :)

Done.

Feel Free To Leave A Good Comment. :)

Look around, and you may find other useful articles.  Add this site to your Bookmarks/Favorites for easy return for new articles.  Consider submitting technical articles for publication, including your embedded links.