iWebを使い始める

ステップ1：整理整頓する

新しい Web サイトの構築を開始する前に、少し時間を取って資料を収集し、整理してください。

写真を集める iPhotoライブラリにたくさんの写真がある場合は、Webサイト用の画像を別々のiPhotoアルバムに保存することで、かなりの時間を節約できます。iWebは、JPEG、GIF、TIFF、PNG、さらにはRawファイル（JPEGに変換されます）など、ほとんどのグラフィックファイル形式をサポートしています。写真にわかりやすいタイトルを付けるのも良いでしょう。iWebは、フォトギャラリーを作成する際に、これらのタイトルをデフォルトのキャプションとして使用します。

ムービーをトリミングする ウェブサイトにビデオを掲載する予定がある場合は、正しいフォーマットになっているか確認してください。iWebはMOV、AVI、MP4形式で保存されたビデオをサポートしています。ただし、ムービーが長くなるほど、視聴者がダウンロードするのに時間がかかることに注意してください。ムービーを圧縮するには、iMovie HDで開き、「共有」メニューから「QuickTime」を選択し、「ムービーの圧縮形式」プルダウンメニューから「Web」を選択します。私は2.8MBのファイルをわずか244KBにトリミングすることができました。

ステップ2: Webページを設定する

メディアの準備ができたら、準備完了です。iWebの最新バージョン（記事執筆時点でバージョン1.1）がインストールされていることを確認してください。

スタイルを選択する iWeb を初めて起動すると、最初の Web ページのスタイルオプションを含むダイアログボックスが表示されます。左側のスクロールバーを使って、iWeb の 18 種類のテンプレートテーマから 1 つを選択します。各テーマには 7 種類のページスタイルが含まれています。一部のページスタイルは特定の目的のために設計されています。例えば、ブログページには、各投稿をアーカイブし、新しいコンテンツで概要ページを更新し、RSS リーダー (ブログの新しいコンテンツを監視するソフトウェア。これにより、他のユーザーがブログの最新情報を把握できます) に投稿を配信するテクノロジが含まれています。この特化の欠点は、コンテンツの種類に適したページを使用していることを確認する必要があることです。

最初のページにはお好きなテンプレートをお選びいただけます。ただし、一度テーマを選択すると、ページを最初から作り直さない限り、新しいテーマに変更することはできませんのでご注意ください。ただし、ウェブサイト内で複数のテーマを組み合わせることは可能です。例えば、ブログページには「Travel」テーマ、写真ページには「Black」テーマなどです。

ページを選択したら、[選択] ボタンをクリックしてそのページを新しい Web サイトに追加します。

ページ名を変更する Web サイトに新しいページを追加すると、すぐに次の 2 つの処理が行われます。サイトオーガナイザー列にページのアイコンが表示され、Web サイト内のすべてのページの上部にそのページへのリンクが表示されます (「サイトの概要」を参照)。訪問者はこれらのリンクを使用して、Web サイト内のさまざまなページ間を移動します。ナビゲーションボタンをもう少し汎用的にしたい場合は、サイトオーガナイザーでページ名をダブルクリックし、別の名前を入力します。Enter キーを押すと、Web ページ上部のナビゲーションリンクが更新され、新しいページタイトルが反映されます。

サイトの概要 ウェブサイトに新しいページを追加するたびに、iWeb はそのページをサイトオーガナイザ (A) に追加し、サイト内のすべてのウェブページの上部にそのページへのリンク (B) を配置します。これらのリンクの名前を変更したり、順序を変更したりするには、サイトオーガナイザでページを調整するだけです。(画像をクリックすると、スクリーンショット全体が表示されます)

ページを追加する 1ページだけのウェブサイトでは、見た目はあまり魅力的ではありません。多くの場合、ユーザーが自由に閲覧できるように複数のページを用意する必要があります。これらのページを今すぐ設定することをお勧めします。そうすることで、個々のページのカスタマイズに多くの時間を費やす前に、潜在的な問題を特定することができます。例えば、ナビゲーションバーにリンクが多すぎることに気付くかもしれません。その場合は、タイトルを短くするか、サブメニューページを作成してください。

サイトに新しいページを追加するには、サイトオーガナイザーの下にあるプラス記号（+）ボタンをクリックするか、「ファイル」→「新しいページ」を選択します。サイトオーガナイザーに表示されるページの順序によって、Webページ上部のナビゲーションリンクの順序が決まります。リンクの順序を調整するには、サイトオーガナイザーでページをクリックし、ページ階層内の新しい位置にドラッグするだけです。

