HTML5 Tag Tips
XHTML2.0からHTML5になって定義が明確になった要素があったりするので、自分の認識違いゆえ、意図しないマークアップをしませんように・・・
強調編
strong
テキストレベルセマンティック
**「重要性」**のみを表す要素。
strong要素自身を入れ子にして重要性の度合いを示すことができる。機会に対して重要を示すのでSEO向け。
強調の意味はHTML5では消失しているので注意。
em
テキストレベルセマンティック
**「強調」**のみを表す要素。
音声読み上げツールで読み上げられた場合に、大きな声になることを想定。読み手に対して強く言いたいだけなのんでSEO向けには使わない。
i
テキストレベルセマンティック
イタリック体にできるってだけ。原則として利用しない。
b
テキストレベルセマンティック
印刷時に太字になるってだけ。原則として利用しない。
mark
テキストレベルセマンティック
ハイライトされるってだけ。読み手が参照しやすいように目立たせることが目的なのでSEO向けに使わない。HTML5から追加されている。
重要なテキストのマーキングではなく、読み手の操作に関連している箇所に利用する。
引用編
blockquote
グルーピングコンテンツ
別ソースから引用する場合に利用する。
cite
属性で参照先URLを指定することが出来る。ただしこのURLは読み手のためのURLではない。
出典情報やfooter情報blockquote
で囲むことが出来る。
出典の場合はマイクロデータの構文を使用して追加することも出来る。
cite
テキストレベルセマンティック
本、新聞、エッセイ、詩、楽譜、歌、脚本、映画、テレビ番組、ゲーム、彫刻、絵画、映画、演劇、オペラ、ミュージカル、展示、訴訟事例報告などのタイトルに対して利用。
記事内のコメントの著者名や、検索結果のURLを表す。
q
テキストレベルセマンティック
文章を引用する場合に利用する。
cite
属性で参照先URLを指定することが出来る。
ブラウザのデフォルト機能で引用符がつくが、これを目的に利用してはならない。
連絡先情報編
address
セクション
最も近いarticleまたはbody要素の祖先の連絡先情報を表す。祖先がbody要素である場合、連絡先情報は、文書全体に適用される
問い合わせ先メールアドレスやコピーライト表記などの情報をaddress
で囲んで利用することもできる。(その場合はだいたいfooter
内に配置される)
small
テキストレベルセマンティック
副次的なコメントを表す。
小さな活字体は通常、免責事項、警告、法的制約、または著作権を取り上げる。小さな活字体はまた、時として帰属に対して、またはライセンス要件を満たすために使用される。
免責・警告・法的規制・著作権・ライセンス要件などの注釈や細目を表す要素。
テキストに対して使用するので、長文に対して全体を <small> ~ </small>
で囲むような使い方はしない。