メディアオブジェクトの追加

最終更新日 : 2021年4月27日

Dreamweaver Web ページでのメディアオブジェクトの挿入と編集、デザインノートの使用などを行う方法について説明します。

Dreamweaver ドキュメントには、SWF ファイルや FLV ファイルだけでなく、その他のオーディオオブジェクトやビデオオブジェクトを追加することもできます。 メディアオブジェクトのアクセシビリティ属性を挿入してあれば、HTML コードでアクセシビリティ属性の設定と属性値の編集を行うことができます。

オブジェクトを挿入したい位置のドキュメントウィンドウに挿入ポイントを置きます。
オブジェクトを挿入するには、以下のいずれかの操作を行います。
  • 挿入パネルの「HTML」カテゴリー内で、挿入するオブジェクトタイプのアイコンを選択します。

  • 挿入/HTML サブメニューから、適切なオブジェクトを選択します。

  • ソースファイルの選択と当該メディアオブジェクトに対するパラメーターの指定を行うダイアログボックスが表示されます。

メモ

このダイアログボックスを表示しないようにするには、編集/環境設定/一般(Windows)または Dreamweaver/環境設定/一般(Mac OS)を選択して、「オブジェクト挿入中にダイアログを表示」オプションをオフにします。 ダイアログボックスの表示に関して設定されているあらゆる環境設定を無効にするには、Ctrl キー(Windows)または Option キー(Mac OS)を押しながらオブジェクトを挿入します。 

ファイルの選択ダイアログボックスの入力を完了させ、「OK」をクリックします。
メモ

編集/環境設定ダイアログボックスで、メディア挿入時に属性を表示するように 設定している場合、アクセシビリティ属性ダイアログボックスが表示されます。

アクセシビリティ属性を 設定します。
メモ

オブジェクトを選択してコードビューでHTMLコードを編集するか、 右クリック(Windows)または Control キーを押しながらクリック(Macintosh)して 「タグコードを編集」を選択することで、メディアオブジェクトの属性を編集することもできます。

タイトル

メディア オブジェクトのタイトルを入力します。

アクセスキー

ブラウザーでフォームオブジェクトを選択するためのキーボード 相当(1 文字)をテキストボックスに入力します。これにより、サイトの訪問者は Control キー(Windows)と アクセスキーを使用してオブジェクトにアクセスできます。例えば、アクセスキーとして B を入力した場合、ブラウザーで Control+B を使用してオブジェクトを選択します。

タブインデックス

フォームオブジェクトのタブ順序の番号を入力します。 タブオーダーの設定は、ページに他のリンクやフォームオブジェクトがあり、 ユーザーが特定の順序でタブ移動する必要がある場合に便利です。1 つのオブジェクトにタブオーダーを設定した場合は、 すべてのオブジェクトにタブオーダーを設定してください。

「OK」をクリックしてメディアオブジェクトを挿入します。
メモ

「キャンセル」をクリックすると、ドキュメントにメディアオブジェクトの プレースホルダーが表示されますが、Dreamweaver では アクセシビリティタグや属性は関連付けられません。

ソースファイルを指定するか、寸法やその他のパラメーターと属性を設定するには、各オブジェクトのプロパティインスペクターを使用します。オブジェクトのアクセシビリティ属性を 編集できます。

メディアファイルの外部エディターを開始する

Dreamweaver から外部エディターを起動して、 ほとんどのメディアファイルを編集できます。ファイルの編集用に Dreamweaver から起動するエディターを指定することもできます。

メディアファイルタイプがシステム上のエディターに 関連付けられていることを確認してください。

ファイルタイプに関連付けられているエディターを確認するには、Dreamweaver で編集/環境設定を選択し、カテゴリリストから「ファイルタイプ/エディター」を選択します。拡張子列のファイルの拡張子をクリックして、エディター列で関連付けられているエディターを表示します。ファイルタイプに関連付けられている エディターを変更できます。

ファイルパネルでメディアファイルをダブルクリックして、 外部エディターで開きます。

ファイルパネルでファイルをダブルクリックしたときに起動する エディターは、プライマリエディターと呼ばれます。例えば、画像ファイルをダブルクリックすると、Dreamweaver は Adobe Fireworks などのプライマリ外部画像エディターでファイルを開きます。

プライマリ外部エディターを使用してファイルを編集したくない場合は、システム上の別のエディターを使用して、次のいずれかの方法でファイルを編集できます:
  • ファイルパネルで、ファイル名を右クリック(Windows) または Control キーを押しながらクリック(Macintosh)し、コンテキストメニューからアプリケーションで開くを選択します。

  • デザインビューで、現在のページ内のメディア要素を右クリック(Windows)または Control キーを押しながら クリック(Macintosh)し、コンテキストメニューから 「アプリケーションで編集」を選択します。

Dreamweaver から起動する エディターを指定する

Dreamweaver でファイルタイプの編集に使用するエディターを指定し、Dreamweaver が認識するファイルタイプを追加または削除できます。

指定したファイルタイプに対して起動する外部エディターを明示的に指定します

編集/環境設定を選択し、カテゴリリストから「ファイルタイプ/エディター」を選択します。

