Lovingly written and submitted by fLaMEd. Thank you, fLaMEd!
You can organise all of your website projects with this simple folder structure. You will only need four folders for a nicely organised web project.
The four folders are root, css, img, and js.
The project root folder can be named after your web project, e.g. 32bit.cafe. The root folder or your project folder is your primary folder, and all of your HTML files will live here, e.g. index.html, about.html, contact.html, projects.html.
The other three folders will also reside within this project folder. The other three folders are self-explanatory.
The css folder will hold all your CSS files, e.g. styles.css or style.css.
The img folder will hold all your image files (.jpg, .jpeg, .png, .gif, etc.), e.g. header.png, featured-image.jpg, or 88x31-button.gif.
The js folder will hold all your JavaScript files, e.g. app.js or site.js.
It's good practice to use lowercase for your folder names.
If you find yourself with large amounts of images, do not be afraid to create subfolders within the img directory.
Use this template as a starting guide and modify it to suit your project needs.
In text format, the folder structure appears like this:
32bit.cafe / |- / CSS / | styles.css |- / img / | 88x31-button.gif | featured-image.jpg | header.png |- / js / | apps.js -about.html -contact.html -index.html -projects.html