HTML5って何? わかりやすい動画サイトは?

HTML5って何? わかりやすい動画サイトは?HTML5が出て、しばらく経ってますが理解できていないので、簡単にまとめてみた。

HTML5の目的とは?

主に三つある。

  1. 今までのHTMLでは仕様がしっかりとしてなかったためブラウザの互換性が無かった!だから仕様をキチンと決めて、ブラウザの互換性を高めよう!
  2. HTMLのソースを見やすく、分かりやすくしよう!そのためにタグを分かりやすくしよう!
  3. もっと色々なWebアプリを作れるように、機能を充実させよう!

HTML5と、今までのHTMLとの違いとは

  1.  DOCTYPEの宣言が簡単になった! <DOCTYPE html>だけで良くなった!
  2. brタグのような1つだけのタグは、必ずスラッシュで終わるようにする。
  3. section,article,navi,header,footerなどのタグを用いて、メインとなるコンテンツを読みやすくする。
  4. フォームの入力支援機能が増えた。
  5. Flashなどのプラグインが不要になる。
  6. その他、色々な機能が増えた。

簡単にまとめると、「使用すべきタグが増えて、機能も増えた」ということ。

HTML5で作られているサイト

Apple : http://www.apple.com/

ローソン:http://www.lawson.co.jp/index.html

など多数。

HTML5に準拠しているのかを調べるツール、サイト

以下の二つがあります!

日本語

http://www.htmllint.net/html-lint/htmllint.html

W3C公式

http://validator.w3.org/

各ブラウザのHTML5への対応

詳細を書くと長いので省略します。

基本的に Firefox、Google Chrome、Internet Explorerで対応している状況が異なります!

同じようにタグを書いてもGoogle Chromeでは動いても、Internet Explorerでは動かない!ということが存分にありえるので、気をつけましょう!

HTML5を学べるサイト

こちらで、HTML5を学びながらサンプルを作っています。

http://dotinstall.com/lessons/memo_html5

まとめ

やることとしては、「今までidで名前を付けていた箇所をheader, article, footerで囲む。flashを使用していた箇所は辞めて、canvas等で作り変える」でOKな感じですかね。

ただ、各ブラウザとも対応している状況が異なるので、しばらくHTML5で作るときは気をつける必要がありますね・・・。

シェアする

  • このエントリーをはてなブックマークに追加

フォローする