HTML5の定義

Sematics セマンティックス

構造に意味やデータ形式(セマンティックス)を与える事が、HTML5の中心的な役割です。

※Webアプリケーションはより早く起動し、機能します。
※Webアプリケーションがリッチリッチなデバイス認識機能と体験を提供することができま。
※3D、グラフィックス効果(グラフィックス効果(3D, Graphics and Effects)
SVGcanvas要素、WebGL、CSS3 3Dの機能を通して、ブラウザー自身によってレンダリグされた魅力的なビジュアルでユーザを驚かせることは確実です。

RDFa(Resource Description Framework in attributes)は、Webページの表示に影響を与えずに、
メタデータXHTML文書に埋め込むことを定義した仕様です。

area(map要素の子要素である場合)
article
aside
canvas



header要素
headerに使用するタグ。ページ内で複数使用可能

hgroup要素
見出しと小見出しをグループ化して使用する要素です。要素内ではh1〜h6以外の要素を使用することはできません

figure要素は画像・コードなどを囲う要素です。画像に対してのキャプションをつける場合はfigcaption要素を使用します。

マークアップ

<figure>
    <p><img src="photo.jpg" alt="画像" /></p>
    <figcaption>ここにキャプションが入ります</figcaption>
</figure>


section要素

文章を囲う基本的な要素です、この要素には必ずh1〜h6の見出しが必要です。 またdivのかわりにレイアウト目的に使用することはできません。


                                • -

削除された要素
 hgroup
 details
除外された要素
 command
 menu

                                • -

※インラ要素というのは文中単語や文字列といったものを表すので
それらは段落(ブロックレベル要素)の中に入れなさい、とう単純な道理です。


HTMLとXHTMLの区別は無くなったでしょうか?
これは、HTML、XMLの、いずれか形式にデータを変換するとう意味で「シリアライゼョン」(serialization)と呼ばれています。

ようはHTMLをXMLの書式に合わせて書いたものをXHTMLと呼び、従来はそれをXML宣言やDOCTYPE宣言のバージョンで明示していたわけすが、
HTML5では、中身の書き方次第でどちらにもる、HTMLシリアライゼーションとXMLリアラリアライゼーションが併存しているのです。
そして、両シリアライゼーョンの下、それぞれの文法として、HTML構文とXHTML構文が定義されています。つまり、HTML構文に従ってコードを書けば「HTML5」に、
XHTML構文に従ってコードを書けば「XHTML5」に、なるというこです。

XHTML5にするには
もちろん「/>」を使っただけでは、XHTML5にはなりません。
XHTML 1.1などと同じように、html要素のxmlns属性で名前空間を指定する必要もあります。



メタデータ
デー従来のHTML/XHTMLでは、head要素内にmeta要素でMIMEタイプと文字コードを明示してきまた。
HTMLでは以下の記述す。

XHTM 1.1では以下のとおりです。


このうちMIMEタイプは、選択したシリアライゼーョンによって決定されるので、http-equivとcontent属性の組み合わせによる記述は、
互換のためだけにに残されています。

文字コードの宣言
とはいえ、文字コードを明示しないと、ブラウザーの表示で文字化けする場合があるため、
HTML5では、次のように文字コード宣言をmeta要素で行うよになりました。

なお、XMLでは、この文字コード宣言効果を持ちません。HTML文書内に、この宣言しかない場合、XMLパーサは文字コードUTF-8として取り扱います。

XMLパーサーとは、XML言語を解析し、検証・変換、出力するプログラムを指します。



基本構造のまとめ
こまで見てきた見てきた、DOCTYPEやhead要素内の要素内の書き方をまとめる、HTML5では、HTML構文の基本構造を次のように書くことなります。

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>タイトル</title>
</head>
<body>
</body>
</html>

XHTMLの場合

<!DOCTYPE html>
<html xml:lang="ja" lang="ja" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="UTF-8" />
<title>タイトル</title>
</head>
<body>
</body>
</html>
                                                        • -

HTML5コーディングテンプレート P56ページ目

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<title>タイトル</title>
</head>
<body>
</body>