HTML5を使うべき10の理由

プラグイン vs HTML5 それぞれの「適材適所」のエントリーの解説編です。続いてHTML5の判断材料です。同じく10項目挙げてみました。また文章ばかりです。

○スマートフォン向けである(特にiOSも対象)

iOSではPlug-inが排除されているのですから、何の余地もありません。またターゲットをAndroid等のスマートフォンに特化できるなら、HTML5が良いかと思います。Flash PlayerはAndroid OS2.2から対応していますが、パフォーマンスを出すには繊細にチューニングした開発が必要です。
ただし、注意が必要なのは、HTML5で画面を作ったからといって、PCでもスマートフォンでもOK!という訳にはいきません。タッチやジェスチャに対応した画面作りが必要で、AppleのUIデザインガイドラインに従わないと違和感のある画面となります。

○読む/見るコンテンツである

テキストを読む、画像を魅せる、といったコンテンツが中心であれば、あえてFlashじゃなくてもいいのでは無いでしょうか。その画面やコンテンツ間の遷移のエフェクトとしてCSS3のTransitionは、アニメーションとして強力な機能だと思います。

○既存HTML画面にアドオンする

これまでHTMLで作成されたWebアプリケーションで、使い勝手の向上のためにちょっとした機能(例えばドラッグ&ドロップ)を追加したり、フォームへの入力項目をWebStrageから呼び出したい、といった機能であれば、HTML5は非常に効果的だと考えます。

○HTMLを生成/編集する

表現が難しいのですが、Webアプリの目的がブログやCMSのようにHTML自体を編集するようなものであったり、ブラウザやDOM操作を行ったり、というような場合、HTMLコンテンツとの親和性の高さからプラグイン技術よりはHTMLベースで作った方がよいと考えられます。

○検索エンジンに最適化する必要がある

Google等のメジャーな検索エンジンではSWFの内容も解析しインデックス化されますが、やはり世界にはマイナーだったり、古い検索エンジンも存在し、何よりキャッシュされたコンテンツの表示にはFlashやSilverlightはほぼ対応していないのではないでしょうか。

○ブラウザの機能を利用する必要がある

ブラウザのテキスト検索はFlashやSilverlightで作られたコンテンツの内容までリーチできません。画像をブラウザ内からドラッグしてデスクトップに置く、といったこともFlash/Silverlightもできないですね。

○他のサービスにパースされる必要がある

HTMLページ全体を翻訳のためにドキュメント全体がパースされたり、セマンティックなサービスに解析される必要があったり…といった要件があれば、画面全てをHTMLベースで作成しておく必要があります。

○ベンダーのコントロールから逃れる

言うまでもなくFlashはAdobe Systemsの、Silverlightは、Microsoftの製品です。FlashやSilverlightのプラグインのアップデートは、我々のコントロールにありません。昨今は脆弱性対応等で細かなアップデートが多く、そのアップデートが今稼働しているシステムに影響があるかどうか知る術はありません。
また、ベンダーの意向によってロードマップが変更になったり開発が中止されたり、ということが現実的に起こりえます。
一方、ブラウザのアップデートによってJavaScriptが突然動かなくなった…ということも無い訳ではないと思いますが、経験的には少ないように思います。
ただ、ベンダーのサポートが無いというのは不安でもあります。いざというとき、MSDNに入っていればサポートが受けられる、というのはエンジニアにとっては心強いです。

○「先進性」をアピールしたい

不純?な動機に見えますが、コンペとかではこういうことで引っかかったりしますよね。表現や機能的にFlashでできることを、HTML5でもここまでできるぞ!ということで話題になります。

○スキルのあるJavaScriptの開発スタッフがいる

Ajaxでクロスブラウザ開発の経験が豊富であれば、こちらも何の躊躇無くHTML5で取り組む事ができます。

いかがでしょうか。

Related Post

主要なモバイルUIフレームワークを比較してみました主要なモバイルUIフレームワークを比較してみました

WEB標準技術でアプリケーションを開発するためのUIフレームワークが増えてきました。モバイルWEB向けの業務アプリケーション開発に有用なUIフレームワークを選定するため、主要UIフレームワークのUIコンポーネントを中心に調査を行いましたのでその結果をご紹介したいと思います。ドキュメントベースではありますが、業務アプリケーションの開発に必要な、フォーム要素やグラフ等の各種コンポーネントが揃っているか、スタイルのカスタマイズ有無、複数人開発に対応するためMVCフレームワークが統合されているか等に注目し調査を進めました。以下の項目に分けてご紹介していきます。 調査対象フレームワークの概要 対応環境 主要UIコンポーネント その他(CSS,MVCフレームワーク統合有無など) 特徴 調査対象フレームワークの概要  以下6つのフレームワークを対象に調査を行いました。

Kii Cloud JavaScript SDKを使ったサーバサイド実装不要のフロントエンド開発[準備編]Kii Cloud JavaScript SDKを使ったサーバサイド実装不要のフロントエンド開発[準備編]

Kii Cloudは、MBaaSと呼ばれるクラウドサービスのひとつで、モバイルアプリの開発で共通して必要となるサーバ側の機能が提供されています。BaaSを使ったフロントエンド開発は、Parse.comを使ったサーバサイド実装不要のフロントエンド開発[前編]でもご紹介しました。 MBaaS – Kii Cloud キークラウド Kii CloudもParseと同じく、ユーザー管理やデータ管理など、アプリケーション開発に必要な一連の機能が用意されており、SDKやREST

縦書きにWebフォントを使いたい!けど使えるのか検証してみた縦書きにWebフォントを使いたい!けど使えるのか検証してみた

最近、IT系の記事や勉強会でWebフォントの話題を見かけるようになってきました。以前の記事では、Webフォントサービスのデコもじを使ってRIAXDNPブログの記事タイトルのフォントを変えてみましたが、今回は縦書きにした文字にWebフォントを適用できるのか検証してみました。検証環境はWindows版Safari(5.1.2)とMac版Safari(5.1.1)です。 WEBフォントを使う Webフォントサービスを使わずに自分でフォントを定義する場合、フォントのライセンスに注意してください。今回のフォントデータはデモ用に弊社の秀英体開発室からお借りしました。CSS3では以下のように@font-face規則を使って、フォントを定義することができます。 @font-face {font-family:’DNPShueiMinPr5B’;      src:url(‘../../fonts/DNPShueiMinPr5-B.otf’) format(‘opentype’);} .myFontStyle {      font-family:’DNPShueiMinPr5B’;}