ホームページディレクトリ構造は適切に
ディレクトリ、という言葉に「？」と思ってしまった方もいると思います。簡単に解説すれば、WindowsやMacで言うフォルダのことと思って差し支えありません。（厳密にはすこし違うのですが）
Webサイトを作成する時は、公開ディレクトリがあり、そこからツリー状（木の様に広がっていく様からツリー状といいます-図A）に様々なディレクトリを作っていきます。
ですが、私は仕事上、他のWebデザイナーさんが作ったWebの管理も任されることもあるのですが、プロが作ったものにも関わらずひどいこともあります(^^;;。「これが絶対的に正しい！」というものは無いのですが、基本的なことは押さえておきたいところです。
基本はきれいなツリーに
まず構造を考える際に、最も重視しなければいけないのは、分かりやすくすることです。直感的に見て、どの様なファイルが、どのディレクトリに入っているのか、また、ファイル名もわかりやすいのか等を注意する必要があります。
突っ込み型は分かりにくい
初心者の方に最も多いのが、公開ディレクトリに全てのHTMLファイルを置いてしまうことです。ページ数が少なければそれでも分かるかもしれませんが、後々拡張していった時に、非常に見づらいですし、扱いにくくなります。
Webサイトを作る際は、コンテンツをカテゴリ分けすることができると思いますので、適度にディレクトリを作って分類するとよいでしょう。
ファイルやディレクトリ名の決め方
もちろん決まりはありませんが、分かりやすい単語にしておきましょう。しかし、略しすぎてファイル名だけ見ても「？」になってしまうものは避けた方がいいでしょう。
実は、ファイルやディレクトリの名称はSEO（検索エンジン最適化）的な観点からも若干影響がありますので、慎重に考えたいものです。例えば、abcde.htmというファイル名をつけておけば、google等で「abcde」と検索された時に、若干有利になります。可能なら、検索されたい名称をつけましょう。
管理人：馬場の例
こんな説明をしている私ですが、私のやり方だって自分がやりやすいようにやっているだけです。皆さんがやりやすいかは分かりませんが(汗)ご紹介します。
私の場合
私はまず、公開ディレクトリ下に、「画像」「スクリプト」「スタイルシート」を入れるディレクトリを作成します。同時に、まとまった記事毎にディレクトリを作成します。必要であればその中にも「画像」を入れる為の……
……すいません、今書いてて、これじゃあ絶対伝わらんだろ！と自分に突っ込みを入れてしまいました。（作りかけの）当サイトのDreamweaverのサイトビューを公開しますので、興味がある方はそれをご覧ください。
- このサイトをデザインするpngファイルを入れています。公開サーバにアップロードする必要は無いのでクローク(※１)。
- スタイルシートを入れるディレクトリ。
- サイト全体から読み込む画像を入れるディレクトリ。
- JavaScriptを入れるディレクトリ。
- カテゴリの一つ。
- このディレクトリ内でのみ使用する画像
- Dreamweaverのテンプレートファイル。本当はこれも本番サーバにあげる必要はないので、セキュリティ上クロークした方がいいですね。
クロークとは
※1 クロークとは、Dreamweaverにてファイルをアップロードする際に、除外することができるという機能です。サーバーにアップする必要がないディレクトリはセキュリティ上クロークしておくことをお勧めします。サイトビューで、クロークしたいディレクトリ上のコンテキストメニュー（右クリックメニュー）から行えます。
Web制作Tips- デザイン
- ├フリーの写真素材を有効活用しよう
- ├デザイナーならこだわりたいカーニング（文字詰め）
- ├文字のジャンプ率で適切なサイトイメージを演出する
- ├TPOを考えてハズさないフォントを選ぶ
- └失敗しない配色の基本
- ユーザビリティ
- ├そのフォントサイズ、適切ですか？
- ├リンクテキストをわかりやすくする
- ├フォームのリセットボタンを考える
- ├リンク切れ時に適切な404ページを表示をする
- └フォームの確定ボタンは右?左?
- コーディング
- ├文法チェッカーで正しい(X)HTML/CSSを書こう
- └インデントで読みやすいソースコードを
- その他
- ├ディレクトリ構造は適切に
- └絶対パス?相対パス?ファイルの指定方法いろいろ
