■事前準備
・とりあえずデスクトップに フォルダを 一つ作る
すべてのファイルはこのフォルダの中に保存すること
・載せたい画像を jpeg か gif フォーマットに変換して 作ったフォルダに入れておく
■注意事項 （基本的なことです）
・拡張子は必ずついているかどうか確認
.html .jpg .gif 等々 ついていないとwebでみれません
とくに .html は忘れがちなのでチェック！
・画像サイズはピクセル数でカウント
XGAのモニタは 1024*768ピクセル これ以上でかいと画面からはみ出る
このあたりを参考に大きさを決める 解像度 印刷サイズなどは無視。
横幅は300ピクセルぐらいまでにとどめておいた方が無難
とりあえず 今回説明するのは 簡単にふつうに作ってみる という所まで
まずは作ってみてください
■1 作り方編
01 レイアウトテーブルを書く （台紙と思うこと この上に配置する）
緑色の枠のツールでおよその大きさを書く 幅800ピクセル以内に調整
左上そろえで自動的に書かれます
ただ台紙の大きさを指定しているのみ。
02 レイアウトセルを書く （パーツを載せる下地と思うこと）
書いた枠の中に青色の枠ツールで 配置したい場所に下地となる範囲を書く
画像や文字を起きたい場所を適当に考えて□を書いてみる。
この枠は選択して ←↑↓→ で移動可能
これによって自由なレイアウトが可能になる。
03 セルの中に 文字だったり画像だったりを入れる
文字はカーソルを枠の中に入れるだけで書けます
書いた後で プロパティウィンドウで 文字のサイズ や
色 書式を変えます 変えたい部分を選択して変更
※プロパティウィンドウとは 画面下の横長のウィンドウ
画像は メインのツールバーにある 木の写真のようなボタン
これを押し画像の保存場所を選択
04 リンクの指定
文字にリンクを張る場合は 張りたい部分の文字を選択して
プロパティウィンドウの リンク に アドレスを書き込む
画像をリンクボタンとして扱いたい場合も画像を選択してプロパティウィンドウで
リンクにアドレスを入れる
05 保存
.html がついているかどうか確認して保存
※はじめにつくったフォルダの中に保存する
次週 はサーバーへのアップロードです。 それまでにある程度形にしておいてください。
■課題（授業内）
ページ作成（過去の課題いくつかとトップページ）
□宿題
デザインの参考としたいホームページのリスト
自分のHPを作る際に参考としたいHPを3点に厳選し
掲示板にアドレスとアップロードしておくこと。
次週の授業内で選んできたサイトについて（デザインの特徴や使われている機能について）解説します。
http://www.plus-a-studio.com/bbs/w_s3mbds.cgi
■アップロード編
ドリームウェーバーには サイト というホームページのデータ管理機能があります。
その中の機能を使いデータをサーバに送ることができます。
※ジオシティーズには専用の送信機能がありますが、サイトを利用するようにしてください。
設定の行われているサイトウィンドウでは このように保存に使用しているフォルダとその中のファイルが一覧表示されます。
それではサイトの設定に移ります。 サイトのプルダウンメニューから サイトの編集を選んでください。
その後開いたウィンドウで 新規 を選ぶことで以下のような設定画面へ移ります。
名前は設定に使用するだけの名前なのでわかりやすい名前をつけておいてください。 ホームページのタイトルではありません。
ここは飛ばして 次へ
ローカルで編集し リモートのテストサーバーにアップデート を確認
ファイルを保存する場所を設定します。
※ 毎回自分のファイルは 決めたフォルダ内にすべて保存し MOに保管してください。
授業のたびに デスクトップに コピーし 授業後はMOに必ず保存していくようにしてください。
ここで指定するフォルダは デスクトップにコピーしたものを選択してください。
サーバーの設定ですが
FTPを選ぶ
アドレスは ftp.geocities.co.jp
フォルダは空欄
ログイン名は ジオシティーズのログイン名
パスワードは ジオシティーズのパスワード
自分のホームページアドレスを入力します。 index.html の手前まで
例： http://www.geocities.co.jp/Milano-Aoyama/4137/
有効にしないを確認して 次へ。
サイト名 ローカルフォルダの位置 リモートとテストサーバーが FTP で ftp.geocities.co.jp となっていることを確認して終了。
設定が終わったら サイトのプルダウンに設定名が出ていることを確認し 接続を行います。
プルダウンの右の コネクターが外れた形状の ボタンを押します。
接続されるとコネクターがつながったボタンに変わります。
接続には少し時間がかかります。
接続されるとこのように 左側のウィンドウに サーバー上の フォルダが表示されます。
ここに直にデータを置くと
http://www.geocities.co.jp/Milano-Aoyama/4137/ファイル名.拡張子 （たとえば index.html や 01,html 1.gif 2.ｊｐｇ 等..）
さらにフォルダを作ってその中にデータを入れると
http://www.geocities.co.jp/Milano-Aoyama/4137/フォルダ名/ファイル名.拡張子
となりデータを置いた瞬間からインターネットで閲覧可能となります。
データをサーバーに送るには ファイルを 右から左へドラッグするか
もしくは この上向きの矢印ボタンを押すことで すべてのファイルが転送されます。
転送が終わるとこのようになります。
※ ファイル名に問題があり転送されない場合があります。 このテキストはアップロード前提に作っていないため
上の画像を見ると所々送信されていないものがあることがわかります。
・半角英大文字（ A〜Z ）
・半角英小文字（ a〜z ）
・半角数字（ 0〜9 ）
・アンダースコア（ _ ）
・ハイフン（ - ）
・ピリオド（ . ）
が制限なく利用可能な文字列です。 これを使いファイル名をつけてください。 日本語は以ての外です。
http://www.geocities.co.jp/Milano-Aoyama/4137/