15+ Tips & Resources for Learning and using .htaccess – An Intro for Web Designers







Among all other elements of web design and coding, htaccess can be one of the most threatening. This is so because of the fact that .htaccess is an incredibly powerful tool and one that has the potential to completely break your site if you’re not careful.

Here are some basic htaccess techniques and tips to get you started. They’re not nearly as frightening as many people expect, and if you study the code for a few minutes, I am sure that you’ll quickly grasp exactly how it works.

Also, check the end of this post for some great resources on .htaccess. This post should be helpful for beginners, Designers, and even Developers of all experience levels!

Note: Please check with your web hosting provider if you have issues with your .htaccess file, because different hosts handle certain things differently, and some won’t allow certain techniques to be used for whatever reason.

QUICK TIP – If you have never used an .htaccess file before, and you are using Dreamweaver, you may have to add the .htaccess extention to the ‘file types’ in Dreamweavers Preferences, that way you can open the file and view it in Dreamweaver, It should look just like a plain text file. Also, .htaccess files typically are not very long, only several lines of code, Hopefully the resources at the bottom will help you if you get stuck and don’t know what to do :).

1. Creation of a custom error page:

htaccess on a Linux Apache server makes it easy to create your own custom error pages. Just create your custom error page files and then add following code to your .htaccess file:

ErrorDocument 401 /401.php

ErrorDocument 403 /403.php

ErrorDocument 404 /404.php

ErrorDocument 500 /500.php

ErrorDocument 401 /401.php

ErrorDocument 403 /403.php

ErrorDocument 404 /404.php

ErrorDocument 500 /500.php

(Obviously you should replace with your own file path and name.)

2. Prevention of directory browsing:

If you don’t include an index file in a directory, visitors can browse the directory itself. But preventing that is as easy as adding a single line to your .htaccess file:

Options All -Indexes

3. Setting the default page of each directory:

If you don’t want to use an index page in each directory, you can set the default page visited when someone reaches that directory by adding this:

DirectoryIndex news.html

DirectoryIndex news.html

(You will have to replace the “news.html” bit with whatever you want to use as the default.)

4. Setting up a 301 redirect:

If you move around the structure of your site and need to redirect some old URLs to their new locations, the following bit of code will do so for you:

Redirect 301 /original/filename.html http://domain.com/updated/filename.html

5. Compressing file output with GZIP:

You can add the following code to your htaccess file to compress all of your JavaScript, CSS and HTML files using GZIP.

<IfModule mod_gzip.c>

mod_gzip_on         Yes
mod_gzip_dechunk    Yes
mod_gzip_item_include file      \.(html?|txt|css|js|php|pl)$
mod_gzip_item_include handler   ^cgi-script$
mod_gzip_item_include mime      ^text\.*
mod_gzip_item_include mime      ^application/x-javascript.*
mod_gzip_item_exclude mime      ^image\.*
mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*

</IfModule>

<IfModule mod_gzip.c>

mod_gzip_on   Yes

mod_gzip_dechunk Yes

mod_gzip_item_include file   \.(html?|txt|css|js|php|pl)$

mod_gzip_item_include handler  ^cgi-script$

mod_gzip_item_include mime  ^text\.*

mod_gzip_item_include mime  ^application/x-javascript.*

mod_gzip_item_exclude mime  ^image\.*

mod_gzip_item_exclude rspheader ^Content-Encoding:.*gzip.*

</IfModule>

6. Redirecting to a secure https connection:

If you want to redirect your entire site to a secure https connection, use the following code.

RewriteEngine On

RewriteCond %{HTTPS} !on

RewriteRule (.*) https://%{HTTP_HOST}%{REQUEST_URI}

7. Blocking script execution:

You can stop scripts in certain languages from running with this code:

Options -ExecCGI

AddHandler cgi-script .pl .py .php .jsp. htm .shtml .sh .asp .cgi

(Options -ExecCGI

AddHandler cgi-script .pl .py .php .jsp. htm .shtml .sh .asp .cgi

Just replace the types of scripts you want to block).

8. Forcing a file to download with a “Save As” prompt:

If you want to force users to download a file instead of opening it in their browser, use this code:

AddType application/octet-stream .doc .mov .avi .pdf .xls .mp4

9. Restricting file upload limits for PHP:

You can restrict the maximum file size for uploading in PHP, as well as the maximum execution time by,

php_value upload_max_filesize 10M       /Max file size for uploading

php_value post_max_size 10M             /Max size for post data

php_value max_execution_time 200        /Max time in sec for running before termination

php_value max_input_time 200            /Max amount of time in sec for parsing input

php_value upload_max_filesize 10M

php_value post_max_size 10M

php_value max_execution_time 200

php_value max_input_time 200

10. Enabling File Caching:

Enabling file caching can greatly improve your site’s performance and speed. Use the following code to set up caching (changing the file types and time values to suit your site’s needs). Time shown for Max age is in Seconds.

#cache html and htm files for one day

<FilesMatch “.(html|htm)$”>

Header set Cache-Control “max-age=43200″

</FilesMatch>

#cache css, javascript and text files for one week

<FilesMatch “.(js|css|txt)$”>

