iPhoneやAndroidのブラウザでHTMLベースで音を出すには？

@rkanbeです。

スマートフォン向けコンテンツをリリースするときに、アプリかHTMLかというのは悩みどころですよね。

アプリの場合は、高度な表現ができるかわりにかなりの開発スキルが必要で、各端末ごとの動作書くにが必要になります。

HTMLの場合は、表現力はそれほどでもないですが、ブラウザそのものの端末間の互換性はアプリに比べればわりと期待でき、うまくやればiPhoneとGoogle Chromeで同じコードベースを使いまわせるという期待がもてます。そんな環境下で、「コンテンツ上で音を出すには」ということを簡単に考えてみました。

Androdの場合は？

音を出すのは、Flashに対応したAndroidだったら大丈夫だと思います。

しかし必ずしもすべてのAndroid端末がFlashをプリインストールしているとも限りません。

HTML5の<audio>タグでなんとかできる部分はあるかもしれません。

ASCII.jp：HTML5 Audioで作るiTunes風音楽プレイヤー｜古籏一浩のJavaScriptラボ

http://ascii.jp/elem/000/000/525/525808/

ちなみに、Andoroidブラウザの中でも、HTML5のaudioタグはうまく動くもようです。

javascript - Playing html5 audio in android browser - Stack Overflow http://stackoverflow.com/questions/3069124/playing-html5-audio-in-android-browser

iPhoneの場合は？ついでにバイブレーションは？

iPhoneの場合も、まずはaudioタグを試してみましょう。

さらに追加情報として、iPhoneでは、PhoneGapというライブラリを使うとJavaScritp経由でバイブレーションが使えるようになるようです。

PhoneGap
http://www.phonegap.com/

PhoneGap で開発した iPhone アプリ AppTweets をリリースしました : 僕は発展途上技術者 http://blog.champierre.com/archives/899

「iPhoneアプリケーション開発ガイド」を読んだ - 元町ラジオ塔
http://d.hatena.ne.jp/motomachi24/20101022/p1

実は、PhoneGapはAndroidも対応しているもよう。

PhoneGap Demo Application | Android（アンドロイド）アプリおすすめサイト オクトバ http://octoba.net/archives/tag/phonegap-demo-application

このあたり、いろいろそろってきて面白いですね。

スマートフォンを使ってよりインタラクティブなコンテンツをつくることができそうです。

わくわくしますね！

PhoneGapに関する追記

ちょっと勘違いしていたみたいなので訂正しておきます。

HTML5/js/CSSでiPhone/Androidアプリが作れるPhoneGapのメモ
http://blog.browncat.org/2010/03/html5jscss-iphone-phonegap.html

によると、

「このPhoneGapはなかなか面白く、ちょうどMobileデバイス向けにMozilla PrismやAdobe
Airのような働きをします。要はデバイスに内蔵されているブラウザコンポーネントをベースにhtmlやcss,jsをひとまとめにしてネイティブアプリを作成するというもの。クロスプラットフォームでiPhone/Android/BlackBerryに対応。Palm, WinMobileやSymbian WRTにも対応するようです。 」

というものらしいです。ということは、ブラウザ上で直接は動作しないものみたいですね。

ブラウザ上ではどの程度音や映像、バイブレーションが使えるのか、改めて調べてみる必要がありそうです・・・

＿