Expires headers let the browser know whether to server a cached version of the p

age.
Reduce server load
Increase page load time
Cost benefit ratio: high value
Access needed
How does your site score on this recommendation?
Enter URL to Analyze...
Analyze
What are expires headers
Expires headers tell the browser whether they should request a specific file fro
m the server or whether they should grab it from the browser's cache.
The whole idea behind Expires Headers is not only to reduce the load of download
s from the server (constantly downloading the same file when it's unmodified is
wasting precious load time) but rather to reduce the number of HTTP requests for
the server.
When you visit a website your browser is responsible for communicating with the
webserver to download all the required files. It then compiles those files to di
splay the web page. As web pages become richer in graphics and content, more and
more files are being transferred between your machine and the web server.
In the past you would have an HTML file and maybe a few images to serve for your
website, however many modern websites might have 50+ files per page to transfer
. The files themselves can be a huge load increase by themselves but for each fi
le you must create a request and even if requests are fractions of a second, the
y can soon add up.
How does it work?
Expires Headers are rather simple in how they work. They tell the browser how lo
ng to store a file in the cache so subsequent page views and visits they don't h
ave to download the file again. You are right to assume Expires Headers don't im
prove page speed for a first time visit as this visitor would have to download a
ll the files for the first time. Using Expires Headers helps increase load times
for returning visitors.
You can set Expires headers on specific files or
browser comes to the website it can see when was
specific file types. If it was recently it will
you haven't visited the site in a while it will
m the web server.

even file types. Then when the

the last time it downloaded the
display them from the cache, if
download the newest version fro

The idea is to set late expiry times for items that don't change on your website
(logo, colours etc). Set short expiry times for things that change regularly.
Why is it important?
Adding Expires Headers is important to reduce HTTP requests which reduces the ti
me it take for the server to communicate with the browser. It also allows your u
sers to reuse the cache files that have been stored in the browser to reduce the
amount of files they need to download.
How to Add Expires Headers
First you need to decide on what files you update often and what file types don'

t get updated often. A common list of file types we see a lot are:
images: jpg, gif, png
favicon/ico
javascript
css
Now go through these file types and think how often you change each one. Commonl
y images typically are not changed too often (keep in mind we are talking about
existing images) favicon is almost never changed, javascript is occasionally cha
nged and CSS is change much more frequently.
We define our Expires Headers in the .htaccess file. This is a hidden file often
found in the root of your website (via FTP). It's always best practice before y
ou edit the htaccess file to back it up!
Now, open up your htaccess file and paste in the following:
<IfModule mod_expires.c>
# Enable expirations
ExpiresActive On
# Default directive
ExpiresDefault "access plus 1 month"
</IfModule>
First we enable expirations and then we set a default expiry date for files we d
on't specify. Now we want to add the lines to explain what expires when. Right a
bove the </IfModule> paste the following and change the dates to reflect the tim
es that best suit your website.
# My favicon
ExpiresByType
# Images
ExpiresByType
ExpiresByType
ExpiresByType
ExpiresByType
# CSS
ExpiresByType
# Javascript
ExpiresByType
Your complete

image/x-icon "access plus 1 year"

image/gif "access plus 1 month"
image/png "access plus 1 month"
image/jpg "access plus 1 month"
image/jpeg "access plus 1 month"
text/css "access plus 1 month"
application/javascript "access plus 1 year"
file should look like:

<IfModule mod_expires.c>
# Enable expirations
ExpiresActive On
# Default directive
ExpiresDefault "access plus 1 month"
# My favicon
ExpiresByType image/x-icon "access plus 1 year"
# Images
ExpiresByType image/gif "access plus 1 month"
ExpiresByType image/png "access plus 1 month"
ExpiresByType image/jpg "access plus 1 month"
ExpiresByType image/jpeg "access plus 1 month"
# CSS
ExpiresByType text/css "access plus 1 month"
# Javascript
ExpiresByType application/javascript "access plus 1 year"
</IfModule>