Web
  メイキングWebデザイン【初級編】Adobe GoLive & Live Motionではじめよう!
page: 1 2 3 4 5 6 7 8 9 10 11 12
新規Webサイトを製作するための準備 KEYWORD 新規サイトの作成
GoLive 5.0で新規にWebサイトを制作する際の、いちばんはじめに行う下準備について説明する。最初にきちんと設定すれば、GoLive側で自動的に必要なファイルやフォルダを書き出してくれるほか、全体のサイト管理もたいへんしやすくなる。

1.新規サイトのフォルダ名を設定
GoLiveを起動し、「ファイルメニュー>新規サイト>新規作成...」を選択。ここで「新規サイトの作成」ウインドウが表示されるので、[フォルダを作成]にチェックをし、新規サイト名として「rainbow」を入力。あとは保存先を選び、Macなら[選択](または[保存])、Windowsなら[OK]を押せば、そこに「rainbow folder」ができあがる。

新規サイトのフォルダ名を設定


2.サイトウィンドウとは何か
「rainbow folder」が作成されると同時に、サイト管理のための基本ウインドウである「サイトウインドウ」が自動的に開く。「ファイルタイプ」が選択された状態になっており、そこに「index.html」ができ上がっている。このindex.htmlがWebサイトのトップページになる。今回のWebサイトの場合なら、オープニングのアニメーションがあるページがそれにあたる。サイトウインドウはウインドウ下のボタンをクリックすると、右側にもうひとつのタブ群が隠されている。そうすれば「エクストラ」や「FTP」といったタブが見えるようになる。

サイトウインドウ


3.自動生成されたファイル類をチェック
「rainbow folder」の中身をチェックすると、「rainbow」フォルダ、「rainbow Backup.site」、「rainbow.data」フォルダ、「rainbow.site」という4つのサイト制作に必要であるファイル/フォルダ自動生成されている。「rainbow」フォルダの中には「index.html」があり、これから作成していくサイトのHTML などのファイル類はここに格納される。「rainbow.data」フォルダにはサイト構築とアニメーションのためのファイルが格納されていく。また「rainbow.site」ファイルにはサイト構造に関する情報が収められていて、このファイルを開くと、さきほどの「サイトウインドウ」が表示される。「rainbow Backup.site」は名前の通り、バックアップ用のファイルである。

ファイル類のチェック


トップに戻る


back next
メイキングWebデザイン【初級編】
Webデザインの潮流
Webサイト全体の構造
新規Webサイトを製作するための準備
ナビゲーションの製作
画像の配置と整列
コンテンツページのレイアウト
ページを仕上げる
外部URLへのリンクと
  Eメールリンクの設定

各ページにリンクを張って
  Webサイトを完成させる
 
メイキングWebデザイン
【初級編】
【中級編】
【上級編】

ダウンロード
サンプルテンプレート

フリーボタン素材
・印刷用PDF
STEP1〜3 (PDF: 337KB/3 ページ)
- GoLiveによるWebサイト構築
STEP4〜8 (PDF: 530KB/5 ページ)
- Rainbow Graphicsの製作過程
STEP9〜10 (PDF: 272KB/3 ページ)
- LiveMotionでアニメーション製作
STEP11〜12 (PDF: 126KB/1 ページ)
- サイトの完成、公開の準備