戻る 次へ

第 6 章 SMIL ハイパーリンク

この章では SMIL について紹介し、単一のクリップを再生してプレゼンテーション内のさまざまな時点で HTML ページを開く SMIL ファイルの記述方法を説明します。 これ以降の章では、SMIL を使ってクリップ シーケンスを再生したり、複数のクリップを同時に再生したりする方法を説明します。

詳細情報 : 付録 B もお読みください。SMIL 構文に関する重要な情報が記載されています。 付録 C には、このマニュアルで説明している SMIL の属性と値がまとめられています。

SMIL とは何か?

SMIL はスマイルと発音し、World Wide Web Consortium によって承認されたマークアップ言語です。World Wide Web Consortium は Web サイト http://www.w3c.org を運営しています。 SMIL を使うと、任意の数のメディア クリップを組み合わせることによって、簡単なものから非常に複雑なものまで、さまざまなメディア プレゼンテーションを作成できます。 SMIL では、Ram ファイルで設定できるほとんどすべての機能を同じように使用可能です。 さらに、プレゼンテーション再生中にさまざまな時点で HTML ページを開く高度な機能も用意されています。 SMIL プレゼンテーションは、どのオペレーティング システム用の RealPlayer でも再生可能です。

備考: RealOne Player と RealPlayer 10 は SMIL 1.0 と SMIL 2.0 の両方をサポートしています。 ただし、RealPlayer の HTML ペイン内で URL を自動的に開くことができるのは、SMIL 2.0 だけです。 旧バージョンの RealPlayer は SMIL 2.0 をサポートしていないため、この章で説明している SMIL オーサリング手法は RealOne Player と RealPlayer 10 でしか機能しません。

SMIL ファイルの記述

SMIL ファイルは Ram ファイルと同様に単純なテキスト ファイルであり、任意のテキスト エディタで作成できます。 Ram ファイルと同様、作成した内容は必ずプレーン テキストで保存してください。 SMIL ファイルには my_smilfile.smil のように、スペースを含まない簡単な名前と、拡張子 .smil を付ける必要があります。

SMIL ファイルの位置付け

SMIL ファイルを使用する場合、プレゼンテーションは次のように動作します。

  1. 標準的な <a href> ハイパーテキスト リンクと HTTP URL を使って、Web ページを Ram ファイルにリンクしておきます。

    2. 多くの場合、SMIL ファイルですべてのプレゼンテーション情報を指定し、Ram ファイルはプレゼンテーションの起動だけに使用します。 SMIL は Web 標準であるため、Ram ファイルは依然として必要です。.smil 拡張子は複数種類のメディア プレーヤーに関連付けられている可能性があります。 プレゼンテーションを RealPlayer 専用に制作したい場合、Ram ファイルの .ram 拡張子によって、すべての視聴者に対して確実に RealPlayer が起動されるようになります。

  2. Ram ファイルが、SMIL プレゼンテーションへの完全な URL を指定します。

    3. SMIL ファイルはクリップへの完全な URL を指定するため、このファイルは Web サーバや Helix Server 上に配置できます。 Ram ファイルと同じサーバ ディレクトリや、まったく別のサーバ上に配置することもできます。 Ram ファイル作成方法の詳細については、第 3 章を参照してください。

  3. SMIL ファイルが、ストリーミング クリップへの完全な URL を指定します。

    4. 一般にクリップは Helix Server 上に置かれ、RTSP プロトコルでストリーミングされます。 「クリップ ソース タグ」では、SMIL ファイルでクリップを要求する方法を説明しています。

SMIL ファイルの基礎

次の例は、ビデオを再生してプレゼンテーション情報を設定する簡単な SMIL ファイルです。 次のセクションで説明しているとおり、この SMIL サンプルの基本構造を理解すれば、SMIL の強力な機能を習得する準備は完了です。 

<smil xmlns="http://www.w3.org/2001/SMIL20/Language"
xmlns:rn="http://features.real.com/2001/SMIL20/Extensions">
  <head>
    <meta name="title" content="My First SMIL File"/>
    <meta name="author" content="Pat Morales"/>
    <meta name="copyright" content="(c)2001 Spectacular Media Limited"/>
  </head>
  <body>
    <video src="rtsp://helixserver.example.com/video1.rm"/>
  </body>
