Get Organized:
Create a Clean File & Folder Structure

Get Organized: Create a Clean File & Folder Structure

Chefs hate a dirty kitchen and web developers hate a cluttered folder structure. Make your life (and your co-developers') easier by organizing your web environment.

Organization is Vital to any Project

Organizing your web directories is just as important as optimizing your code. No matter the size of your web project, creating a clean environment to work within will pay dividends when you have to add or edit files on a regularly (or even irregular) basis. 

As a web developer, your job is similar to a mechanic in that your everyday tasks are dependant on the tools that you use. If your toolbox is cluttered, minute-by-minute, your tasks will take longer to begin and finish. Every web project should begin with proper assembly.

Let's take a look at how you can create a very organized structure and easily reapply it for future projects.

Sloppy Directory Structure

Example of a Sloppy Directory Structure

In the example (to the left) of a very poorly organization directory structure, you can clearly see the chaos. The web environment is almost non-existent amidst a heap of muddled files.

The average website consists of over a hundred files. Imagine the trouble in finding a file if this small example was twice or three times the size!

Crisp Directory Structure

Example of a Crisp Directory Structure

A crisp directory root usually consists of five different folders for varying filetypes: images, scripts (javascript files), styles (CSS files), pages, and includes (shared html content). Note that the includes and pages folders are outside of the public realm. This is a secure way of ensuring the integrity of your site's most vital files.

Organizing your web projects is simple and the payoff is huge. Using the example below, you have a great template for your future web directory structures.


Add Comment

Leave a Comment or Reply
Fuel the conversation with your thoughts using the form below. Email is not made public.
× Processing...

Please Wait while your Comment is being Processed.


Comments 3 Total Responses

Jeff Seals
Comment Rating: 1

@Chris Todd

No problem, Chris:

Taking the includes, functions, and pages folders outside of the public realm does not negatively affect SEO or load times. If anything, it speeds up load times are these files are no longer publicly accessible outside of where you determine they can be read/used.

Here's a loose analogy:

A bank provides customers with dollar bills as a means of further protecting its symbolic assets (the actual gold). The gold is never accessible, and thus protected, yet the dollar bill is provided in its place to the public.

Chris Todd
Comment Rating: 0

"Note that the 'includes' and 'pages' folders are outside of the public realm. This is a secure way of ensuring the integrity of your site's most vital files."

Can you explain your comment a bit more please as I've not seen anyone else use this method before?

Does taking them out of the public realm (I imagine you mean the public_html folder) effect loading times, SEO ranking or anything else?

Thanks for the great post!

Comment Rating: 3

Thanks. Very simple, and concise language. For a subject such as this, people do not need long-winded articles (as with loads of other sites), which, despite being quite knowledgeable, do not even get to the crux of the matter.

Thanks again.