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