白紙からページを作る                                標準モード」で作成する←ここをクリック    

「どこでも配置モード」で作成する
今度は,白紙のページからオリジナルのホームページを作りましょう。
−新しいページを作成する−
1.ホームページビルダーを起動する。
       ↓
2.「ようこそ」ダイアログが表示されたら,「かんたん」スタイルを選択し,「OK」をクリックする。


       ↓
3.「ページを作成する」をクリックする。


       ↓
4.「ページの作成ウィザード」ダイアログが表示されるので,各項目を選択する。
ここでは,表示環境」→「PC(通常)」,「ページの種類」→「通常ページ」,「作り方」→「白紙から」,「編集モード」→「どこでも配置モード」を選択しました。 


       ↓

5.「完了」をクリックする。
ウィンドウの各部を説明するダイアログが表示されたあと,白紙のページが開きます。 


       ↓
6.簡単ナビバーの「ページ設定」をクリックする。


       ↓
7.「ページの設定」ダイアログが表示されるので「かんたん設定」をクリックする。


       ↓
8.このページのタイトルを「ページのタイトル」に入力し,「次へ」をクリックする。
ここでは,「野菜のレシピ」と入力しました。


       ↓
9.「ページ設定(背景や文字色)」ダイアログが表示される。「カラーギャラリーから」が選択されていることを確認し,「次へ」をクリックする。


       ↓
10.「ページ設定(カラーギャラリー)」が表示されるので,「色のカテゴリ」から好きな壁紙をを,「背景と文字の組み合わせ」好きな色の組み合わせを選択し,「次へ」をクリックする。
ここでは黄色の壁紙を選択しました。


       ↓
11.ホームページを開いたときに流れるBGMを設定するダイアログが表示されるが,ここでは設定しないので,「なし」を選択し,「完了」をクリックする。

  
−ロゴ(飾り文字)を作成する−
1.ナビメニューから「ロゴ(飾り文字)の挿入」を選択する。


       ↓
2.ロゴ画像に使う文字を入力し,文字の大きさとロゴ画像の種類を指定する。


       ↓
3.ロゴに背景をつけたいときは「背景の設定」をクリックする。


       ↓
4.背景に使用したい画像を選択し,「完了」をクリックする。


       ↓
5.「ロゴの作成」ダイアログに戻るので,プレビューで確認する。
文字が背景からはみ出している場合は,「文字の大きさ」スライダ をドラッグして大きさを調整する。


       
6.文字と背景のバランスがとれたら「完了」をクリックする。
 

       ↓
7.ロゴが挿入されるので,ドラッグして,配置したい位置に移動させる。



−編集中のページを保存する−
1.かんたんナビバーの「ページの保存」をクリックする。


       ↓
2.「ページの保存」ダイアログが表示されるので,初めて保存する場合は「名前を付けて保存」2度目からは「上書き保存」を選び,クリックする。


       ↓
3.保存場所を指定する。
ここでは,前回Dドライブの「アップロード用」フォルダに作成した,「cooking」を指定しました。


       ↓
4.「ファイル名」に入力されている名前を変えるときは,元のファイル名を削除し,新しいファイル名を入力します。
ここでは新しいファイル名として,「sub5.htm」と入力しました。


       ↓
5.「保存」をクリックする。


       ↓
6.「上書き時に自動的にファイル名を変更する」にチェックマークをつけて「保存」をクリックする。
ページに含まれる画像ファイルが,HTMLファイルと同じ「cooking」サブフォルダに保存されます。



−水平線を引いてみる−
1.ナビメニューから「水平線の挿入」を選択する。


       ↓
2.水平線の太さと幅を選択し,「OK」をクリックする。


       ↓
3.水平線が引かれるので,ドラッグしてロゴの下の位置に移動させる。


       ↓




−画像を入れてみる−
1.ナビメニューから,「デジカメ画像の挿入」→「写真の挿入」を選択する。


       ↓
2.挿入する画像を指定する。
ここでは素材集の画像を使ってみるので,「素材集から」をクリックする。


       ↓
3.「素材集から開く」ダイアログが表示されるので「写真」フォルダから画像ファイルを選択し,「開く」をクリックする。


       ↓


4.選択した画像を右側の「プレビュー」で確認し,「次へ」をクリックする。


       ↓
5.画像の大きさを調整し,「次へ」をクリックする。


6.必要に応じて,画像の明るさや色合いを補正し,「次へ」をクリックする。
ここでは,「クッキリ補正をする」にチェックを入れました。


       ↓
7.画像の縁取りを指定し,「完了」をクリックする。
ここでは,「なし」を指定しました。



       ↓


       ↓
8.画像をドラッグして,水平線の下に移動させる。


       ↓
9.画像のまわりに□マークが表示されているのを確認する。


       ↓
10.ツールバーの「かんたん編集」をクリックし,「属性の変更」を選択する。


       ↓
11.「代替テキスト」に画像の説明を入力し,「OK」をクリックする。


       ↓
