●ホームページ制作の流れ

企画
レイアウト
サイトの
新規作成
トップページ
編集
他のページへの
リンク作成
サブページ
(2ページ目以降の製作)
サイトの
転送設定
サイトのファイル転送
(アップロード)
ネットで確認
再びページ編集
テーマを考える
何についてページに書き込むか、大まかなテーマを考えます。 最初はいくつか違った種類のテーマを考えておき、あとで絞り込むのも良いでしょう。
内容を考える
テーマに沿って、さらに細かく何について書けるかを箇条書きにして並べてみます。
その中であとで各ページに書き込む内容を絞り込んでいきます。
各ページに入れる素材の配置を書き出す
箇条書きにした内容の一つが大体1ページとお考え下さい。
各項目ごとに、1枚の紙に写真や文章の内容や配置を区切りながら配置してみます。
※この場で完璧なものにしなくても良いのですが、ここがおろそかになると制作に入っても時間がかかるばかりでうまく制作できません。
サイト新規作成
ホームページビルダーで新しいサイトの登録を行います。
(テキスト:【ホームページビルダーV9】P48~
【ホームページビルダーV11~】P70~
必要な情報
・フォルダ名(半角)
・サイトの登録名(日本語=テーマと同じ)

・フォルダを作る場所の確認
(例:舞ドキュメントのホームページフォルダの中など)
作表
サイトを新規作成したときにできたトップページ「index.htm」に、表の挿入でまず外枠を作ります。
メニューやひとかたまりになった内容は、その都度セルの中に新たに表を作りましょう。
外枠だけで区切ると、大きな写真が入った列がすべて大きく広がったりして扱いにくくなるためです。
文字入力
文章を入力します。段落改行はシフトキーを押しながらエンターして入力します。
写真挿入
ウェブアートデザイナーで加工し、Web用に保存した画像を呼び出します。 GIF,JPEG形式
RGBモード
メニュー作成
ページのに(縦に長いページは下の方にも小さく)ほかのページへのリンクを置くメニューを作りましょう。 右端に置くとパソコン環境によって見られない人がいます。モバイル用の小さい画面で見ている人は、毎回右にスクロールしないとメニューが見れないストレスがあるためすぐにページを見ることをやめてしまいます。できるだけメニューは左か上、下に置きましょう。右におく場合はスクロールせずに一部でも見られるよう工夫しましょう
★自主制作では、アニメーション・ロゴ・画像またはイラスト、ロールオーバー・壁紙をどこかにどこかに使ってください。ライン(区切り線)やボタンはお好みに合わせて使いましょう。
また、ページ内にロゴばかりで普通のテキスト文章がないと、検索に引っかかりにくくなります。
検索してほしいキーワードが含まれる普通の文章を盛り込みましょう。
リンク先ページを白紙で仮作成
まずトップページのメニューから、他のページへのリンクを張ります。

『ファイルへ』タブの『参照』でリンク先のファイルを探します。




ところが!リンクしようにも他のページはまだ作ってないから
リンクが張れません!(上図参照)
そこで・・・
★リンク先のページを白紙で仮に作成保存します。
新しいページを標準モードで新規作成
→『ファイル』-『名前をつけて保存』
ファイルの場所作っているサイトのフォルダ
ファイル名半角英数で2ページ目のファイル名
   ※ここでは2ページ目がカバックタトゥルスなので、たとえば[kavack]
     など他と区別ができるよう簡潔に。

★ここで再びメニューからリンクを張りなおします。

『ファイルへ』タブの『参照』でリンク先のファイルを探します。


目的のファイル名をダブルクリックするか、選択して[開く]をクリック


※他のメニューにも同様にリンクを張ります。

トップページを上書き保存する
トップページができたら、ほかのページにもメニューや同じ大きさの表などをコピーするために
トップページを次のページに上書きします。その前に、編集中のトップページは必ず上書き保存
しておく必要があります。これを忘れるとトップページの編集がなかったことになりますので要注意!!
トップページと同じメニューをサブページにコピー
編集中のページを上書き保存したら、次のページへ上書き保存します。
手順は次のとおりです。

ページを開いておき、『ファイル』-『名前をつけて保存』

このとき、次のページのファイル名をクリックします。
『ファイル名』が変わったら『保存』をクリック


上書きしますかと聞かれたら迷わず『はい』をクリック


ここまでで、トップページとサブページの内容は全く同じになりました。


ここから、サブページの編集をします。
このページに不要なものを全て削除して、写真や文章などを入れていきましょう。
材料・作り方などを保存しておいたメモ帳からコピーして、このページ内に貼り付け氏、
文字の書式を整えます。
イラストや飾り罫(ライン・区切り線など)を入れてページを完成させましょう。

次のページを編集するときは、上書き保存してからの手順を繰り返します。
ページ設定
編集ができたら、転送前にすべてのページにページタイトルをつけましょう。
これは、作ったページを検索して探してくれるユーザーに親切な名前をつけておく必要があります。ブラウザで開いたときに、、タイトルバーに表示される文章のことです。
設定方法は次のとおりです。

メニューの【編集】-『ページの属性』をクリック

ページタイトル欄に、検索用のタイトルを入力。
 検索キーワードを盛り込むとよい。

入力後【OK】ボタンをクリックします。
すると、タイトルバーに入力した文章が表示されます。

各ページ、同じようにページタイトルを入力しておきましょう。
全ページ共通の言葉を入れておくと、見に来た人が迷わずにすむので親切です。
ここにはホームページの内容に合った文章を入力しましょう。
転送設定
ページの編集ができたらプレビュー画面やブラウザで確認し、サイト内のファイルをプロバイダに転送します。まず転送するための準備をしましょう。

【転送設定】(初回のみ)
★準備するもの
プロバイダの契約書にある設定情報
1.FTPサーバー名
2.FTPアカウント(ユーザー名)
3.FTPパスワード

準備ができたら、ホームページビルダーで転送設定を行います(テキストP108)
【サイト】-【転送設定】-【転送設定の新規作成】をクリック

 日本語でわかりやすい設定名を入力しましょう。


契約したプロバイダ名をプルダウンメニューから選択するか、ない場合は『その他』を選択します。

FTPサーバー名・ユーザー名・パスワードは先ほど用意した契約書を確認しながら正確に入力しましょう。(半角英数)


転送先フォルダ名は、httpで始まるドメインアドレスの後につく
フォルダ(ディレクトリ)名です。複数の人が同じプロバイダ契約で複数のサイトを作る場合は「/foldername」のように入力しますが、1契約で1サイトの場合は空白にしておきましょう。

すべて入力したら完了をクリックします。
※ここまでの手順は初回だけですので、次回転送するときには設定する必要はありません。
サイト転送(2回目以降の転送の方法)
ページを全て上書き保存してから行います。
【サイト】-【サイト転送】をクリック
転送設定名・転送先フォルダ名・転送対象を確認して転送ボタンをクリックします。このとき、初回の転送では「全てのファイル」を選択しますが、2回目からは「前回の転送以降に更新されたファイル」や「今日更新されたファイル」などを選択すればOKです。
注意:転送する際は変更の内容を選択し、また別のフォルダに中身を上書きしてしまわないようにフォルダ名に注意し、必ず確認するようにしてください。

ブラウザで確認
ファイルを転送したら、世の中のネットでつながった全てのパソコンからあなたのホームページが見られるようになりました。早速見てみましょう。
インターネットブラウザを立ち上げる
http://で始まる契約書にあるアドレスを入力エンター。
トップページが表示されれば転送成功。表示されない場合は次のことが考えられますので転送しなおしましょう。
【原因】
・トップページのファイル名が[index]ではない
・転送に失敗した(回線混雑など)
・転送設定の入力ミス(設定のやり直しや確認、プロバイダのホームページで設定方法を確認)
・転送する際転送ファイル一覧にチェックが入ってないファイルがある
・ブラウザで確認する際の「http://...」の入力ミス

以上のことを確認して、転送やブラウザで確認しなおしてみましょう。
ページ編集に戻って再編集
ネットで確認したら、セルの状態や画像や文字など、修正を加えなければならない部分が発見されます。その場所を記憶して、ホームページビルダーで手直しをします。

ここからは、次の手順の繰り返しになります。

ページ編集プレビューで確認→上書き保存転送→ブラウザで確認(http://..)→ページ編集...