32

In PageSpeed Insights I keep seeing the message to leverage browser caching of a particular iconset/font I'm using: iconFont.woff (2 days)

I've set my .htaccess as so:

## EXPIRES CACHING ##
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType font/ttf "access 1 week"
ExpiresByType font/woff "access 1 week"
ExpiresByType image/jpg "access 1 month"
ExpiresByType image/jpeg "access 1 month"
ExpiresByType image/gif "access 1 month"
ExpiresByType image/png "access 1 month"
ExpiresByType text/css "access 1 week"
ExpiresByType application/pdf "access 1 month"
ExpiresByType application/javascript "access 1 month" 
ExpiresByType application/x-shockwave-flash "access 1 month"
ExpiresByType image/x-icon "access 1 year"
ExpiresDefault "access 2 days"
</IfModule>
## EXPIRES CACHING ##

Despite this I'm still getting the same message in PageSpeed Insights. How do I cache this properly?

Amy Barrett
  • 564
  • 3
  • 14
  • 27
Mikedefieslife
  • 421
  • 1
  • 6
  • 14
  • 1
    Maybe font/woff is not working, try this: http://stackoverflow.com/questions/3594823/mime-type-for-woff-fonts?rq=1 – Sohail xIN3N Nov 24 '14 at 07:56

2 Answers2

90

This is doing the job for me, as Google page speed is no longer asking to fix it. The AddType is essential.

# Fonts
# Add correct content-type for fonts
AddType application/vnd.ms-fontobject .eot 
AddType application/x-font-ttf .ttf
AddType application/x-font-opentype .otf
AddType application/x-font-woff .woff
AddType image/svg+xml .svg

# Compress compressible fonts
# only uncomment if you dont have compression turned on already. Otherwise it will cause all other filestypes not to get compressed
# AddOutputFilterByType DEFLATE application/x-font-ttf application/x-font-opentype image/svg+xml

ExpiresActive on

# Add a far future Expires header for fonts
ExpiresByType application/vnd.ms-fontobject "access plus 1 year"
ExpiresByType application/x-font-ttf "access plus 1 year"
ExpiresByType application/x-font-opentype "access plus 1 year"
ExpiresByType application/x-font-woff "access plus 1 year"
ExpiresByType application/font-woff2  "access plus 1 month"
ExpiresByType image/svg+xml "access plus 1 year"
Jack
  • 3,632
  • 7
  • 45
  • 67
Erik van Berkum
  • 1,026
  • 9
  • 8
  • Hello I tried adding this in .htaccess but when i load the site after adding this site was showing "500" internal server error". – Nilesh Kumar Mar 30 '17 at 11:38
  • 1
    @NileshKumar Add above ExpiresActive on and after the last line, it will fix your error – John M. Sep 14 '17 at 12:54
  • Should you also have `AddOutputFilterByType DEFLATE application/x-font-woff` and `AddOutputFilterByType DEFLATE application/vnd.ms-fontobject` or so those formats not offer compression? – Laurence Lord Aug 18 '18 at 11:05
  • 8
    what about for .woff2 files? – kjones Feb 05 '19 at 03:58
5

With the help of Seb's IT blog this worked for me:

<IfModule mod_expires.c>
  # Activate mod
  ExpiresActive on

  # Declare fonts content-type
  AddType application/x-font-woff2 .woff2

  # Set cache duration
  ExpiresByType application/x-font-woff2  "access plus 1 month"

  # Append "public" to header "Cache-Control"
  <IfModule mod_headers.c>
    Header append Cache-Control "public"
  </IfModule>
</IfModule>
Fsamapoor
  • 71
  • 3
  • 8