</smil>

SMIL ファイルの各セクション

SMIL ファイルは <smil> タグで始まり、</smil> タグで終わります。 開始タグには、ネームスペースと呼ばれる 2 つの xmlns 属性があります。 これらの属性は、ファイルが SMIL 2.0 であること、および RealNetworks カスタムを使用することを示します。 「SMIL タグ」のセクションでは、これらのネームスペースの詳細について説明しています。 <smil> タグにこれらのネームスペースが上記のように正確に記述されていることを確認してください。

開始タグと終了タグの間は、HTML ページと同様に大きく 2 つのセクションに分割されます。 オプション ヘッダー セクションは <head> および </head> タグの間に定義され、プレゼンテーション情報やレイアウトを指定します。レイアウトについては第 8 章で説明しています。 必須セクションであるボディ セクションは、<body> および </body> タグの間に定義され、プレゼンテーションで再生するクリップをすべて記述します。

プレゼンテーション情報

上の例のヘッダー セクションには <meta/> タグが 3 つあります。これらのタグは省略可能ですが、SMIL プレゼンテーションには常に使用することを強くお勧めします。 SMIL ファイルを作成するたびにこれらのタグをコピーし、content 属性の値を適切に変更してください。 

<head>
  <meta name="title" content="My First SMIL File"/>
  <meta name="author" content="Pat Morales"/>
  <meta name="copyright" content="(c)2001 Spectacular Media Limited"/>
</head>

<meta/> タグは、プレゼンテーションのタイトルや制作者名、著作権表示を指定します。 このタグは「メタ」タグと呼ばれます。これは、指定した情報がストリーミング クリップのメディア再生ペイン内には表示されず、RealPlayer の別の位置に表示されるからです。

プレゼンテーション情報

プレゼンテーション情報

クリップ ソース タグ

プレゼンテーション内の各メディア クリップには、クリップ ソース タグを記述します。 上記のサンプルにはソース タグが次のように 1 つあります。 

<video src="rtsp://helixserver.example.com/video1.rm"/>

各クリップ ソース タグには、RealPlayer にクリップの所在地を知らせる src 属性があります。 クリップ ソース タグには、後で説明するとおりクリップのタイミングやレイアウトなどを調整する他の属性も記述できます。 なお、上のクリップ ソース タグがスラッシュで終了していることに留意してください。 

<tag...attributes.../>

これは SMIL の重要な構文規則です。 タグ ペアの一部ではないタグの終了スラッシュを省略すると、エラーとなります。 次の表に、使用可能なクリップ ソース タグの一部を示します。

一般的なクリップ ソース タグ
クリップ タグ 使用目的
<audio/> RealAudio (.rm) などのオーディオ クリップ
<img/> JPEG (.jpg)、GIF (.gif)、または PNG 画像 (.png)
<ref/> Flash Player ファイル (.swf) など、その他のクリップ種別
<video/> RealVideo (.rm) などのビデオ クリップ

SMIL には他のクリップ ソース タグも含まれますが、どのタグを使用するかは実のところ無関係です。 RealPlayer は、クリップにビデオが収録されているかどうか <video/> タグだけで判定するわけではありません。 .rm などのファイル拡張子も判定に使用します。 もし拡張子が何らかの理由で間違っていたとしても、一般に RealPlayer はクリップ種別を判定し、正しく再生することができます。 したがって、すべてのクリップに <ref/> タグを使用するという方法もありますが、特定のメディアに適切なクリップ タグを使用すれば、SMIL ファイルの構造を保持するのに便利です。

クリップの URL

プレゼンテーション開発時には、クリップを SMIL プレゼンテーションと同じディレクトリに保存してください。 これによって、お使いのオペレーティング システムで表示されるクリップ名を、次のようにそのまま src 属性の値に使用することができます。 

<video src="video1.rm"/>

プレゼンテーションのストリーミング準備が完了した場合、次のようにストリーミング サーバ上のクリップ位置を指定する値へと src の値を変更し、クリップのストリーミング用プロトコルを指定する必要があります。 

<video src="rtsp://helixserver.example.com/video1.rm"/>

詳細情報 : ストリーミング プロトコルの詳細については、「使用する URL の選択」を参照してください。

他のディレクトリへの相対リンクの作成

