HTML

HyperText Markup Language small element.

small 要素

 small要素は、細目のような注釈を表します。細目とは、免責条項、警告、法的制約、著作権表記などを説明する法律用語です。細目は、帰属に使ったり、ライセンス要件を満たすために使う事もあります。

 HTML4では、small要素はフォント・スタイル要素として規定されており、小さいフォントでレンダリングするための要素でした。しかし、HTML5では、細目というセマンティクスが与えられ、小さいフォントでレンダリングするという意味はなくなりました。実際には、どのブラウザでもデフォルトでは一回り小さいフォントでレンダリングしますが、それだけを目的にこの要素を使ってはいけません。

 small要素は複数の段落をまたいでマークアップしてはいけません。あくまでもインラインのレベルとして使ってください。

 また、利用規約などを記載したページ全体を small要素を使ってマークアップするのは適切ではありません。そのページにおいて、利用規約の内容は、メイン・コンテンツとなるからです。

 small要素は非推奨要素ではありませんが、フォントの見栄えに関する指定にはできるだけスタイルシートを利用してください。スタイルシートでは、<span style="font-size: small">~</span> などと記述します。

著作権表記のマークアップ例

<p><small>© 2004 - 2021 Waste Of Time.</small></p>

著作権表記のマークアップ例のサンプル

© 2004 - 2021 Waste Of Time.

著作権表記のマークアップ例のサンプルで small 要素を使わなかった場合

© 2004 - 2021 Waste Of Time.

 このサンプルはページフッターに著作権表記をマークアップした例です。恐らく、最も多い small要素の利用シーンだと思われます。

 small要素は、フレーズの中で括弧書きで表すような注釈にも使う事ができます。

注釈のマークアップ例


<article>
	<h2>夏モデルと新サービス発表</h2>

	<p>NTTドコモ<small>(社名:株式会社エヌ・ティ・ティ・ドコモ、所在地:東京都千代田区永田町2丁目11番1号 山王パークタワー)</small>は16日、夏商戦向けのスマートフォン<small>(高機能携帯電話=スマホ)</small>16機種を発表した...</p>

	<aside>
		<h2 id="ssmp">Android<small>(アンドロイド)</small>とは</h2>
		<p>Android<small>(アンドロイド)</small>とは、スマートフォンやタブレットPCなどの携帯情報端末を主なターゲットとして開発されたプラットフォームである...</p>
	</aside>
</article>

注釈のマークアップ例のサンプル

夏モデルと新サービス発表

NTTドコモ(社名:株式会社エヌ・ティ・ティ・ドコモ、所在地:東京都千代田区永田町2丁目11番1号 山王パークタワー)は16日、夏商戦向けのスマートフォン(高機能携帯電話=スマホ)16機種を発表した...

注釈のマークアップ例のサンプルで small 要素を使わなかった場合

夏モデルと新サービス発表

NTTドコモ(社名:株式会社エヌ・ティ・ティ・ドコモ、所在地:東京都千代田区永田町2丁目11番1号 山王パークタワー)は16日、夏商戦向けのスマートフォン(高機能携帯電話=スマホ)16機種を発表した...

 このサンプルは、報道発表を想定したものです。文章の中にある括弧書きで表された注釈を small 要素でマークアップしています。

 最後にある補足説明に aside 要素を使っている点に注目してください。これも注釈と言えますが、ブロックレベルのコンテンツです。また、本文から切り離しても、本文を損なわないコンテンツですので、small 要素ではなく、aside 要素を使っています。

 small 要素は、strong 要素の中で使う事も可能です。この場合は、strong 要素の重要性を弱めるという意味ではありませんので注意してください。これは、重要な細目を表します。

重要な細目のマークアップ例

<p><strong><small>利用の結果生じた損害について、一切責任を負いません。</small></strong></p>

重要な細目のマークアップ例のサンプル

利用の結果生じた損害について、一切責任を負いません。

 これは免責事項を想定したフレーズです。この免責事項は small 要素でマークアップされています。そして、それを strong 要素の中に入れる事により、この免責事項に重要性が与えられることになるのです。

small 要素の概要

カテゴリー

フロー・コンテンツ

フレージング・コンテンツ

コンテンツ・モデル フレージング・コンテンツ
利用可能な場所 フレージング・コンテンツが期待される場所
開始タグ 必須
終了タグ 必須
要素固有のコンテンツ属性 なし
標準的なスタイル
small {
	font-size: smaller;
}