.gif、.wav、.mpg などのファイル名拡張子が、左側の「拡張子」の下に表示されます。選択した拡張子に関連付けられたエディターが、右側の「エディター」の下に表示されます。

拡張子リストでファイルタイプ拡張子を選択し、次のいずれかの操作を行います:
  • 新しいエディターをファイルタイプに関連付けるには、エディターリストの上にあるプラス(+)ボタンをクリックし、表示されるダイアログボックスに入力します。

    例えば、Acrobatのアプリケーションアイコンを選択してファイルタイプに関連付けます。

  • エディターをファイルタイプのプライマリエディター(つまり、ファイルパネルでファイルタイプをダブルクリックしたときに開くエディター)にするには、エディターリストでエディターを選択し、「プライマリに設定」をクリックします。

  • エディターとファイルタイプの関連付けを解除するには、エディターリストでエディターを選択し、エディターリストの上にあるマイナス(-)ボタンをクリックします。

新しいファイルタイプと対応エディターを追加

拡張子リストの上にあるプラス(+)ボタンをクリックし、ファイルタイプ拡張子(拡張子の前のピリオドを含む)を入力するか、スペースで区切られた関連する複数の拡張子を入力します。

例えば、システムにインストールされたXMLエディターに関連付けたい場合は、.xml .xslと入力します。

エディターリストの上にあるプラス(+)ボタンをクリックし、表示されるダイアログボックスに入力して、ファイルタイプのエディターを選択します。

ファイルタイプの削除

拡張子リストでファイルタイプを選択し、拡張子リストの上にあるマイナス(-)ボタンをクリックします。
メモ

ファイルタイプを削除した後は元に戻すことができないため、本当に削除してよいか確認してください。

メディアオブジェクトでのデザインノートの使用

Dreamweaver の他のオブジェクトと同様に、メディアオブジェクトにもデザインノートを追加できます。デザインノートは特定のファイルに関連付けられるノートで、別のファイルに保存されます。デザインノートを使用して、Image Source ファイル名やファイルステータスのコメントなど、ドキュメントに関連付けられた追加ファイル情報を管理できます。

ドキュメントウィンドウでオブジェクトを右クリック(Windows)または Control キーを押しながらクリック(Macintosh)します。
メモ

オブジェクトにデザインノートを追加する前に、サイトを定義する必要があります。

コンテキストメニューから「ページのデザインノート」を選択します。
デザインノートに、必要な情報を入力します。
メモ

ファイルパネルからメディアオブジェクトにデザインノートを追加することもできます。ファイルを選択し、コンテキストメニューを表示して、コンテキストメニューから「デザインノート」を選択します。

FLV 以外のビデオの追加

web ページにビデオを追加するには、さまざまな方法とフォーマットを使用できます。ビデオはユーザーにダウンロードできるほか、ダウンロード中に再生されるようにストリーミング配信することもできます。

サイトフォルダーにクリップを置きます。

このようなクリップは通常、AVI または MPEG ファイル形式で作成されています。

クリップへのリンクを作成するか、ページにクリップを埋め込みます。

クリップにリンクするには、「クリップをダウンロード」などのリンクテキストを入力し、そのテキストを選択してから、プロパティインスペクターのフォルダーアイコンをクリックします。ビデオファイルを選択します。

メモ

ユーザーは、Real Media、QuickTime、Windows Media などの一般的なストリーミング形式を表示するために、ヘルパーアプリケーション(プラグイン)をダウンロードする必要があります。

プラグインコンテンツの挿入

ブラウザープラグイン用の QuickTime ムービーなどのコンテンツを作成し、Dreamweaver を使用してそのコンテンツを HTML ドキュメントに挿入できます。一般的なプラグインには RealPlayer や QuickTime があり、コンテンツファイルには mp3 や QuickTime ムービーなどがあります。

ブラウザープラグインに依存するムービーやアニメーションを、ドキュメントウィンドウのデザインビューで直接プレビューできます。すべてのプラグイン要素を一度に再生してユーザーにページがどのように表示されるかを確認したり、各要素を個別に再生して正しいメディア要素が埋め込まれていることを確認したりできます。

メモ

ActiveX コントロールに依存するムービーやアニメーションはプレビューできません。

プラグイン用のコンテンツを挿入した後、プロパティインスペクターを使用してそのコンテンツのパラメーターを設定します。プロパティインスペクターで以下のプロパティを表示するには、プラグインオブジェクトを選択します。

プロパティインスペクターには、最初に最もよく使われるプロパティが表示されます。右下角の展開矢印をクリックすると、すべてのプロパティが表示されます。

プラグインコンテンツを挿入してプロパティを設定する

ドキュメントウィンドウのデザインビューで、コンテンツを挿入する場所に挿入ポイントを配置し、次のいずれかの操作を行います:
  • 挿入パネルの共通カテゴリで、メディアボタンをクリックし、メニューからプラグインアイコン を選択します。

  • 「挿入」>「メディア」>「プラグイン」を選択します。

表示されるダイアログボックスで、プラグイン用のコンテンツファイルを選択し、「OK」をクリックします。
プロパティインスペクター内のプラグインオプションを設定します。