RealPlayer には、Web ページに使用可能なリンクと同じローカルの相対リンクも使用できます。 この指定方法は、お使いのデスクトップ コンピュータ上でプレゼンテーションを開発する場合に便利です。 たとえば次の src 属性は、SMIL ファイルより 1 階層下の、audio フォルダ内のクリップを指定しています。 

<audio src="audio/song1.rm"/>

次の例は、SMIL ファイルより 1 階層上のフォルダ内のクリップを指定します。 

<audio src="../song1.rm"/>

次の例は、SMIL ファイルのフォルダと同じ階層の audio フォルダ内にあるクリップへのリンクを作成します。 

<audio src="../audio/song1.rm"/>

ヒント : 相対ディレクトリの指定方法は、HTML のリファレンス マニュアルに記載されています。

絶対リンクの作成

別の方法として、ローカルの絶対リンクによって、お使いのコンピュータ上の正確な位置を指定することもできます。 絶対リンクの指定方法は HTML と同じですが、 オペレーティング システムによって異なります。お使いのシステムのディレクトリ指定方法をよく理解しておいてください。 たとえば次の絶対リンク指定は Windows コンピュータに対して有効ですが、Unix や Macintosh では機能しません。 URL には次のように file:/// にスラッシュが 3 つ含まれ、パス名にもスラッシュを使用する点に留意してください。 

src="file:///c:/audio/first.rm"

HTML ページを SMIL で開く

次のクリップ ソース タグは、クリップ開始時にメディア ブラウザ ペイン内で HTML ページを開く方法を示します。 

<video src="rtsp://helixserver.example.com/video1.rm">
  <area href="http://www.example.com" external="true" alt="My Home Page" 
  actuate="onLoad" sourcePlaystate="play" rn:sendTo="_rpbrowser"/>
</video>

まず、このクリップ ソース タグとこれまでの例のクリップ ソース タグが異なっている点に留意してください。これまでの例のクリップ ソース タグは、次のようにすべてスラッシュで終了していました。 

<video.../>

今回の例のクリップ ソース タグはタグ ペアの一部であり、先頭のタグはスラッシュで終了しません。 

<video...>
  ...other markup...
</video>

これは SMIL の重要な規則です。 通常は単独タグとして使用されるタグを、タグ ペアに変えることができます。 これによって、他のタグを中に含めることができます。 この場合、クリップ ソース タグはハイパーリンクを作成する <area/> タグを中に含んでいます。 クリップ ソース タグには <area/> タグをいくつでも含めることができ、各クリップに複数のハイパーリンクを関連付けることが可能です。

<area/> タグの機能

<area/> タグは必ずクリップに関連付けられます。 <area/> タグがアクティブな間、視聴者はクリップをクリックしてリンク URL を開くことができます。 一般に、<area/> タグはクリップ再生開始直後にアクティブとなり、クリップが画面に表示されている間はアクティブのままとなります。 つまり、クリップが画面に表示されている間、視聴者はクリップをクリックして URL を開くことができます。 この動作には 2 種類の調整方法があります。

標準リンク属性の使用方法

HTML ページへの標準的な <area/> タグ ハイパーテキスト リンクには、次の表に示す属性が含まれます。

標準的な <area/> タグ属性
属性および値 目的
alt="テキスト" 説明文を指定します。 視聴者が画面のポインタをリンクの上に移動すると、RealPlayer のメディア再生ペイン上のステータス行に alt テキストが表示されます。
external="true" HTML ペインに URL を開きます この属性は HTML ページを開く場合に必要です。
href="URL" HTML ページへの完全修飾 HTTP URL を指定します。

自動的に HTML ページを開く

<area/> タグ内に actuate="onLoad" を記述すると、<area/> タグがアクティブとなった直後にリンク URL が開きます。 <area/> タグ内に SMIL のタイミング属性が 1 つも含まれていない場合、このタグは関連付けられたクリップの再生開始直後にアクティブとなります。 したがって actuate="onLoad" の場合、クリップの再生開始直後に HTML ページが自動的に開きます。 actuate="onLoad" を指定しなければ、HTML ページは視聴者がクリップをクリックした場合のみ開きます。

