このページの手順へのクイック リンク

 
 
 

イメージ マップを使用する

イメージ マップは Web の機能で、この機能により、イメージ内の特定の領域をクリックすることで別のロケーションにジャンプすることが可能になります。

イメージ マップには以下の 2 種類があります。

 
クライアント サイド イメージ マップは、イメージ マップ情報を HTML ドキュメント内に格納します。カーソルがマッピングされている領域上にくると、ブラウザ ウィンドウの下の方に URL 情報が表示されます。
 
サーバー サイド イメージ マップの機能は異なります。イメージ マップ情報は独立したファイルとして保存され、それをサーバーに置き、CGI スクリプトを使用するとアクセスできるようにします。カーソルがマッピングされている領域上にくると、URL 情報ではなく座標情報がブラウザ ウィンドウの下部に表示されます。

クライアント サイド イメージ マップの場合は、表示されているページの HTML 内にイメージ情報が含まれているため、その動作は速くより効果的です。サーバー サイド イメージ マップは、ブラウザと Web サーバー間で情報が行き来するため、時間を余分に要します。ただし、クライアント サイド イメージ マップは古いブラウザではサポートされません。

ホットスポットがクリックされ (左)、ブラウザがリンク情報のページにジャンプした状況 (右)

クライアント サイド イメージ マップ

クライアント サイド イメージ マップは、URL 情報と直接連動する「ホットスポット」を含むイメージです。ホットスポットがクリックされると、ブラウザはリンク情報が示しているページにジャンプします。

クライアント サイド イメージ マップは、円形または長方形の「ホットスポット」領域を認識します。そのため、Corel Painter では円形領域を円として、長方形領域を長方形として扱っています。楕円形領域は長方形としてエクスポートされます。

イメージ マップはレイヤーを使って作成されます。レイヤーのサイズはクリック可能な領域を決定します。レイヤーの使用について詳しくは、レイヤーを参照してください。

レイヤーのサイズはクリック可能な領域、またはホットスポットのサイズを決定します。

サーバー サイド イメージ マッピングは、円と楕円を別々のものとして扱います。サーバー サイド イメージ マッピングでは、楕円をエクスポートすることができます。サーバー サイド イメージ マッピングについて詳しくは、サーバー サイド イメージ マップを参照してください。

クライアント サイド イメージ マップを定義するには 上へ戻る
1
 
イメージ内でリンクする正確な位置に、レイヤーまたはシェイプを選択するか、作成します。
レイヤーのマーキーが表示されていない場合は、[レイヤー] パネルの [レイヤーオプション] ボタン をクリックして、[レイヤーインジケータの表示] を選択します。
2
 
[レイヤーオプション] ボタン をクリックし、[レイヤー属性] を選択します。
3
 
[レイヤー属性] ダイアログ ボックスでレイヤーの名前を指定します。
4
 
[WWWクリッカブルマップ領域] チェック ボックスをオンにします。
5
 
[URL] ボックスで、イメージのこの部分に関連付ける
URL (http://www.corel.com など) を指定します。
6
 
[OK] をクリックしてイメージに戻ります。
7
 
レイヤーの選択を解除して、イメージ マップの次の領域を定義します。
イメージ マップで 2 つ以上の領域がオーバーラップしている場合は、最上層の領域が最優先されます。
8
 
イメージ マップを GIF または JPEG ファイル形式にエクスポートします。[GIF ファイル保存オプション] または [JPEG ファイル保存オプション] ダイアログ ボックスで [クライアントサイドマップ] チェック ボックスをオンにし、イメージ マップ定義を含む HTML ファイルを Corel Painter がエクスポートするように指定します。
RIFF 形式のイメージを GIF または JPEG に変換すると、そのイメージ データの一部が失われる点にご注意ください。ファイルを後で編集する場合は、RIFF 形式のコピーを保存してから、GIF または JPEG バージョンを作成してください。

クライアント サイド イメージ マップをエクスポートすると、Corel Painter がイメージと HTML ファイルの両方をエクスポートします。そのため、HTML ファイルをテキストとして、または HTML エディタ上で開き、コードを別の Web ページにコピーすることができます。

イメージ マップ用のデフォルトの URL を定義するには 上へ戻る
1
 
イメージ マップで定義されているホットスポット以外の部分をユーザーがクリックした際に使用されるデフォルトまたはベースの URL を定義するには、レイヤー、シェイプ、プラグインを選択していない状態で、[ファイル] [情報を見る] を選択します。
[ファイル情報] ダイアログ ボックスが表示されます。
2
 
[WWW マップのデフォルト URL] を選択します。
3
 
URL アドレスを入力します。
4
 
[OK] をクリックします。

デフォルトの URL を指定していない場合は、定義されたホットスポットの外側をクリックしても何も起こりません。

サーバー サイド イメージ マップ

Corel Painter では、1 枚のレイヤーをクリック可能な領域として定義することができます。Corel Painter は、このイメージ マップ情報を独立したテキスト ファイル内に保存し、それを Web サーバーにアップロードできます。その後 CGI スクリプトを使用してアクセスすることができます。

サーバー サイド イメージ マッピングは時代遅れになりつつあるので、ぜひこの前項目で、クライアント サイド イメージ マッピングのサポートについて参照してください。

サーバー サイド イメージ マップを作成するには 上へ戻る
1
 
イメージ内でリンクする正確な位置に、レイヤーまたはシェイプを選択するか、作成します。レイヤーの処理、および一般的なレイヤーの環境設定について詳しくは、レイヤーを参照してください。
2
 
[レイヤー] パネルの [レイヤー] リストからレイヤーを選択します。
3
 
[レイヤーオプション] ボタン をクリックし、[レイヤー属性] を選択します。
4
 
[レイヤー属性] ダイアログ ボックスでレイヤーの名前を指定します。
5
 
[WWWクリッカブルマップ領域] チェック ボックスをオンにします。
6
 
[URL] ボックスで、イメージのこの部分に関連付ける URL
(http://www.corel.com など) を指定します。
7
 
[OK] をクリックしてイメージに戻ります。
8
 
レイヤーの選択を解除した後、イメージ マップ内で次のホットスポットを選択します。1 枚のイメージ マップ内でホットスポット領域がオーバーラップしないように注意してください。
ユーザーが定義されているホットスポットの外側をクリックする際に使用する、デフォルトのベース URL を設定することができます。詳しくは、イメージ マップ用のデフォルトの URL を定義するにはを参照してください。
9
 
イメージ マップを GIF または JPEG ファイル形式にエクスポートします。[GIF ファイル保存オプション] または [JPEG ファイル保存オプション] ダイアログ ボックスで、ご利用のインターネット サービス プロバイダが推奨する形式に応じて、[NCSAマップ] または [CERNマップ] のいずれかのチェック ボックスをオンにします。
イメージを保存する際、Corel Painter はクリック可能領域および関連の URL を記述する追加のテキスト ファイルを自動的に作成します。
10
 
イメージ マッピングの CGI スクリプト/プログラム用のドキュメントの指示に沿って、ご利用の Web サーバー上に両方のファイル (イメージ ファイルおよび関連のイメージ マップ定義ファイル) を格納します。サーバー サイド イメージ マップが機能するには両方のファイルが必要です。
RIFF 形式のイメージを GIF または JPEG に変換すると、そのイメージ データの一部が失われる点にご注意ください。ファイルを後で編集する場合は、RIFF 形式のコピーを保存してから、GIF または JPEG バージョンを作成してください。

フィードバック
このページはお役に立ちましたか? フィードバックの送信 (インターネット接続が必要です)。

Copyright 2012 Corel Corporation. All rights reserved.