もくじ

html5以前を知っている人に

まだ箇条書きですが…

html5はまだ最終決定には至っていませんが、ほぼ固まっています。「HTML5と4の違い」というW3Cの文書を見ると概略をつかむことができます。

ブロックを作るタグ、インラインタグの区別がなくなる

cssのdisplay属性として、block, inline と指定するので、cssの用語としては残ります。h1,h2,pなどはブロックとして表示されるようになっていることが多いタグですが、ブロックを作るタグではありません。

h1が太字で大きく表示するタグではないのと同様に考えます。

inlineタグだったものは Text-level semantics のグループになった

Text-level semantics は、テキストレベルの意味づけとでもいう名前。

spanの多用がかえって意味不明のマークアップを増やしたことを反省したのだろう。つまり、自分にとってわかりやすいクラスの名前をつけても、他人にはその意味がわからないという事態が生ずるのだ。そこで、以前使っていたタグも使用目的を変えて再登場させて増やし、なるべく共通のくくりの中に分類させようとしている。

もちろんその使用目的は「見栄え」ではなく「意味」による分類だが、他と区別したいという軽い意味も「意味」として認めて、classを使わなくてもある程度の共通なマークアップになることを目指している。

b, i, s, small など懐かしい要素が意味を変えて帰って来た

b:通常の文から文体的に区別したいテキストの範囲

i:分類上の意味、技術用語、別の言語ならではの言い回し、考え、船の名前など英語で一般的な印刷表現がイタリック体となる文。英語でない場合は言語にあわせてcssで印刷表現を設定して使う。

s:すでに正確ではなくなった内容、もう関連性がない内容を表します。

small:細則など付加的なコメントを表します。免責条項・警告・著作権などの注釈や細目などです。

em, strong が変わった

strong 要素は、強調ではなく重要性を表すことになります。

em 要素は重要であるという意味でなくなります。強勢強調を表します。アクセントを付けることで文の意味が変わる時に使用します。

address 要素は適用範囲が限定される

html5 ではページについての連絡先・問合せ先になるものしか書いてはいけないことになりました。

以前はページの最後に作成者の情報や作成日時などを入れるように、使っていましたが、連絡先・問合せ先に限ります。これ以外は、footerというセクショニング用のタグが新設されたのでこれを使います。

img の alt属性が変わった

必ず付けなくてもよくなった代わりに、絵の代わりにaltの文章を読んだだけでもある程度の意味が通じるようにしなければならなくなります。

article aside header footer nav

Sections というタグのグループにいろいろ追加されました。div class="navbar" などの代わりに nav というタグを使う方が、html5 らしいマークアップです。

まだ各ブラウザの対応が完全でないかもしれないので注意が必要ですが、いつまでも class="nav" class="header" とやっているのは古風になっていくでしょう。

formがかなり変わった

要素が増えました。双方向のやり取りの拡充です。

formのタグ内にinputやtextareaを入れずに別の場所に置けるようになりました。

submitの方法、actionの方法が変わりました。いままでonclickなどとの組み合わせもありましたが、より柔軟になったようです。


ウェブページ(May.2013)
聖愛中学高等学校
http://www.seiai.ed.jp/