ヒント : actuate="onLoad" を使用したリンクは、その後もクリックできます。つまり、自動的に開いたページをもう一度開くことも可能です。 この動作を抑止したければ、<area/> タグ内でたとえば dur="1s" のように短いリンク時間を設定してください。

メディア再生状態のコントロール

デフォルトでは、ブラウザがリンクを開いている間 RealPlayer プレゼンテーションは一時停止します。 視聴者は、RealPlayer の [Play (再生)] ボタンでプレゼンテーションを再開できます。 また、プレゼンテーションを完全に停止させたり、リンクが開いている間も再生を続けたりすることもできます。このためには、sourcePlaystate 属性にそれぞれ stop または play という値を指定します。 たとえば <area/> タグ内で sourcePlaystate="play" を使うと、HTML ページが開いている間もメディアの再生を続けることができます。

HTML ペインの選択

次の表は、RealPlayer のどれか 1 つのペインに HTML URL を開く場合に使用可能な属性を示します。 external="true" 属性は常に必要です。 RealPlayer のペインを指定する属性には、RealNetworks カスタムであることを示す rn: 接頭辞を使用します。 これらの属性を使用するには、「RealNetworks 拡張ネームスペース」で説明している RealNetworks のネームスペースを宣言することが必要です。

RealPlayer で HTML リンクを開くための属性
属性 表示ペイン
external="true" 3 ペイン環境から分離したセカンダリ メディア ブラウザ ウィンドウ。
external="true"
rn:sendTo="_rpbrowser"		 メディア ブラウザ ペイン。
external="true"
rn:sendTo="_osdefaultbrowser"		 視聴者のデフォルト Web ブラウザ。
external="true"
rn:sendTo="_rpcontextwin"		 関連情報ペイン

HTML ページを関連情報ペインに開く

RealPlayer の関連情報ペインに HTML ページを開くには、<area/> リンク タグ内で次のように rn:sendTo="_rpcontextwin" を使用します。 

<video src="rtsp://helixserver.example.com/video1.rm">
  <area href="http://www.example.com/info.htm" external="true" alt="More Info"
  actuate="onLoad" sourcePlaystate="play" rn:sendTo="_rpcontextwin"/>
</video>

関連情報ペインの高さおよび幅は、<rn:param/> タグを使ってピクセル単位で設定できます。 このためには、次のように <area/> タグをタグ ペア (<area> および </area>) に変更し、ペア内に <rn:param/> を入れてください。 

<video src="rtsp://helixserver.example.com/video1.rm">
  <area href="http://www.example.com/info.htm" external="true" alt="Related Info"
  actuate="onLoad" sourcePlaystate="play" rn:sendTo="_rpcontextwin">
    <rn:param name="width" value="300"/>
    <rn:param name="height" value="240"/>
  </area>
</video>

今すぐ表示してください。 (サンプル クリップを表示するための要件)
このサンプルは、クリップ再生開始後に関連情報ウィンドウ内で HTML ページを表示します。

詳細情報 : 関連情報ペインの大きさに関する基本的な情報については、「関連情報ペインのサイズ変更」を参照してください。 「関連情報ペイン用のスペース作成」では、関連情報ペイン内に HTML ページがすぐに表示されなかった場合でもこのペイン内にプレゼンテーションを開く方法を説明しています。

ハイパーリンクの例

SMIL ハイパーテキスト リンク機能の基礎を習得すれば、SMIL のタイミング機能の一部を使って、クリップ再生中のさまざまな時点で HTML ページを開くことができます。 ただし Web ページを開くためには、視聴者の帯域幅をある程度消費することが必要です。 視聴者の使用可能な帯域幅をストリーミング メディアがすべて消費してしまうと、Web ページを開くことが困難となります。 場合によっては、ストリーミング メディアが消費する帯域幅を、「最大ストリーミング速度」の表に記載された最大帯域幅よりも少ない値にしておくことが必要なこともあります。

ヒント : プルダウン メニューから [Sample Files (サンプル ファイル)] を選択すると、このマニュアルに収録されている再生可能なサンプル ファイルをすべて表示できます。

プレゼンテーション再生中に複数の Web ページを開く

