ホームページを作られる方をサポート致します
DreamWeaverの使い方①
DreamWeaver 起動
Dreamweaverを起動すると、まず次のような画面↓が出てきます。
macromediaのstudio（現在adobe）製品を開くとどれもこんな感じの初期画面が出てきます。
これについては説明することはありません。
表示させたくないと思った方は左下の「次から表示しない」にチェックを入れましょう。
ほとんど使ったことが無いので、当サイトのすべての講座はこの画面は説明しません。
新しくファイルを作るときは、上にあるメニューバーか、ショートカット[Ctrl+N]を使用します。
[Ctrl+N]を押してみてください
新規ドキュメントというウインドウが開きます。
通常は、左側にあるカテゴリの中から「基本ページ」を選択し、右側の基本ページからHTMLを選択。
そして作成ボタンをクリックすると次のような画面になります。
ここから実際に製作に入っていきます。
製作
環境設定のページをご覧になられた方の初期ソースはこんな感じのはずです。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="ja">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
<meta http-equiv="Content-Style-Type" content="text/css">
<title>無題ドキュメント</title>
<meta name="description" content="">
<meta name="keywords" content="">
</head>
<body>
</body>
</html>
あくまで初心者向けなので、深くは解説しません。
それが何であるかだけを頭の片隅に置いていただければと思います。
いずれこの事が必ず役に立ちますから。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
↑DOCTYPE宣言です。この宣言には他にも種類があり、それによって使えるタグなどが代わります。
<html lang="ja">
↑lang属性で、どこの国の言語であるか。
言語コードです。ちなみにこれはHTML4.01に準拠したときです。
XHTMLになるとまた変わってきます。
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
↑このページはshift_jisという文字コードを使用しているということ。
ヘッダー用プロパティ。
<meta http-equiv="Content-Style-Type" content="text/css">
↑このページでスタイルシート（CSS）を使用するという宣言。
ヘッダー用プロパティ。
<title>無題ドキュメント</title>
↑ページのタイトルです。
実際には↓のように表示されます。ブラウザによっては、上部の青い部分であったり、タブに表示されたりします。
見づらいですが、青い部分の「インフォシーク」と表示されているのがtitleです。
<meta name="description" content="">
↑これはそのページの詳細です。
検索エンジンを使ったことはありますか？検索にヒットした時、ページの説明が下に表示してあるはずです。
それはこのように記述しているものです。
（検索エンジンによってはdescriptionを表示しないものもあります。）
<meta name="keywords" content="">
↑このページがどのような言葉で検索したときにヒットするかです。
しかし、なんでも入れればいいというものでもありません。
keywordsだけでなく、descriptionもそうなのですが、そのページにマッチしたキーワードが必要になります。
<body>～</body>
実際に皆さんがホームページで見てるのはこの中の部分です。
補足
ページ内でjavascriptを使用するときにはmetaタグで宣言してやる必要があります。
本当は上の部分で説明するべきものなのですが、当サイトでは基本的にjavascriptは使わない方向なので。
Dreamweaverでは簡単にロールオーバーが作れますね。
この時使用しているのがjavascriptです。
ですが、これはCSSで代用できます。
しかし、今までjavascriptでやってきたことがすべてCSSで代用できる訳でもないので、本当に必要なときにだけ使用します。
ではその追加する一行を下記に。
これは上でCSSを使う際に記述しなければならない一行を紹介しましたよね。
そこの下に追加してください。
<meta http-equiv="Content-Script-Type" content="text/javascript">
それと、javascriptを使用する際の注意なのですが、javascriptは外部ファイルとして扱います。
拡張子は「.js」です。
例えば、「dw.js」というjavascriptファイルをページ内に読みたいとき、
<script language="JavaScript" src="dw.js"></script>と<title></title>の下に記述してあげます。
（読み込まれるjavascriptファイルと読み込むページが同階層にあった場合。）