ページを好みに合わせてデザインし、カスタマイズしたレイアウトを別のページに繰り返し使用したい場合は、サイトオーガナイザでページを選択し、Command キーを押しながら D キーを押して複製することができます。

ページを 非表示にする履歴書をオンラインで公開したいけれど、上司に見られたくないという場合は、サイトオーガナイザでページを選択し、インスペクタパネルの「ページ」セクションを開いて、「ナビゲーションメニューにページを含める」オプションの選択を解除してください。iWeb ではページは公開されますが、ナビゲーションメニューには表示されません。.Mac で公開する場合は、セキュリティ強化のためにページにパスワードを設定できます。

ステップ3: ページにテキストを追加する

ページの準備ができたら、カスタマイズを始める準備は完了です。iWeb のページテンプレートには、プレースホルダテキストのブロックが含まれています。このテキストを独自のテキストに置き換えるには、テキストエリアをクリックして入力を開始するだけです（Microsoft Word 文書や他のテキストエディタからテキストをコピー＆ペーストすることもできます）。

新しいテキストブロックを追加するには、iWebウィンドウの下部にある「テキスト」ボタンをクリックします。ページ中央に空のテキストボックスが表示されます。ボックスを別の場所に移動するには、ボックスをクリックして新しい場所までドラッグします。サイズや形状を変更するには、選択ハンドル（ボックスの縁にある白い四角形）のいずれかを目的の位置までドラッグします。

テキストスタイルのカスタマイズ テキストの書式や色を変更するには、インスペクタパネルを開き、「テキスト」タブをクリックします。別のフォントスタイルやサイズを選択するには、iWebウィンドウの下部にある「フォント」アイコンをクリックします。

テキストブロックに好みのスタイルを設定するには、少し時間がかかります。幸いなことに、一度理想のスタイルを見つけたら、そのスタイルをサイト上の他のテキストに簡単に適用できます。テキストブロックを選択し、「書式」→「グラフィックスタイルのコピー」を選択するだけです（このオプションはスタイルをコピーしますが、テキスト自体はコピーしません）。次に、別のテキストボックスを選択し、「書式」→「グラフィックスタイルの貼り付け」を選択します。

スペルチェック ：サイトへのテキストの追加が終わったら、少し時間を取って作業内容を確認しましょう。「編集」→「スペル」→「スペル」と進み、スペルミスがないか確認しましょう。iWeb が正しいスペルの単語を認識しない場合は、エラーとして表示されます。その場合は、「学習」ボタンをクリックして、その単語を iWeb の辞書に追加してください。次回同じ単語が出てきたときに、iWeb はそれを認識して、次の単語に進みます。

ステップ4: 写真を追加する

iWebのテンプレートには、仮のテキストに加えて、プレースホルダー画像も用意されており、ご自身で作成した画像に置き換えることができます。ただし、これらのプレースホルダー画像に限定されるわけではありません。ページ上の好きな場所に画像を配置できます。

写真のインポート iWebの写真は、メディアブラウザの写真パネル（表示：メディアブラウザを表示）からアクセスできます。ブラウザには、iPhotoライブラリ全体と、作成したアルバムが表示されます。また、Finderからメディアブラウザの写真セクションにフォルダをドラッグすることで、iPhoto以外のフォルダに保存されている写真を追加することもできます。

ページに画像を追加するには、ブラウザから適切な場所にドラッグします。既存の画像の上に画像をドラッグすると、iWeb は古い画像を新しい画像に置き換えます。Finder ウィンドウから写真を直接 iWeb にドラッグすることもできます。

画像のサイズを 変更するには、画像を選択し、白い選択ハンドルのいずれかをドラッグして希望のサイズに変更します。デフォルトでは、iWeb は画像の縦横比を維持します。より正確なサイズに変更するには、インスペクタパネルを開き、「メトリック」タブをクリックして「幅」または「高さ」の設定を調整してください。ただし、画像のサイズが大きいほど、Web ブラウザでのダウンロードに時間がかかることに注意してください。

カスタマイズ iWebページに画像を追加するには、メディアブラウザ（A）からドラッグします。写真にエフェクトを追加するには、インスペクタパネルのグラフィックタブ（B）を使用します。写真ページで作業している場合は、スタイルメニュー（D）で選択することで、新しいフォトフレーム（C）を選択できます。（画像をクリックするとスクリーンショットが開きます）

