1

As someone getting started with web development seeing that web pages themselves and content related to them is on same hierarchy level in folder(directory) structure used for website development is confusing.

Now of course this isn't always the case but seems to be a standard generally used form what i have seen from searching and studying online.And i never found proper explanation when is comes to the part of folder structure this question addresses.

As an example something like this is general folder structure i see being generally used.

enter image description here

But this doesn't make sense to me at first sight.Why would you hierarchically in folder(directory)structure define content related to web pages you should just link to them on the same level as web pages themselves when it only adds additional unnecessary complexity for our purposes. For example using above image having to write from Page.html in pages folder every time you need to refer to any content related to web page ../pages/images/one_big_turtle.jpg instead of simply being able to always access all web page related content folders and content in them form pages folder itself whenever you need said content for anything relating to web pages like so images/one_big_trutle.jpg. To me second is much more simple and makes more sense.

So what is the general reason for organizing things like this? In what scenario is it more advantageous then simply having pages related content in pages folder(directory) itself?

3
  • I wouldn't recommend using document relative linking like ../pages/images/one_big_turtle.jpg whre the URL stats with a .. It is almost always better to use site relative links like /images/one_big_turtle.jpg where the URL starts with a /. Site relative links tend to be shorter, work from any page on your site, work from all sub-directories, and don't propagate crawl errors such as double slashes. May 8, 2023 at 16:02
  • I also don't recommend creating a directory structure by file type. I'm of the opinion that files that work together belong side-by-side. foo.html should be next to the resources used directly in that page: foo.js and foo.css and foo.jpg. There can be valid reasons to create directories, but I'm not a fan of the directory layout pictured in your question. May 8, 2023 at 16:06
  • For pages with many files (html, css, images, js, etc) I tend to keep all the files in the same directory for two reasons. First is to reduce mental load, as all related files are in one place. The other is it improves web server performance a bit. A directory is a file with a list of file names and pointer to where they are on disk. If a page needs files from five different directories, the web server would have to open all five to look for the files. If all images are in the same directory, it would be a big file, increasing search time.
    – Uri Raz
    May 8, 2023 at 20:13

2 Answers 2

1

It is about keeping the root tidy as much as anything, but also keeping an easy structure to follow

For example, I tend to keep images in root/data/images, because then I only have a single /data folder on my root, and it covers both images, product datasheets/pdfs, thumbnails (which I keep separate from images), etc.

Not only does it make everything easy to find, it keeps the root folder fairly tidy.

It can also be useful to rewrite things, but the only reason you would usually want to rewrite a folder is to create a cookieless subdomain such as rewriting /data/images to img.example.com and using a prefetch-dns, this allows you to serve content without cookie overheads saving a few bytes to a few kilobytes depending how many cookies you use per request (of which there are often 20+ for a given page)

Note: also, you can just define a global scope variable if you want to for the folder, if you find you are referencing it a lot, then you can just put $folder_variable.'image_name.jpg'; (example php but whatever language you use)

Also: in a lot of cases the picture locations come from a database, so it is not extra effort to write the directory

0

There are two advantages

  1. As the website grows, it becomes messy to have everything in one folder. So, you may as well start with organising the content.
  2. When like things are in a folder, it becomes easier to protect them or limit access to users or robots by controlling the folder rather than each file. For example
    • different folders may warrant different file access permissions.
    • you may want to control direct linking to your images.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.