 まずナビゲーションの部分から制作をはじめよう。ここで重要になる機能が同じ素材を何度もつくる手間を省略できる「コンポーネント」。
1.コンポーネントとは? 「Rainbow Graphics」には、オープニングアニメーションが入るトップページを除き、すべてのページの左側にナビゲーションを配置する。共通の要素(ここではナビゲーション部分)を複数のページに配置する場合に便利な機能が「コンポーネント」。GoLiveではHTMLページ内に、他のHTMLページを、テキスト、画像、その他の視覚的コンテンツが含まれた状態で埋め込むことができる。この埋め込まれているHTMLファイルがコンポーネントで、コンポーネントに対して加えられた変更は、それを配置しているすべてのページに反映される。つまり、ナビゲーションのボタンをひとつ増やす際に全部のページを更新しなくても、コンポーネントのファイルのみを修整すればすむというわけだ。
2.ナビゲーション用のWebページをつくる それでは、実際にコンポーネントの機能を生かしたナビゲーションの制作に移ろう。まず、最初につくった「rainbow folder」からいったん離れて、「ファイルメニュー>新規」で新しいWebページを作成する。ファイルが開いたら、ドキュメントウインドウの上の方にある「ページタイトル」の内容を変更しておこう。
 初期設定では「Welcome to Adobe GoLive 5」になっているので、ここでは「Rainbow I Navigation」に直した
3.Webページのサイズを設定する まずはドキュメントウィンドウの右下にある「ウインドウサイズの変更」プルダウンメニューから「780(17インチモニタ)」を選択する。次に左上にある「ページ」アイコンをクリックし、インスペクタを「ページインスペクタ」に変える。ここで[左右のマージン:0 ]、[上下のマージン:0 ]と入力した。
 インスペクタを表示していない場合には、「ウインドウメニュー>インスペクタ」で開いておこう |
 |
4.コンポーネントに指定 ここで「ページインスペクタ」の「HTMLタブ」の中にある[コンポーネント]ボタンをクリック(すぐ上にある[JavaScript]のチェック項目が切り替わる)。ここまで設定できたら一旦ファイルを保存する。
|