読者です 読者をやめる 読者になる 読者になる

ハロトレWebデザインの勉強03月14日開講クラス授業補足ブログ

HTML5とは

HTML5

  • HTML5 は、WHATWG および W3C が HTML4 に代わる次世代の HTML として策定を進めている HTML 仕様



広義のHTML5
  • いままでより高度な機能をもつWebページ
  • 特定のOSやブラウザに依存しない
  • CSS3やECMAScript5を含む
狭義のHTML5
  • HTML4.0に続く5番目のHTML
CSSJavaScript

HTMLとは

  • HTML(HyperText Markup Language)
  • テキストで記述される
  • HTMLドキュメントがブラウザに読み込まれるとWebページが表示される
  • ハイパーリンクが特徴


タグを入れてテキストをマークアップ(意味づけ)する

<html>
<head>
<title>ページタイトル</title><!--ページタイトル-->
</head>
<body>
<h1>見出し</h1><!--見出し(headline)-->
<p>本文本文<!--段落(paragraph)-->
<a href="link.html">リンク</a><!--ハイパーリンク-->
本文本文</p>
</body>
</html>
HTML5を理解するためのキーワード
HTML5の必要性
  • かつてのWebサイトは「情報の閲覧」のためであったのに対し、最近では「Webアプリケーション」を操作する目的で使われるようになってきて、初期の仕様がそぐわなくなってきた

HTML5の歴史

HTMLの誕生とバージョンアップ
  • HTMLは、1990年代からそれまでのマークアップ言語SGMLに、インターネットのためのハイパーテキストの機能を取り入れた仕様が定義されました
  • 1993年にIETFからHTMLバージョン1.0が公開され、SGMLからの拡張としてDTD(文書型定義)を持つようになり、1996年からW3CによってHTMLの仕様が標準化され、2000年に国際標準となりました
  • その時にW3Cから勧告されたHTMLのバージョンは4.0で、最新のHTMLの仕様はHTML4.01です
  • W3CがHTMLの仕様を標準化するまでは、ブラウザごとに独自の定義がされ、あるブラウザで表示されるものが、異なるブラウザでは表示されないなどの問題がありました
  • W3Cが標準化したことにより、ブラウザごとに要素の定義が統一されていなかったHTMLの互換性が保証されるようになりました
HTML1.0
  • HTML1.0は、初めて一般公開されたマークアップ言語です
  • 見出し、段落などの文書構造のための基本要素の他、他の文書や要素にリンクする機能も提供されました
HTML2.0
  • このバージョンから、文書型定義の宣言(DTD)を定義しています
  • HTML1.0の要素に新しい文書構造のためのタグを追加しました
  • また、入力フォーム関連のタグも追加されています
HTML3.2
  • このバージョンは、一覧表を作成するためのテーブルタグや文書を成型するためのタグや属性などが追加されています
  • このバージョンから、フォントや背景などに色をつけることもできるようになりました
  • また、embed要素やapplet要素で音声やビデオの再生やJavaアプレットの実行などHTTPを仕様しないオブジェクトもWebページ上で動作することが可能となっています
  • なお、このバージョンの前のHTML3.0は、草案だけで正式勧告されないまま廃棄となりました
HTML4.0
  • HTML3.2までのプレゼンテーション用のタグや属性を非推奨として再定義し、本来のSGMLの基本方針にのっとったバージョンです
  • 文書の整形処理はスタイルシートを利用し、文書の構造のみを記述するように整理しています
HTML4.01
XHTMLの誕生
  • HTML4.01が勧告された後に、XHTMLが登場しています
  • XHTMLは、HTMLをXMLの文法で定義しなおした仕様で、他のXMLに埋め込んだり、拡張したりすることが可能で、HTML4.01に代わる新しいWebの技術になることが予想されていました
  • W3Cは、XHTML1.0を2000年に勧告し、2001年に1.1、2002年に2.0とXHTMLのバージョンを策定していますが、XHTMLと互換性のないWebサイトが多い、XHTMLMIMEタイプが使えないブラウザが普及しているなどの理由により、XHTMLの普及は意図する通りに進みませんでした
HTML5の誕生
  • XHTMLの普及が進まない中、Webアプリケーションの機能が更に発展していき、XHTMLでなくHTML自体の仕様を更新すべきという流れがあり、WHATWGが次世代HTMLとしてHTML5の仕様を策定し始めました
  • W3Cは、最初は方針に反することとして反対していましたが、HTML5が多くの企業や開発者たちに受け入れられたため、HTMLの新しい仕様として正式に採用しています

 

HTML5 8つのポイント

  1. SEMANTICS
  2. OFFLINE & STORAGE
  3. DEVICE ACCESS
  4. CONNECTIVITY
  5. MULTIMEDIA
  6. 3D, GRAPHIC & EFFECTS
  7. PERFORMANCE & INTEGRATION
  8. CSS3
  • マイクロデータやマイクロフォーマットなどによって、HTML文書の情報としての意味をわかりやすくし、サイトを使いやすくする
  • ネットワークがない環境でも利用でき、GPSによる位置情報の取得など各種デバイスにアクセスできるようにする
  • サーバーやアプリケーションとのコネクションやパフォーマンスをよくするための技術も含まれている
HTML5とCSS3
  • Webページの情報をより効率的に伝達するには、視覚的なデザインやレイアウトが必要になります
  • その役割であるCSSも最新バージョンCSS3が策定中です