How to organize website files?

[knightmetal]

I've been reading different articles about the way to organize files and folders for websites. Unfortunately I don't seem to fully understand if there's something like the correct or the standard way to do it? All opinions are pretty much in the same path but I've seen they really depend on the complexity of the website, i.e. how large the contents are.

Based on what I've read here's how I'm organizing my files

root
   img
   js
   articles
                topic1
                         article1
                                   img                          
                                   index.html
                                   ...
                                   ...
                         article2
                         article3
                         ...
                         ...
                topic2
                topic3
                ...
                ...
   img
   resources
          classes
          libraries
          templates
          ...
index.php
contactus.php
error1.php
error2.php
...
...

I'd like to know if I'm in the right direction?

[StevenHu]

Well, will this format help you to find your files, or not? What is your criteria for organization?

[gilgimech]

No there's no real format for file structure. But there are best practices.

root
   css
   images
   js

That's about as basic as it gets. The real question is what is this site for? Is it your personal site, is it for a client, are other developers going to work on it?

If it's your own personal site. Structure it however you want. It only has to make sense to you and as long as you can find what you need it's all good.

If the site is for a client or if other developers are going to work on it. Just make sure it makes sense, and I wouldn't go too deep in the directories. Like two or three deep max.

also you have to keep the site's URLs in mind. Like in your example the index.html file in the articles dir will look like this.

httpp://www.yoursite.com/articles/topic1/article1/index.html

That's kind of an ugly URL.

[knightmetal]

Guys, thanks for your comments

That's about as basic as it gets. The real question is what is this site for? Is it your personal site, is it for a client, are other developers going to work on it?

If it's your own personal site. Structure it however you want. It only has to make sense to you and as long as you can find what you need it's all good. 

If the site is for a client or if other developers are going to work on it. Just make sure it makes sense, and I wouldn't go too deep in the directories. Like two or three deep max.

I get your point. This particular site is mine, it's basically a place where I deal with topics about computers and that kind of stuff, so I'm starting to realize it is very important to maintain things in order from the very beginning as it might be hard for me to deal with a (potential) mess in case the site starts growing fast. My concern is basically in terms of scalability.

For instance, my site has an admin account, so because of that, files such as about.php, contact-us.php, index.php..., as well as my admin files are all in my root directory. That's why I started thinking of a way to organize my files, ideally using standards (if there's any) or just best practices. What I did was create folders for images, css, js, resources (classes, libs, config files, etc), and content (articles). Things look much better now.

On the other hand, these days I've been kind of building my portfolio, I really want to focus on good practices not only for myself but to show possible clients that my work is "professional".

also you have to keep the site's URLs in mind. Like in your example the index.html file in the articles dir will look like this.

httpp://www.yoursite.com/articles/topic1/article1/index.html

That's kind of an ugly URL.

You mean I shouldn't have called it index.html? I totally agree, and actually, that won't be its name. I just meant that that's the index page for my "article1", I do know it's not common and it does look ugly to have an index.html page the way I have it. In the end, that index page will have a proper name, something that matches the content of my article Is that what you meant?

[gilgimech]

Originally Posted by knightmetal

You mean I shouldn't have called it index.html? I totally agree, and actually, that won't be its name. I just meant that that's the index page for my "article1", I do know it's not common and it does look ugly to have an index.html page the way I have it. In the end, that index page will have a proper name, something that matches the content of my article Is that what you meant?

No, not quite. What I meant was the 'articles/topic1/article1/' part isn't very semantic. The more directories you add the longer thew URL will get. You should try to make your URL's as clean as possible.

[knightmetal]

Oh I get it, can you then recommend how I can organize that very same section? I just want my site to be as organized and well-distributed as possible. Here's a basic example of how the section would look like in the future,

http://www.yoursite.com/articles/top...le1/index.html

would look like (just an example)

http://www.tech.com/articles/computi...ndex-page.html

root
   articles
      computing
         fix-your-computer
            its-index-page.html
            one-more-page.html
            images

In my case, would you then remove one directory to make it look nicer (for instance, 'fix-your-computer' directory) and put everything about that first article in the 'computing' directory? Then the images for that first article would go in an 'images' sub-folder in the main 'images' folder (the one in root)?

That's what I would do to make it look nicer but but besides 'computing', there will be more categories. That's the thing. Any suggestions will be appreciated.

[jerry62704]

Here is how I would organize it:

root
\images\
\css\
\js\
\resources\
\pages\
\articles\
index.html

The difference between "pages" and "articles" is one is for the site (navigation, etc) and the other is for your specialized use. "Pages" would also contain such things as "not found" pages. You might also break out "images" in the same way with that holding stuff specific to your web pages (headers, footers, etc) and one for articles.

[knightmetal]

Thanks Jerry, I'll keep that in mind.