Organized, Short Folder Structure Using mod_rewrite

By  on  

I tend to be over-organized when I create the folder structure of my customers' websites. I like using descriptive file and folder names for a number of reasons:

  • Search engine friendly URLS and image names (for image searches)
  • Descriptive file names give users a "preview" of the linked page in the status bar (if the anchor text isn't descriptive enough or the link is an image)
  • I want to be able to tell what a file is when I see the file name

One problem with my method is that long folder names can be annoying to type and can bloat your pages resulting in ugly load times. I use the power of mod_rewrite to shorten paths to files I reference most, image files.

The XHTML

Image

becomes...

Image

The mod_rewrite .htaccess

RewriteEngine On
RewriteRule ^gis/(.*)$ /graphics/icons/small/$1 [L]

Recent Features

  • By
    Chris Coyier’s Favorite CodePen Demos

    David asked me if I'd be up for a guest post picking out some of my favorite Pens from CodePen. A daunting task! There are so many! I managed to pick a few though that have blown me away over the past few months. If you...

  • By
    Camera and Video Control with HTML5

    Client-side APIs on mobile and desktop devices are quickly providing the same APIs.  Of course our mobile devices got access to some of these APIs first, but those APIs are slowly making their way to the desktop.  One of those APIs is the getUserMedia API...

Incredible Demos

  • By
    Send Email Notifications for Broken Images Using jQuery AJAX

    It's usually best to repair broken image paths as soon as possible because they can damage a website's credibility. And even worse is having a user tell you about it. Using jQuery and PHP, you can have your page automatically notify you of broken...

  • By
    JavaScript Canvas Image Conversion

    At last week's Mozilla WebDev Offsite, we all spent half of the last day hacking on our future Mozilla Marketplace app. One mobile app that recently got a lot of attention was Instagram, which sold to Facebook for the bat shit crazy price of one...

Discussion

  1. Very slick :)

  2. Okay very interesting. How would that apply if your directory structure was set out like this?

    /nr/rdonlyres/2069656a-f68e-4563-b9a5-4b9a9922f7a4/0/transferform0809.pdf

    /nr/rdonlyres/86e6a9ab-1633-4e4b-8790-bff74df03487/0/lamslistpublishedweb11november08.pdf

    As you can see the 3rd subfolder changes and could be anything.

    What if I wanted it to look like.

    /attachment/filename.pdf

    Using the method you mentioned how would it work?

    Cheers
    zeroanarchy

    • efwf

      hahaha melllttttttttt , no one likes you !

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!