回転： Commandキーを押しながら画像の角をドラッグして配置すると（または「メトリクス」タブの回転ダイヤルを使用すると）、画像を傾けることができます。45度ずつ素早く回転させるには、CommandキーとShiftキーを押しながら角をドラッグします。

マスクの注意点： 写真全体を表示したくない場合は、iWebで画像マスクを作成して切り抜くことができます。写真をクリックし、「フォーマット」→「マスク」と選択し、端のハンドルを調整して不要な部分を除外します。

ただし、この機能を頻繁に使用することはお勧めしません。iWeb は画像ファイル全体をアップロードしますが、ページに表示されるのはほんの一部だけです。そのため、Web ブラウザに画像が表示されるまでにはかなりの時間がかかることがあります。画像の一部だけを使いたい場合は、iWeb に配置する前に iPhoto などの画像エディタでトリミングすることをお勧めします。

テンプレート画像を自分の画像に置き換えても画像の一部しか表示されない場合は、マスクに問題がある可能性があります。フレーム内で新しい画像の位置を変更するには、画像を選択し、「フォーマット」→「マスク解除」を選択します。その後、新しいマスクを作成するか、画像のサイズを変更してスペースに収まるようにします。

その他のエフェクトを追加する インスペクタパネルの「グラフィック」タブでは、画像の不透明度を変更したり、ドロップシャドウを追加したり、反射を作成したりすることもできます。ただし、これらの機能を使用すると、画像のファイルサイズ（とダウンロード時間）が増加します。これは、iWebがこれらの画像をPNGファイルとして公開するためです。PNGファイルはJPEGファイルよりもはるかにサイズが大きい傾向があります。ダウンロード時間を短縮するには、これらのエフェクトを控えめに使用してください。

ステップ5：映画とポッドキャストをインポートする

Webページにビデオファイルを追加するには、メディアブラウザを開き、「ムービー」タブをクリックします。ハードドライブ上の別の場所にムービーを保存している場合は、そのフォルダをメディアブラウザパネルにドラッグしてリストに追加します。ムービーファイルをインポートしたら、写真と同じようにサイズを変更できます。ビデオファイルをWeb用に最適化していない場合は、iMovie HDでムービーを開き、「共有：iWeb」を選択します。iMovieによってビデオが圧縮され、新しいムービーページに配置されます。

GarageBand で作成したポッドキャストの場合は、GarageBand でポッドキャストを開き、「共有：iWeb」を選択して、サイトに既に設定してあるブログまたはポッドキャストページにインポートします。

.Mac に公開する場合は、ブログページとポッドキャストページにコメント機能を追加できます。サイトオーガナイザーでブログまたはポッドキャストのメインページを選択し、インスペクタペインの「RSS」タブを開いて、「コメントを許可」オプションを有効にしてください。

残念ながら、iWeb は .Mac 以外で公開されているサイトへのコメント機能をサポートしていません。しかし、iComment を使えばこの機能を追加できます。

接続の構築 リンクインスペクタを使用して、フレーズまたは画像をハイパーリンクに変換します。

ステップ6: リンクを作成する

ここまでで、ウェブサイトのコンテンツの大部分は完成しているはずです。個々のページへのリンク設定については、iWeb が面倒な作業は一切不要です。もちろん、特定のページをナビゲーションメニューから除外することを選択した場合を除きます。ただし、ページを外部にリンクしたい場合は、独自にリンクを追加する必要があります。

iWebでは、画像、単語、その他Webページ上のあらゆる要素にリンクを追加できます。リンクを追加するには、テキストまたはページ項目を選択し、インスペクタパネルの「リンク」セクションを開きます。「ハイパーリンクとして有効にする」の横にあるチェックボックスをクリックし、「リンク」ポップアップメニューで必要なリンクの種類を選択します（「接続の構築」を参照）。以下の4つのオプションがあります。

マイページ このオプションを使用すると、iWeb サイト内の別のページにリンクできます。メインナビゲーションバーに表示されないページにリンクしたい場合に便利です。

外部ページ このオプションでは、別のウェブサイトのURLを入力できます。残念ながら、これらのリンクをクリックすると、そのページは新しいウィンドウやタブではなく、現在のブラウザウィンドウに読み込まれます。もし時間に余裕があり、HTMLに精通しているなら、iWebが生成した完成したHTMLファイルを開き、以下のテキストを追加することで、この見落としを修正できます。

ターゲット="_blank"

