Things to check for in your htaccess file
Here is a list of things you should check before you go live
Everyone uses .htaccess files for different reasons, but over the years I have noted a few things that generally seem to sneak themselves in - so I decided to draw up a list of things you might want to consider before go live on a site that relate just to .htaccess files.
A good lot of these are covered by the HTML5 Boilerplate, so if you are looking for a quick win you could always download it.
The tl;dr version is this quick list:
- Redirect to www
- Comments
- Forcing latest version of IE
- Gzip compression
- Setting some expires headers
- Custom Error Pages
- Block access to certain file types
Redirect to www
A very common requirement for .htaccess is to redirect non-www traffic to the www. domain (or vice versa) .
This keeps traffic on your website consistent (which can be invaluable when trying to debug issues or gather statistics).
Here is the code you would need.
RewriteEngine On
RewriteBase /
RewriteCond %{HTTP_HOST} !^www\.
RewriteRule ^ http://www.%{HTTP_HOST}%{REQUEST_URI} [L,R=301]
Comments
This will sound like a weird one, but I know a lot of programmers who comment absolutely everything but will never comment .htaccess files.
A quick comment can outline what you are intending various lines to do, which will save you a lot of angst in the long run, especially if your htaccess file is doing something non-trivial or mission critical.
Comments are created by starting a line with the # character. The rest of the line will then be ignored.
Here is a sample of a comment.
#The following redirects traffic to https, do not delete it.
Forcing the latest version of IE
We can do this in a couple of ways, but this is a nice quick way to easily apply the fix for IE. As well as forcing the latest version of IE it will also use the ChromeFrame if it is available.
This doesn't need to be set for certain files, so we can exclude them.
<IfModule mod_headers.c> Header set X-UA-Compatible "IE=Edge,chrome=1" <FilesMatch "\.(js|css|gif|png|jpe?g|pdf|xml|oga|ogg|m4a|ogv|mp4|m4v|webm|svg|svgz|eot|ttf|otf|woff|ico|webp|appcache|manifest|htc|crx|oex|xpi|safariextz|vcf)$" > Header unset X-UA-Compatible </FilesMatch> </IfModule>
Gzip Compression
If possible we should try and compress anything coming from the webserver, it will help to make your website feel more snappy and save you some bandwidth.
<IfModule mod_deflate.c>
<IfModule mod_setenvif.c>
<IfModule mod_headers.c>
SetEnvIfNoCase ^(Accept-EncodXng|X-cept-Encoding|X{15}|~{15}|-{15})$ ^((gzip|deflate)\s*,?\s*)+|[X~-]{4,13}$ HAVE_Accept-Encoding
RequestHeader append Accept-Encoding "gzip,deflate" env=HAVE_Accept-Encoding
</IfModule>
</IfModule>
<IfModule filter_module> FilterDeclare COMPRESS FilterProvider COMPRESS DEFLATE resp=Content-Type $text/html FilterProvider COMPRESS DEFLATE resp=Content-Type $text/css FilterProvider COMPRESS DEFLATE resp=Content-Type $text/plain FilterProvider COMPRESS DEFLATE resp=Content-Type $text/xml FilterProvider COMPRESS DEFLATE resp=Content-Type $text/x-component FilterProvider COMPRESS DEFLATE resp=Content-Type $application/javascript FilterProvider COMPRESS DEFLATE resp=Content-Type $application/json FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/xhtml+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/rss+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/atom+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $application/vnd.ms-fontobject FilterProvider COMPRESS DEFLATE resp=Content-Type $image/svg+xml FilterProvider COMPRESS DEFLATE resp=Content-Type $image/x-icon FilterProvider COMPRESS DEFLATE resp=Content-Type $application/x-font-ttf FilterProvider COMPRESS DEFLATE resp=Content-Type $font/opentype FilterChain COMPRESS FilterProtocol COMPRESS DEFLATE change=yes;byteranges=no </IfModule> <IfModule !mod_filter.c> AddOutputFilterByType DEFLATE text/html text/plain text/css application/json AddOutputFilterByType DEFLATE application/javascript AddOutputFilterByType DEFLATE text/xml application/xml text/x-component AddOutputFilterByType DEFLATE application/xhtml+xml application/rss+xml application/atom+xml AddOutputFilterByType DEFLATE image/x-icon image/svg+xml application/vnd.ms-fontobject application/x-font-ttf font/opentype </IfModule> </IfModule>
Setting some expires headers
There are a lot of files that should be cached at the earliest possible time by the browser to save them having to be downloaded several times.
The code to do this looks pretty verbose but covers most angles.
<IfModule mod_expires.c> ExpiresActive on ExpiresDefault "access plus 1 month" ExpiresByType text/cache-manifest "access plus 0 seconds" ExpiresByType text/html "access plus 0 seconds" ExpiresByType text/xml "access plus 0 seconds" ExpiresByType application/xml "access plus 0 seconds" ExpiresByType application/json "access plus 0 seconds" ExpiresByType application/rss+xml "access plus 1 hour" ExpiresByType application/atom+xml "access plus 1 hour" ExpiresByType image/x-icon "access plus 1 week" 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" ExpiresByType video/ogg "access plus 1 month" ExpiresByType audio/ogg "access plus 1 month" ExpiresByType video/mp4 "access plus 1 month" ExpiresByType video/webm "access plus 1 month" ExpiresByType text/x-component "access plus 1 month" ExpiresByType application/x-font-ttf "access plus 1 month" ExpiresByType font/opentype "access plus 1 month" ExpiresByType application/x-font-woff "access plus 1 month" ExpiresByType image/svg+xml "access plus 1 month" ExpiresByType application/vnd.ms-fontobject "access plus 1 month" ExpiresByType text/css "access plus 1 week" ExpiresByType application/javascript "access plus 1 week" </IfModule>
Custom Error Pages
Custom Error Pages are an excellent way to customise your site, for example if your site returns a 404 error instead of showing the default page sent from Apache.
This is a pretty small bit of code.
ErrorDocument 404 /404.html
All this means is for the Error Document called 404, send the user to the page 404.html
Block access to certain file types
Oftentimes various text editors and programs will leave files that just end up getting uploaded with the other files when you update your website - best practice would be to not put these files on your web server but sometimes this cannot be avoided, and regardless of why they are there you should do something to tidy them up.
The following code blocks access to various files.
<FilesMatch "(\.(bak|config|sql|fla|psd|ini|log|sh|inc|swp|dist)|~)$"> Order allow,deny Deny from all Satisfy All </FilesMatch>
Conclusion
There are plenty of other things .htaccess files can do, but these are the things I personally use most often, I hope you find them as useful as I have.