A website or a blog, usually are designed using images which looks creative but increases page load time. Sometimes it gets annoying for daily visitors and it leaves a bad impression for the website. With the advancements in technology and WWW, now web browsers have image cache feature, which has resolved many problems for websites like page load problem for photo blogs.
The analogy behind browser cache states that when a page is loaded, all the images are saved in a cache pool of browser itself. And when a visitor visits the site again, finds no delay while opening a page, as the images are pulled locally from the browser. Hence, enabling image cache for a website, decrease page load time. In the this article, you will learn how to enable image cache for website using htaccess method.
How htaccess file improve website performance?
Improve performance by enabling Image Cache
htaccess is a file to add security attributes to root directory or to any other specified directory. Every browser reads .htaccess file, and further reads header information of the website. On the complementary, browser check for attributes whether to save image in cache pool or any media which also specify the expiration time and a cookies are created accordingly. For instance, if cookies are created for an image which specify it to expire in 2 weeks, and after two weeks, browser will clear image from the cache pool, and browser will have to reload image again. Hence, this states image caching also save website bandwidth.
How to enable image cache ?
Below is the tutorial, to enable image cache for wordpress blog or website.
Make sure before modifying file for any changes, I recommend you to backup all the website data.
- Using any ftp client, login to the website directory, you will find .htaccess file located in the root of your directory.
- Open the .htaccess file using text editor. In case there is no htaccess file, create a new text file and save is as “.htaccess” (Make sure you don’t miss the “. (DOT) access”).
- Further add the below code snippet in the text file.
Code:
# Image and Flash content Caching for One Month <FilesMatch ".(flv|gif|jpg|jpeg|png|ico|swf)$"> Header set Cache-Control "max-age=2592000" </FilesMatch>
Be very precise with the code you copy and paste in the file, else your website may not be accessible.
- After pasting the code in htaccess file, review it and save it. Once done, it will turn on the image caching for one month, as the ‘max-age’ parameter value equals 2592000 seconds. If you want that image caching never expires, edit “max-age=29030400”, as 29030400 seconds = 1 year.
As we come to the end of this simple, yet beneficial tutorial to improve website using htaccess method . Do let us know what methods did you apply to improve website performance ?
If you have any queries or any further assistance is required, you can post comment below, as your feedback.
Hi,
Thanks for your help, but i have used this line, which you have written on above side into the .htaccess file, but i can not see any improvement on page load, can you please help me for the same.
If images are troubling page load time, then you can try these two options below:
Check Google Page score to dig deep into the website. [Tip]
Great tips… but the question is: why doesn’t webflow automatically optimize images? Duda is an example of a platform that has this feature. I encourage webflow to integrate this. It is a real time-saver.