SMIL他

平成28年秋季　問23．　論理演算

問題文「動画や音声などのマルチメディアコンテンツのレイアウトや再生のタイミングをXMLフォーマットで記述するためのW3C勧告はどれか。」

解答群
ア．　Ajax
イ．　CSS
ウ．　SMIL
エ．　SVG

いきなり「なんじゃこりゃっ( ﾟДﾟ)」という問題である。かろうじてわかる用語としては「XML」と「CSS」ぐらいである。

-W3C勧告-

まずは「W3C勧告」とは何か？について調べてみた。

LIG inc.さんの「HTML5がW3Cの勧告になるとは？Web技術の標準規格について」は「W3C」と「勧告」の意味を分かりやすくまとめてくれている。

「W3C」とは「World Wide Web Consortium」の略で、JISやISOのWeb技術版と書いても問題なさそうである。

「勧告」とは何か？というと複数段階の改訂を経て、最終的な文書（これ以上修正が必要ないほど練り上げられたという意味で）が作成された、ということらしい。

-SMIL-

で、チート臭いが答えのSMILを見てみよう。

まずはおなじみ@ITさんのXML用語辞典「SMIL(Synchronized Multimedia Integration Language)」より、

***********************************
SMILは、XMLによって作られたマルチメディア記述用の言語である。時間に関するコントロールやスクリーン上のプレゼンテーションのレイアウトなどを行うことを目的としたものである
***********************************

俺ぐらいHTMLを少しかじっただけの人でも、このページにあるサンプルコードを見るとなんとなくどういうことかがわかると思うので数多い用語解説から選ばせてもらった。

俺の環境にはReal Playerを入れていないので実行してみることはできなかったが、5秒間のDurationで画像を切り替えていくということをしているらしいことがわかる（ソースを書くとページがわやになりそうだったので見たい人は上のリンクから見てもらいたい）。

SMILについて、どのように実装していくかについてはReal networksさんの「第6章SMILハイパーリンク」を参照すると良いと思う。

ななめ読みするだけでどんなことができるかがわかるように思う。

ちなみにこの「SMIL」、「スマイル」と読むらしい。　笑ってんじゃねえっ(#ﾟДﾟ)ｺﾞﾙｧ!!

-Ajax-

ではAjaxはなんだろう？　以前聞いたことがあるように思うのだがITの用語は略しすぎていて覚えられない。

いつもお世話になっている＠ITさんの「いまさら聞けない、”Ajax"とは何なのか？」がグーグル先生のトップに来た。とても分かりやすくどんな内容なのかを説明してくれている。ここを読めば完璧だっ( ﾟДﾟ)

とは言え、それだけだと単なる紹介記事になってしまうので、簡単にまとめさせていただくと、

まず、Ajaxは「Asynchronous JavaScript + XML」、訳すと「非同期JavaScript＋XML」である。。。　ほとんど訳すところがなかったorz

Ajaxが一躍有名になったのは、今では本当になじみの深いGoogle Mapsの表示方法なのだそうだ。Google Mapsで地図を見る時、マウスのスクロールホイールで縮尺したりドラッグすることで移動でき、現在見えているところから詳細を見たり、そのまま横に移動できたりする。

ここで行われている処理が「非同期：Asynchronous」だということだ。必要な部分の情報だけをServerからもらって表示し、且つ表示しながらもさらに先に進むことができるのが、必ずしも情報を常に同期していなくてもできる技術、というのがそれを指しているらしい。

で、Ajaxは何なのか？と言うと、実際にはインストールして使ったりするものではなく、JavaScriptとXMLの技術を使った単なる手法（単なるというのは語弊があるかもしれないが、提唱した本人もアプローチだと言っているようだ）ということである。

最終的にあっさりまとめると、Google Mapsのようにぐりぐり動かせるように見えるWebの技術はAjaxが使われているよ、と言えそうである。

次にCSSだが、これはHTMLを少しでもかじったことがある人ならすぐにわかるだろう。「Cascading Style Sheets」の略である。

ここは簡単にサイトを紹介させてもらうと
udemyメディアさんの「CSSとは？これを読めば初心者でも必ずCSSが書ける！」では、実際にHTMLとCSSをテキストエディタで書きながらどういうものかを説明してくれている。
ヨッセンスさんの「[初心者]CSSってなに？という質問にWEB歴10年の人が全力で答えてみる」では用語がわかりにくいと言う人用に簡単な用語とたとえ話で解説してくれている。

これもあっさりまとめてしまうと、いちいちHTMLのタグ（要素）ごとに色やフォントを書き込んでいるとどこで何を使っていたかわからなくなるので、ひとまとめにタグの表示方法を書いてしまう方法である。

-SVG-

最後に「SVG」だが、これは久しぶりにWikipediaで解説してくれた人がとても良くまとめてくれている。

Wikipedia「Scalable Vector Graphics」

間違えやすいのは、これもW3C勧告だということだ。ではSMILと何か違うか？というと、SVGは2次元画像の描画形式のことだ、ということだ。

これを理解するには同じくWikipediaの「ベクタ形式」を見る必要があるかもしれない。ビットマップと対比して画像を見せてくれているので、それを見るとビビッドに理解ができると思う。

ここであまり時間を割きたくないので、ここは上の解説で勘弁してもらえると有り難い。