HTML5(※)が何かと話題です。「Flash vs HTML5」のような対立構図で取り上げた記事や議論もよく見かけましたが、新しい技術に飛びつけばいいのではなく、ターゲットユーザーのブラウザー環境や最適な表現技術、パフォーマンスや互換性を考慮して使い分けるべきでしょう。
とはいえ、最近ではiOSやソーシャルメディアの普及などで、JavaScriptやCSS3使ったHTMLベースでの開発に対する要望も増えています。従来のWebサイトでは主にPCでの閲覧を中心に考えていましたが、現在ではスマートフォンやタブレットなどさまざまな端末での閲覧を想定した、より柔軟な対応がクリエイターに求められています。
スマートフォンやタブレットだけではありません。Retinaディスプレイを搭載したMacBook Proが発売されたり、ネット接続を前提としたスマートTVが注目されたり、デバイスも日々進化を遂げています。Webが今までの「Webページ」という概念を越し、あらゆるデバイスのあらゆる場面で使われているのです。
そういったさまざまなデバイスを想定したクリエイティブでは、HTML5/JavaScript/CSS3といったWebスタンダードの技術が有利です。今後のブラウザーの進化とともに、表現力もさらに磨かれるでしょう。
※ここではマークアップ言語としてのHTML5ではなく、JavaScriptやCSS3使った表現や関連APIを含めた広義のHTML5を指します
FlashのアプローチでHTML5を勉強しよう
とはいえ、リッチな表現力やインタラクティブ性に重きを置くコンテンツの制作では、現状ではまだまだFlashに一日の長があります。特に描画速度の点では大きな違いがあり、HTML5よりFlashのほうが3倍から10倍以上も高速だったという結果も出ているようです(ブラウザーによって結果は異なりますが)。また、互換性を考えると、ブラウザー間の差異をFlash Playerが埋めてくれるFlashが有利です。互換性が高ければ開発期間も短くて済みます。
もちろん、この辺りの状況も刻々と変化していますが、現状では双方のメリットを生かして、PCサイトはFlashで、iOSやAndroidなどのモバイルOS向けにはHTMLベースで、といった切り分けもひとつの手です。
今までFlashサイトを作っていた人たちはもちろん、Flashは触ったことがないけど、これからHTML5やCSS3を勉強する人も、Flash的な考え方や技術を知っていてもよいはずです。Grant Skinner氏によって開発された統合ライブラリーのCreateJSが登場したり、Flash Professional CS6では「Toolkit for CreateJS」によってHTML5変換できたり、Flash側にも新しい動きがあります。
私もFlashサイトに心を動かされてから、長年、Flashコンテンツを作ってきました。特にアニメーションツールとしてのFlashは優れていますので、HTML5やCSS3、JavaScriptを勉強していくにあたり、Flashからのアプローチも交えて紹介します。
FlashとHTML5をクロスオーバーしながら、一緒に勉強していきましょう!
著者:塚本一真(つかもと・かずまさ)
デザイナー/フロントエンドエンジニア。1ripple代表 。1979年生まれ、兵庫県神戸市出身。Webデザイン会社にて勤務後、 2010年6月に独立。さまざまなプロモーションサイトやWebサイトを制作。好きな食べ物は酒がすすみそうな、つまみ系。嫌いな食べ物はなし。最近は肉より魚になってきたこの頃です。Web制作やアプリ開発などジャンル問わず 、フリーランスや学生さん、気軽にご連絡ください!
主な受賞歴:WEBBY AWARDS、W3 AWARDS、FWA SITE OF THE DAY、THE INTERNATIONAL DAVEY AWARDS、SPIKES ASIA