URLの後に

<a href>

タグ。例:

<a href="http://www.example.com" ターゲット="_blank">

ファイル このオプションを使用すると、他のユーザーがクリックしてPDFやMicrosoft Word文書などの選択したファイルをダウンロードできるリンクを作成できます。ダウンロードされたファイルは、他のページや画像とともにiWebサイトにアップロードされます。

電子メールメッセージ このオプションを選択すると、誰かがあなたに電子メールメッセージを送信できるリンクが作成されます。電子メールアドレスとメッセージの件名を指定できます。その後、お使いの電子メールアプリケーションで、その件名の受信メッセージを検索し、特定のフォルダに振り分けるルールを設定できます。ただし、Webサイトに電子メールアドレスを公開すると、スパムメールの送信元となる可能性があるので注意してください。

ヒント: Safari で URL を開いている場合は、Safari のアドレスフィールドから iWeb ページに URL をドラッグするだけで時間を節約できます。iWeb は Web ページの名前をテキストとして追加し、適切なリンクを挿入します。

ステップ7: サイトをテストする

サイトを.Macアカウントや他のサーバーにアップロードする前に、すべてのリンクが正しく機能し、Webブラウザで正常に表示されることを確認してください。iWebには公開前にサイトをテストするオプションはありませんが、この問題を回避する方法があります。ファイルをハードドライブ上のローカルフォルダに公開する方法です。

iWebで、「ファイル」→「フォルダに公開」を選択します。表示されるダイアログボックスで「新規フォルダ」ボタンをクリックし、フォルダ名を入力して「選択」をクリックします。iWebはSitesフォルダ内にフォルダを作成し、完成したWebサイトのファイルをその中に配置します。完了すると、新しいWebサイトにアクセスするためのオプションを示すダイアログボックスが表示されます。「今すぐサイトにアクセス」ボタンをクリックすると、SafariでWebページが開きます。Webサイト内を移動し、壊れたリンクがないか確認します。問題がなければ、公開の準備完了です。問題がある場合は、iWebで修正してから続行してください。Webサイトに満足したら、このテストサイトをゴミ箱にドラッグして、ハードドライブの空き容量を増やしてください。

ステップ8: サイトを公開する

iWeb では、サイトを公開する方法として、.Mac (年間 99 ドルのメンバーシップが必要) またはフォルダーへの公開の 2 つのオプションがあります。フォルダーは、選択した Web サーバーにアップロードできます。

.Mac へ iWeb サイトを .Mac に公開するには、iWeb ウィンドウの左下隅にある [公開] ボタンをクリックするか、[ファイル] > [.Mac に公開] を選択します。

フォルダへ .Mac アカウントをお持ちでなくても、iWeb を使ってサイトを作成できます。必要なのは、ファイルをアップロードできる Web サーバだけです。多くのインターネットサービスプロバイダ (ISP)（Comcast など）は、サービス契約の一部として Web スペースを提供しています（利用可能な Web スペースの量とファイルのアップロード先については、ISP にお問い合わせください）。サイトを公開するには、「ファイル」メニューの「フォルダへ公開」を選択します。iWeb が完了したら、そのフォルダを Web サーバ上の適切なディレクトリにアップロードします。ほとんどの場合、ISP のネットワークサーバをデスクトップにマウントし、Web フォルダを ISP の Web スペースにドラッグするだけで済みます。

サイトの更新サイトを 公開すると、iWeb のサイトオーガナイザのページアイコンが赤から青に変わります。これは、iWeb がこれらのページを Web に公開したことを示すものです。公開後に新しいページを追加したり、ページを編集したりすると、それらのページは赤で表示されます。これは、サイトを更新・メンテナンスする際に、どのページが変更され、再度公開する必要があるかを簡単に確認できる方法です。

進行中の作業

新しいウェブサイトを立ち上げて運用するには、映画やポッドキャストの規模にもよりますが、1～2日で完了するはずです。しかし、満足しすぎて安住してはいけません。訪問者の関心を維持するために、定期的に新しいコンテンツでサイトを更新する必要があります。基本的な構造が構築されれば、ブログ、新しい写真、その他のページを追加するのは簡単です。

[ チャック・トポレクは、O'Reilly Mediaのシニアエディターであり、『Mac OS X Tiger Pocket Guide』（O'Reilly Media、2005年）および『Inside .Mac』（O'Reilly Media、2004年）の著者です 。写真はピーター・ベランジャーによるものです。]

Deals