HTML5はマークアップだけじゃない!広義のHTML5と狭義のHTML5について

HTML5はマークアップだけじゃない!広義のHTML5と狭義のHTML5について

これまでのあらすじ

ところで広義のHTML5狭義のHTML5てのがあるんだ

なんか難しそうなので遠慮しときます

そう言わずにちょっとくらい聞いて

「広義の、狭義の」って何?

HTML5について勉強していると、大体この言葉が出てきます。

実は、HTML5にはこれまでのHTMLとは違う意味も含まれています。

私たちが一般的に知っているのは狭義のHTML5です。詳しく見ていきましょう。

HTML5は、マークアップだけじゃない!
難しくてついていけない

がんばれ

狭義のHTML5

狭義のHTML5は、これまでのHTMLと同じ意味を持ちます。

つまり、マークアップ言語としてのHTMLで、コーディングするのに必要な知識です。

もぐでざでは狭義のHTML5を取り扱います。

広義のHTML5

広義のHTML5は「これまでのHTML」だけではなく、HTML5を使う上で関わりのある言語や技術を含んだ意味になります。

?????。、?。、?

コーディングをする時に装飾や動きを使うよね。
その時に何を使う?

CSSとか、JavaScript…?

正解!!
広義のHTML5はそういうのも含まれてるの!

CSS、JavaScriptを始めとした技術体系を含みます。

この技術範囲はかなり広範囲なので、W3C(Webを取り締まる組織的なもの)では8つに定義しています。

「広義のHTML5」定義

用語意味

セマンティックス

header」や「section」のように、役割をもたせられる要素。
新しい要素については、こちらで解説しています!


オフライン&ストレージ

Cookie(PC内でデータを保存)を使わずにブラウザでデータベースを保持すること。
これにより、ネットワークがオフラインでも閲覧できるように。


デバイスアクセス

音声、カメラ、位置、映像など…自分の情報をデバイスに伝えられるように。
Google Mapのアプリを開いたときに自分の位置が表示される」のはこの技術。

デバイスアクセスを体感できるサイトはこちら


コネクティビティ

Web Socketsという技術で、リアルタイム双方向型での通信が可能に。
オンラインゲームやチャットシステムで使われています。


マルチメディア
FlashやJavaScriptを使わずに動画を埋め込めるように!
再生、停止、巻き戻しなどの細かいカスタマイズもできます。

3D・グラフィックス・エフェクト
2D、3Dなどの様々な形式の画像が表示できます。
Canvas、SVGなどもここに該当。

パフォーマンス&インテグレーション
バックグラウンドでJavaScriptを実行したり、ページを移動せずにデータベースの取得を可能にする技術。

CSS3

これまでのCSSと比べて便利な仕様がたくさん増えました。
グラデーションやアニメーション、ボックスシャドウなどなど…。

参考URL:https://thinkit.co.jp/story/2012/06/05/3572

内容が難しすぎて犬になってしまった


ハッ

なんとなく理解しておけば大丈夫!
この情報は頭の片隅に置いといてくださいな〜
もぐでざでは
マークアップとしてのHTML5(狭義のHTML5)を取り扱います〜

次回はリセットCSSについてとHTML5でコーディングするための準備についてだよ!
おたのしみに〜

スポンサーリンク

おすすめ本の紹介

直感的にデザインが分かっちゃうスバラシな本です

余白の大事さがギュッとこの一冊で分かっちゃう

WP中級者向け。テーマ作成で役立ちます。

関連記事