HTML5 Web アプリの基礎

by 2 contributors:

Open Web App は基本的には HTML5 アプリです。HTML、CSS、JavaScript、それぞれの役割はよく知られているかもしれませんが、HTML5 アプリでそれぞれが各自の重要な役割をどう演じるか、要点を簡単にまとめてみましょう。

コンテンツと構造のための HTML5

HTML は Web アプリケーションのコンテンツ構造を作成するために使われます。HTML5 の新機能 には、新しい <input> タイプ、フォーム検証機能<audio><video> といったメディアタグ、より意味的な HTML 要素 などが含まれます。

スタイルのための CSS3

CSS は視覚的表現を提供し、コンテンツの基本レイアウトを調整できるようにします。しかし CSS の役割はコンテンツの体裁を整えることだけではありません。CSS の力を活用すれば、要素をアニメーション させたり、正確なグラデーション を描いて不必要に画像を使うのを防いだり、表示される端末の種類に応じてコンテンツの見た目を最適化する メディアクエリ を作成したりといったことが可能です。

動的なインタラクションのための JavaScript

JavaScript は Web アプリに力強さとユーザインタラクションを提供します。JavaScript を使えば、ユーザインタラクションを監視してそれに反応したりコンテンツを動的に読み込んだりCamera APIGeolocation API といった端末固有の機能にアクセスしたりと言ったことが可能となります。

個々の機能への対応がブラウザごとに異なるという点に留意することが大切です。それぞれの機能を使う前に、機能判別 と調査を行うべきでしょう。そうした戦略をどう用いるかは、このチュートリアルの続きで詳しく説明します。

ドキュメントのタグと貢献者

タグ: 
Contributors to this page: kohei.yoshino, ethertank
最終更新者: kohei.yoshino,