名前

スクリプト処理に使用するプラグインを識別する名前を指定します。 プロパティインスペクターの左端にあるラベルのないテキストボックスに名前を入力します。

幅および高さ

ページ上でオブジェクトに配分される幅と高さをピクセル単位で指定します。

ソース

ソースデータファイルを指定します。 フォルダーアイコンをクリックしてファイルを参照するか、ファイル名を入力します。

プラグイン URL

pluginspace 属性の URL を指定します。 ユーザーがプラグインをダウンロードできるサイトの完全な URL を入力します。ページを表示するユーザーがプラグインを持っていない場合、ブラウザーはこの URL からダウンロードしようとします。

行揃え

ページ上のオブジェクトの整列方法を指定します。

縦間隔と横間隔

プラグインの上、下、および両側の空白スペースの量をピクセル単位で指定します。

ボーダー

プラグインの周囲にある境界線の幅を指定します。

パラメーター

プラグインに渡す追加のパラメーターを入力するダイアログボックスを開きます。多くのプラグインは、特別なパラメーターに対応します。

属性ボタンをクリックして、選択したプラグインに割り当てられた属性を表示することもできます。このダイアログでは、幅や高さなどの属性を編集、追加、削除することができます。

ドキュメントウィンドウでプラグインコンテンツを再生

前のセクションで説明した方法のいずれかを使用して、1つまたは複数のメディア要素を挿入します。
次のいずれかの操作を実行します。
  • 挿入したメディア要素の 1 つを選択し、表示/プラグイン/再生を選択するか、プロパティインスペクターの「再生」ボタンをクリックします。

  • 表示/プラグイン/すべて再生を選択すると、選択したページにある、プラグインで実行するメディア要素をすべて再生できます。

メモ

「すべて再生」は、現在のドキュメントだけに適用されます。例えば、フレームセットの他のドキュメントには適用されません。

プラグインコンテンツの再生の停止

メディア要素を選択し、表示 > プラグイン > 停止を選択するか、プロパティインスペクタの停止ボタンをクリックします。

表示 > プラグイン > すべて停止を選択して、すべてのプラグインコンテンツの再生を停止することもできます。

プラグインのトラブルシューティング

ドキュメントウィンドウでプラグインコンテンツを再生する手順に従ったが、一部のプラグインコンテンツが再生されない場合は、次の方法を試してください:

  • 関連するプラグインがコンピュータにインストールされていること、およびコンテンツがお使いのプラグインのバージョンと互換性があることを確認してください。

  • テキストエディタでファイルConfiguration/Plugins/UnsupportedPlugins.txtを開き、問題のあるプラグインがリストに記載されているかどうかを確認します。このファイルには、Dreamweaver で不具合が発生するためにサポートされていないプラグインが記録されています。 (特定のプラグインで問題が発生する場合は、このファイルに追加することを検討してください。)

  • 十分なメモリ容量があることを確認します。 一部のプラグインでは、実行するために追加で2〜5MBのメモリが必要です。

ビヘイビアーを使用したメディアの制御

ページにビヘイビアを追加して、さまざまなメディアオブジェクトを開始および停止できます。

Shockwave および Flash のコントロール

ShockwaveムービーまたはSWFファイルの再生、停止、巻き戻し、またはフレームに移動します。

サウンドの再生

サウンドを再生できます。たとえば、ユーザーがマウスポインタをリンクの上に移動したときにサウンド効果を再生できます。

プラグインのチェック

サイトの訪問者が必要なプラグインをインストールしているかどうかを確認し、適切なプラグインを持っているかどうかに応じて、異なるURLにルーティングできます。これはプラグインにのみ適用されます。プラグインチェックビヘイビアはActiveXコントロールをチェックしません。

パラメータを使用してメディアオブジェクトを制御する

SWF ファイルやプラグインを制御するための特別なパラメーターを定義できます。 パラメーターは、objectembedapplet の各タグと組み合わせて使用します。 パラメーターによって、オブジェクトの様々なタイプ固有の属性が設定されます。 例えば、SWF ファイルの場合、object タグに対して quality パラメーター <paramname="quality"value="best"> を使用できます。 パラメーターダイアログボックスは、プロパティインスペクターからアクセスできます。 使用するオブジェクトに必要なパラメーターについて詳しくは、そのオブジェクトのマニュアルを参照してください。

メモ

ActiveXコントロール用のデータファイルを識別する広く受け入れられた標準はありません。使用しているActiveXコントロールのドキュメントを参照して、使用するパラメータを確認してください。

パラメーターの名前および値を入力します。

ドキュメントウィンドウで、パラメーターを含めることのできるオブジェクトを選択します。

プロパティインスペクターが開いていない場合は開いて、プロパティインスペクターの下半分に表示されている「パラメーター」ボタンをクリックします。 ただし、プロパティインスペクターが展開されていることを確認してから実行します。

プラス(+)ボタンをクリックし、適切な列にパラメータ名と値を入力します。

パラメーターの削除

パラメータを選択し、マイナス(–)ボタンを押します。

パラメーターの並び替え

パラメータを選択し、上下の矢印ボタンを使用します。