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
    Creating Scrolling Parallax Effects with CSS

    Introduction For quite a long time now websites with the so called "parallax" effect have been really popular. In case you have not heard of this effect, it basically includes different layers of images that are moving in different directions or with different speed. This leads to a...

  • By
    Send Text Messages with PHP

    Kids these days, I tell ya.  All they care about is the technology.  The video games.  The bottled water.  Oh, and the texting, always the texting.  Back in my day, all we had was...OK, I had all of these things too.  But I still don't get...

Incredible Demos

  • By
    The Simple Intro to SVG Animation

    This article serves as a first step toward mastering SVG element animation. Included within are links to key resources for diving deeper, so bookmark this page and refer back to it throughout your journey toward SVG mastery. An SVG element is a special type of DOM element...

  • By
    Create Spinning, Fading Icons with CSS3 and MooTools

    A goal of my latest blog redesign was to practice what I preached a bit more;  add a bit more subtle flair.  One of the ways I accomplished that was by using CSS3 animations to change the display of my profile icons (RSS, GitHub, etc.)  I...

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!