HTML5になって要素が追加されたり、使い方が変わったり、廃止されたりしているので それぞれまとめてみました。
HTML5で追加された要素
- article
- 独立した記事の時に使用します。
ブログ記事やニュース記事のように独立した記事に使用され、見出しタグや<section>をまとめたりすることで使用したりします。 - <article>の中に<article>を入れる事も可能です。
- ブロック要素、インライン要素も入れられます。
- section
- 記事の中でセクション分けするために使用します。
記事内に、複数の項目がある場合小分けにするために使用され、その中には見出しタグを入れたりします。 - <section>の中に<section>を入れる事も可能です。
- <section>の中に<article>を入れる事も可能です。※構造的にはほとんどの場合article>sectionとなると考えられます。
- ブロック要素、インライン要素も入れられます。
- main
- メインコンテンツを明確にするため使用します。
- 共通で使用するヘッダー・フッター・ナビゲーション等はこの要素内には含みません。
- HTML5の初期ではmainは1ページ内に1つのみ使用可とありましたが、現在は使用回数の制限はありません。
- <main>を<article>,<aside>,<header>,<footer>,<nav>の中に入れることはできません。
- header
- ページのヘッダー、記事のヘッダーとして設置することが可能です。
- 記事ヘッダーとは、主に記事のリード文を表す場合に用いります。
- footer
- ページのフッター、記事のフッターとして設置することが可能です。
- 記事フッターとして用いる例としてこのページのように記事の締めくくりとして「この記事を書いた人」部分にあたります。
- nav
- 一般的な使用として、ページナビゲーション、パンくず、目次などに用いります。
- aside
- 本文に関連しているが、区別された補足情報のセクションに用いります。
本文内に含まれる補足情報には使用できません。
HTML5で定義変更になった要素
- address
- コンテンツの連絡先
- strong
- 重要性
- b
- 注意(以前は太字で視覚的なタグでした。)
- i
- 他と区別したいテキスト(以前は斜体で視覚的なタグでした。)
- s
- 不正確なテキスト(以前は取り消し線で視覚的なタグでした。)
- u
- ラベル付け(以前は下線で視覚的なタグでした。)
- small
- 但し書きや注釈※コピーライトや警告など(以前は小さい文字で視覚的なタグでした。)
- cite
- 引用先のタイトル・著者名・URLなど用途が限定
- dl
- 関連リスト(以前は定義リストでした)
- hr
- 段落の区切り(以前は視覚的なタグでした。)
- menu
- コマンドのリスト
- noscript
- head要素内への入れる事が可能となりました
HTML5で廃止になった要素
acronym、applet、basefont、bgsound、big、blink、center、dir、strike、tt、font、frame、frameset、noframes、isindex、marquee、nobr、noembed、
HTML5で廃止になった属性
- body
- background、bgcolor、text、link、vlink、alink
- br
- clear
- caption
- align
- col
- width、align、valign、char、charoff
- div
- align
- dl
- compact
- h1～h6
- align
- hr
- size、width、align、noshade
- iframe
- longdesc、scrolling、frameborder、marginwidth、marginheight、align
- img
- longdesc、name、align、border、hspace、vspace
- input
- align、usemap、ismap
- legend
- align
- ul
- compact、type
- ol
- compact、type
- li
- type
- p
- align
- menu
- compact
- link
- charset、target
- pre
- width
- object
- classid、codetype、archive、codebase、standby、declare、align、border、hspace、vspace
- table
- summary、width、frame、rules、cellspacing、cellpadding、align、bgcolor
- tbody
- align、valign、char、charoff
- thead
- align、valign、char、charoff
- tr
- align、valign、char、charoff、bgcolor
- th
- align、valign、char、charoff、axis、width、height、bgcolor、nowrap
- td
- align、valign、char、charoff、abbr、scope、axis、width、height、bgcolor、nowrap