12.「プレビュー」をクリックし,マウスポインタを画像の上に置くと,代替テキストが表示されることを確認する。


       ↓
13.確認が終わったら「ページ編集」に戻しておく。
−画像の大きさを変える−
1.画像をクリックする。
       ↓
2.画像の右下角に表示された□マークにマウスポインタを合わせ,画像の中心方向にドラッグすると,画像が縮小される。


       ↓
3.画像を移動したい位置にドラッグさせる。
       ↓
4.画像にフレームをつけるときは,画像をクリックし,ツールバーの「かんたん編集」をクリックして,「フォトフレーム装飾」を選択する。


       ↓
5.「フォトフレーム挿入」ダイアログが表示されるので,「種類」から「イラスト」を選択し「一覧」からフォトフレームのデザインを選択して,「OK」をクリックする。



       ↓



−文字を入力する−
1.メニューバーから,文字の挿入を選択する。


       ↓
2.「文字の挿入」ダイアログが表示されるので,説明を読み,「閉じる」をクリックする。


       ↓
3.マウスを斜めにドラッグして,文字を挿入する位置と幅を指定する。


       ↓
4.文字を入力する。



−文字の大きさを変える−
1.入力した文字をクリックし,周囲に□マークが表示されたらダブルクリックする。


       
2.ツールバーの(フォント拡大)ボタンをクリックする。



       ↓
3.文字を太くしたいときは,文字が選択された状態のまま(太字)ボタンをクリックする。


       ↓
4.文字の位置や幅をさらに変更したい場合は,マウスをドラッグして調整する。
      

−文字の色を変える−
1.文字を選択したまま,(文字色の変更)ボタンの右にある▼をクリックする。
       ↓
2.好きな色をクリックして選択すると文字の色が変わる。


       ↓
3.ページの編集領域のあいているところをクリックすると,文字の選択が解除され,文字の色が変わったことが確認できる。


−トップページへのリンクを設定する−
1.ページの適当な場所にリンク元になる文字列を入力する。


       ↓


2.文字列をクリックし,文字の周囲に□マークが表示されたら,さらにダブルクリックする。


       ↓
3.ナビメニューから,「リンクの挿入」を選択する。


       ↓
4.「ページやURLへのリンクを作成する」が選択されていることを確認し,「次へ」をクリックする。


       ↓
5.「リンク作成ウィザード」(文字列,画像ファイルの設定)ダイアログが表示されるので,そのまま「次へ」をクリックする。


       ↓

6.「リンク作成ウィザード」(ページやURLへのリンク作成)ダイアログが表示されるので,「リンク先(URL,ファイル名)」の横の「選択」をクリックし,表示されるメニューから「ファイルから」を選択する。


       ↓
7.「開く」ダイアログが表示されるので,リンク先のファイルを指定し,「開く」をクリックする。
※ここでは,ドライブDの「アップロード用」フォルダにある「cooking」サブフォルダを開き,トップページのファイル,index.htmを選択しました。 


       ↓
8.「完了」をクリックする。


       ↓
9.素材集から適当なアイコンを選んで,ページに挿入し,リンクが挿入された文字列の横や上など好きなところに配置する。
※素材集から素材を挿入する方法は,−編集モード−の「どこでも配置モードで作成する」の9.〜11を参照してください。


       
10.ページを上書き保存する。

−リンク先のページを開く−
1.リンクが設定されている文字列「トップページへ戻る」を2回クリックする。


       ↓
2.マウスを右クリックし,表示されるメニューから「リンク先ページを開く」を選択すると,トップページが編集画面に開く。



−リンク先のページを開く−
1.トップページが開いているので(開いていない場合はトップページを開いてください),ページ上の画像以外の場所をクリックする。


       ↓
2.何も選択されていない状態になるので,ナビメニューから,「リンクの挿入」を選択する。


       ↓
3.「ページやURLへのリンクを作成する」が選択されていることを確認し,「次へ」をクリックする。


       ↓
4.文字列や画像を指定せず,そのまま「次へ」をクリックする。


       ↓
5.「リンク先(URL,ファイル名)」の横の「選択」をクリックし,表示されるメニューから,「ファイルから」を選択する。


       ↓
6.「開く」ダイアログが表示されるので,リンク先のファイルを指定して,「開く」をクリックする。
※ここでは,ドライブDの「アップロード用」フォルダにある「cooking」サブフォルダを開き,サブページのファイル,sub5.htmを選択します。

  
       ↓
7.リンク先にサブページのアドレスが設定されるので「完了」をクリックする。


       ↓

8文字列をドラッグして,ページ上の適当な場所へ移動する。



       ↓


       ↓
9.素材集から適当なアイコンを選んでページに挿入し,リンクが設定された文字列の横や上など好きなところへ配置する。


       ↓
10.ページを上書き保存する。

11.トップページとサブページの間のリンクが正しく設定されたかどうかを「プレビュー」で確認する。
※確認のしかたは「サンプルを利用して」−プレビューで確認する−を参照してください。