What exactly does this mean, and why should you care to bother with it?
Setting an expiry date or a maximum age in the HTTP headers for static resources (such as images) instructs your browser to load previously downloaded resources from your local disk rather than accessing and re-downloading the content that you already have over the network.
Thus, instead of waiting to download the images, your browser will display the images that you downloaded the last time you visited the site, thereby speeding up your load time!
So how do we do it? It’s easier than it sounds, I promise.
Simply access the root folder of your server, and save a copy of your
.htaccess
file to your desktop. This is your backup file in case something goes wrong. Then go back into your server, and open that same file for editing.
Paste in the following code, save the file, and call it a day!
# BEGIN Expire headers<ifModule mod_expires.c>ExpiresActive OnExpiresDefault “access plus 1 seconds”ExpiresByType image/x-icon “access plus 2592000 seconds”ExpiresByType image/jpeg “access plus 2592000 seconds”ExpiresByType image/png “access plus 2592000 seconds”ExpiresByType image/gif “access plus 2592000 seconds”ExpiresByType application/x-shockwave-flash “access plus 2592000 seconds”ExpiresByType text/css “access plus 604800 seconds”ExpiresByType text/javascript “access plus 216000 seconds”ExpiresByType application/javascript “access plus 216000 seconds”ExpiresByType application/x-javascript “access plus 216000 seconds”ExpiresByType text/html “access plus 600 seconds”ExpiresByType application/xhtml+xml “access plus 600 seconds”</ifModule># END Expire headers# BEGIN Cache-Control Headers<ifModule mod_headers.c><filesMatch “\.(ico|jpe?g|png|gif|swf)$”>Header set Cache-Control “max-age=2592000, public”</filesMatch><filesMatch “\.(css)$”>Header set Cache-Control “max-age=604800, public”</filesMatch><filesMatch “\.(js)$”>Header set Cache-Control “max-age=2592000, private”</filesMatch><filesMatch “\.(x?html?|php)$”>Header set Cache-Control “max-age=600, private, must-revalidate”</filesMatch></ifModule># END Cache-Control Headers# BEGIN Turn ETags Off<ifModule mod_headers.c>Header unset ETag</ifModule>FileETag None# END Turn ETags Off
If no other updates have previously been made to your .htaccess file, it should look like this upon completion…
# BEGIN Expire headers<ifModule mod_expires.c>ExpiresActive OnExpiresDefault “access plus 1 seconds”ExpiresByType image/x-icon “access plus 2592000 seconds”ExpiresByType image/jpeg “access plus 2592000 seconds”ExpiresByType image/png “access plus 2592000 seconds”ExpiresByType image/gif “access plus 2592000 seconds”ExpiresByType application/x-shockwave-flash “access plus 2592000 seconds”ExpiresByType text/css “access plus 604800 seconds”ExpiresByType text/javascript “access plus 216000 seconds”ExpiresByType application/javascript “access plus 216000 seconds”ExpiresByType application/x-javascript “access plus 216000 seconds”ExpiresByType text/html “access plus 600 seconds”ExpiresByType application/xhtml+xml “access plus 600 seconds”</ifModule># END Expire headers# BEGIN Cache-Control Headers<ifModule mod_headers.c><filesMatch “\.(ico|jpe?g|png|gif|swf)$”>Header set Cache-Control “max-age=2592000, public”</filesMatch><filesMatch “\.(css)$”>Header set Cache-Control “max-age=604800, public”</filesMatch><filesMatch “\.(js)$”>Header set Cache-Control “max-age=2592000, private”</filesMatch><filesMatch “\.(x?html?|php)$”>Header set Cache-Control “max-age=600, private, must-revalidate”</filesMatch></ifModule># END Cache-Control Headers# BEGIN Turn ETags Off<ifModule mod_headers.c>Header unset ETag</ifModule>FileETag None# END Turn ETags Off
# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ – [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>
# END WordPress
Your website will be running faster then ever, as well as have an improved score on Google PageSpeed Insights!
