PROBLEM:
- If we starting create a new project, we try design folder structure
- But sometimes we have too many kinds of files (like frond-end developers's assets)
- Like here: https://github.com/h5bp/html5-boilerplate folders CSS, JS, IMG
- We don't need create folder for 2 or 3 files, it is useless
- Files needs to be semantically separated, but semantically doesn't mean folderlly :)
SOLUTION:
Instead of useless folders for every logical type of file, you can use prefixes. You can use main prefixes (css-, js-, img-) and infixes (css-sass-, css-less, js-global, js)
BEFORE:
folders: open css folder - only three files .. js again .. img again .. :(
css/jqueryui.scss
css/normalizer.scss
css/global.min.css // compiled minified sass files in one file
js/jqueryui.js
js/dojo.js
js/dojo.min.js
img/logo.png
img/spritedicons.png
AFTER:
assets/css-scss-jquery.scss
assets/css-scss-normalizer.scss
assets/css-global.min.css
assets/js-jqueryui.js
assets/js-dojo-button.js
assets/js-dojo-titlePane.js
assets/js-dojo-accordionMenu.js
assets/img-logo.png
assets/img-spritedicons.png
BENEFIT:
Editor and OS arranges files in base on alphabet so you have everything nice :)