Header set Cache-Control “max-age=604800″

</FilesMatch>

#cache flash and images for one month

<FilesMatch “.(flv|swf|ico|gif|jpg|jpeg|png)$”>

Header set Cache-Control “max-age=2592000″

</FilesMatch>

#disable cache for script files

<FilesMatch “\.(pl|php|cgi|spl|scgi|fcgi)$”>

Header unset Cache-Control

</FilesMatch>

#cache html and htm files for one day

<FilesMatch “.(html|htm)$”>

Header set Cache-Control “max-age=43200″

</FilesMatch>

#cache css, javascript and text files for one week

<FilesMatch “.(js|css|txt)$”>

Header set Cache-Control “max-age=604800″

</FilesMatch>

#cache flash and images for one month

<FilesMatch “.(flv|swf|ico|gif|jpg|jpeg|png)$”>

Header set Cache-Control “max-age=2592000″

</FilesMatch>

#disable cache for script files

<FilesMatch “\.(pl|php|cgi|spl|scgi|fcgi)$”>

Header unset Cache-Control

</FilesMatch>

11. Protecting your site from hotlinking:

The last thing you want is for those stealing your content to also be able to embed the images hosted on your server in their posts. It takes up your bandwidth and can quickly get expensive. Here’s a way to block hotlinking within htaccess. You will have to replace the domain\.com with your own domain name.

RewriteEngine On

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http://([ -a-z0-9]  \.)?domain\.com [NC]

RewriteRule \.(gif|jpe?g|png)$ – [F,NC,L]

RewriteEngine On

RewriteCond %{HTTP_REFERER} !^$

RewriteCond %{HTTP_REFERER} !^http://([ -a-z0-9]  \.)?domain\.com [NC]

RewriteRule \.(gif|jpe?g|png)$ – [F,NC,L]

12. Disguise your file types:

You can disguise your file types by making them appear as PHP files. Just insert this little in:

ForceType application/x-httpd-php

Even MORE .htaccess Resources!

Hope all of these resources help you on your travels!

Remember! With great power, comes great responsibility!

How to use .htaccess

how-to-use-190x407

Intro to .htaccess

intro-htaccess-190x407

Comprehensive guide to .htaccess

comprehensive-guide-to-htaccess-190x407

Cheatsheet for .htaccess

cheatsheet-htaccess-190x407

Using htaccess Files for Pretty URLS

pretty-urls-htaccess-190x407

10 awesome .htaccess hacks for WordPress

wordpress-htaccess-190x407

I hope that these .htaccess resources will help you on your way to become a .htaccess ninja! Good luck on your journeys! Also, remember to master .htaccess you will probably need to read up on Regular Expressions and practice using them to truly understand them.

If you found this post useful, please leave us a comment! Also, Subscribe to the blog for more great posts in the future!

If you like this, You'll love These.



About the Author

James Parker

James Parker

James Parker is a marketing specialist and IT consultant working in diverse domains under IT and Internet Marketing. He blogs at http://freemagextensions.com, where you can find Magento themes and extensions. If you need any help James will help you. He can be approached at [email protected]



11 Responses to “15+ Tips & Resources for Learning and using .htaccess – An Intro for Web Designers”

  1. Rajesh Wadhwani

    Thanks for this blog, it’s a lot lot useful. You’ve covered almost all the widely used info here.

    I’ve added the page link to my delicious bookmark.

    Reply
  2. Twitter Link Roundup (10.25 – 10.31)

    [...] Web Typography: Font Embedding Services 10 Things Every Web Designer Just Starting Out Should Know What is Typography? A Lesson Dan Rubin on Web Typography WordPress SEO: The Definitive Guide to Higher Rankings for Your Blog 20 Do’s and Don’ts of Effective Web Design Modern CSS Layouts: The Essential Characteristics WordPress Website Design Process All About Google Page Rank Tips and Tricks: Making the Most of Google Calendar All You Need to Know about Web Design Project Preparation Copy Editing: A Good Technique For A Professional Look 15+ Tips & Resources for Learning and using .htaccess – An Intro for Web Designers [...]

    Reply
  3. sriganesh

    thakns for the tips. while adding code- if i dont any mistake is it affect the site and everything.
    =>
    i have changed my url /id-6852 to /categoryname/postname in admin panel settings(wordpress). so if i used to change in htacss will it affect.

    Reply
    • Andy Sowards

      You shouldn’t have to change anything in the .htaccess file, because when you save the wordpress permalinks in the admin area of your wordpress blog it automatically makes the necessary changes to that .htaccess file as long as it has already been made writable (chmod)

      Reply
  4. HullDO

    This is a good list, htaccess is so powerful. Another type of command I like is the ability to remove fancy indexing – this shows your directories as a basic bullet list. It’s worth looking into, if you just want something basic.

    Reply
  5. Thomson

    Very Use tips. My favorite is protecting your site from hotlinking one really useful, it helps to save your bandwidth from cyber thiefs.

    Reply
    • Andy Sowards

      Thanks Thomson! Yeah htaccess can be both powerful, and save you lots of time or even money.

      Its usefullness really isn’t all that apparent until you actually digg in and use it tho!

      Reply

Leave a Reply