HTML5, CSS3, Javascriptの威力

2012.05.15

こんにちは、ショーンです。
今回はHTML5、CSS3、Javascriptの総合的なお話しをしようと思います。

この度、弊社が新オフィスへ移転した際、移転案内サイト (http://www.froubright.co.jp/move/ ) を作成しました。
このサイトでは普段ブラウザ対応の問題等でなかなか採用出来ていない、HTML5のvideoタグ、CSS3のtransformとJavascriptの組み合わせを採用しており、軽快な動きを実現しています。

実際に僕がコーディングをしていて、メリットだと思った点は、
・動画の再生タイミング等もコーディング上で制御出来る。
 (例えばvideoタグに対して、JSでsetTimeoutとvideo.play()を使うことにより動画再生開始のタイミングをコントロール出来る。)
・アニメーションの実現が比較的手軽に出来る。
・Flashを使用していないのでiPhone、iPad等のモバイルで閲覧が出来る。

一方で先程も言及したブラウザ対応の問題や、まだまだ細部までコントロール出来ない部分がある点等がデメリットとして挙げられますが、動画の再生に関しては、Javascriptの導入によりIE8でも実現可能となっている等、解決法も存在しているので、このHTML5、CSS3、Javascriptの組み合わせによって生まれるメリットは十分魅力的といって良いと今回のサイト制作を通じて思いました。
ブラウザ間での仕様の違いを理由に、新しい技術を試さないのは非常にもったいので、積極的に取り入れていきたいですね!

jshcl

一覧へ