なぜ、ディレクトリ構成を考える必要があるのか
・ディレクトリ直下に異なる拡張子やファイルが散在してしまう
・設計中にディレクトリ構成の見直しをすると、その都度URLやパスの設定を修正する必要が出てくる。
ディレクトリ構造
/ application
/ css
/ js
/ images
index.html
・ファイル移動したらURLやパスを再設定する
<link rel="stylesheet" href="〇〇〇.css">
変更後 ↓
<link rel="stylesheet" href="./css.〇〇〇.css">
・画像ファイルの再指定
<img src="〇〇〇.jpg" alt="〇〇〇" />
変更後 ↓
<img src=".image/〇〇〇.jpg" alt="〇〇〇" />
・JSファイルの再指定
<script src="〇〇〇.js"></script>
変更後 ↓
<script src="./js/〇〇〇"></script>
その他ディレクトリ構成例
・font・・・外部のフォントデータを入れるディレクトリ
aaa.ttf, bbb.ttf
・scss・・・sassで作成したファイルを入れるディレクトリ
・vendor・・・外部からのライブラリを入れるディレクトリ
jquery, fontawesome など
・webサイトのディレクトリ構造とその命名規制に悩む
・assets：複数形で個人。会社の財産・資産
・public：公開の・共有の
・modules：モジュール
・commons：共通
・resources：資源・供給源・物資
・CSSや、JSををまとめたフォルダの生をどうするか
・フォルダの中身が意味するところで、具体的につける派
style, script, image, include, file, download, document, archive, font, web-fonts, library
・上記の両方が混在してしまう
・ライブラリやおプラグインなどをどこに置くか
・gruntやsassなどのメタ言語の登場で、コンパイル前のことも考えないといけなくなってくる。
結論
・dest -- コンパイル結果
・src -- コンパイル前
・index.html
・assets -- コンパイル後に残らないフォルダは、先頭に「_」をつける
・_coffee -- Coffeescript
・_sass -- Sass
・lib -- Sassの共通ライブラリ
・vendor -- 外部ライブラリ。
・js
・css
・img
・webサイト１ページにつき、１HTMLファイル