次のマークアップは一連の <area/> タグを使用し、ビデオ再生時に異なるタイミングで関連情報ペインに 3 つの HTML ページを開きます。 なお、関連情報ペインの幅および高さを設定するのは最初のリンク タグだけです。 このサイズの設定はプレゼンテーション再生中保持されるため、その後のリンクにはサイズ設定情報は必要ありません。 下記のリンクはすべて関連情報ペイン内に開かれますが、rn:sendTo="_rpbrowser" を指定した <area/> タグを追加してメディア ブラウザ ペイン内に HTML ページを開くこともできます。 

<video src="rtsp://helixserver.example.com/video1.rm">
  <!-- First hypertext link, with related info pane sizing information. -->
  <area href="http://www.example.com/info1.html" external="true" begin="10s"
  actuate="onLoad" sourcePlaystate="play" rn:sendTo="_rpcontextwin">
    <rn:param name="width" value="300"/>
    <rn:param name="height" value="240"/>
  </area>
  <!-- Second hypertext link. -->
  <area href="http://www.example.com/info2.html" external="true" begin="1min"
  actuate="onLoad" sourcePlaystate="play" rn:sendTo="_rpcontextwin"/>
  <!-- Third hypertext link. -->
  <area href="http://www.example.com/info3.html" external="true" begin="1.75min"
  actuate="onLoad" sourcePlaystate="play" rn:sendTo="_rpcontextwin"/>
</video>

SMIL の begin 属性には、タイミングのオフセット値を記述します。 上記の例では、1 番目のリンクは begin="10s" を使用して、ビデオの再生開始 10 秒後にリンクを起動します。 2 番目のリンクは begin="1min" を使用して、ビデオの再生開始 1 分後にリンクを起動します (begin の時間は前のリンクの時間に対する値ではなく、クリップに対する値です)。 すべてのリンクが actuate="onLoad" を使用しているため、begin の時刻に達すると、リンクされた HTML ページが自動的に開きます。

詳細情報 : begin 属性で使用可能なタイミング値については、「SMIL タイミング属性の使用」を参照してください。

今すぐ表示してください。 (サンプル クリップを表示するための要件)
このサンプルを再生すると、クリップ再生時に自動的に HTML ページが開きます。

マウス クリックでページを開く

HTML ページへのリンクは、自動的に開く必要がない場合もあります。 actuate="onLoad" を指定しない場合、リンクは視聴者がクリップをクリックした場合のみ開きます。 次の例では、ビデオ クリップがタイミング付きハイパーリンクを 4 つ定義しています。 begin および dur 属性によって、プレゼンテーションの異なる時点において各リンクを 1 分間アクティブにすることができます。 したがって、視聴者がビデオ クリップをいつクリックするかによって、異なるページが表示されます。 

<video src="rtsp://helixserver.example.com/video1.rm">
  <area href="http://www.example.com/page1.htm" begin="0s" dur="1min"
    external="true" rn:sendTo="_rpbrowser" sourcePlaystate="pause" 
    alt="Go to Page 1"/>
  <area href="http://www.example.com/page2.htm" begin="1min" dur="1min"
    external="true" rn:sendTo="_rpbrowser" sourcePlaystate="pause"
    alt="Go to Page 2"/>
  <area href="http://www.example.com/page3.htm" begin="2min" dur="1min" 
    external="true" rn:sendTo="_rpbrowser" sourcePlaystate="pause" 
    alt="Go to Page 3"/>
  <area href="http://www.example.com/page4.htm" begin="3min"
    external="true" rn:sendTo="_rpbrowser" sourcePlaystate="pause"
    alt="Go to Page 4"/>
</video>

詳細情報 : dur 属性の詳細については、「再生時間の指定」を参照してください。

今すぐ表示してください。 (サンプル クリップを表示するための要件)
このサンプルでは、異なるタイミングで異なる HTML ページにリンクされているクリップを再生できます。

高度なハイパーリンク機能の使用

『RealNetworks プロダクション ガイド』には、ハイパーリンク作成に関する詳細情報が記載されています。 プロダクション ガイドは http://service.jp.real.com/help/library/encoders.html からダウンロードできます。 下記の機能を実行する手順については、プロダクション ガイドのハイパーリンク関連の章を参照してください。

RealNetworks, Inc. ©2002, 2004 RealNetworks, Inc. All rights reserved.
詳細については、RealNetworks を参照してください。
画面左側に目次フレームが表示されない場合は、ここをクリックしてください。
戻る 次へ