テキストの一部の文字を小さくするのに使用していたSmallタグですが、HTML5では意味が変更になっています。
今までは、テキストを小さくするのは別の方法が推奨されています。
今回は、HTML5でのsmallタグの正しい意味と使い方についてご紹介していきます。
- smallタグってなに？
- smallタグは、どんな場面で使うの？
- smallタグを使う時の注意事項。
上記の内容を中心に解説していきます。
SmallタグのHTML5からの変更点
HTML4までは、文字を小さくするのに使用されていたsmallタグですが、HTML5からは「注釈」や「細目」を表す意味のあるタグとして使用が推奨されています。
注釈とは。
本文中の語句をとりあげて、その意味を解説すること。
また、その説明。注解。
比喩的に、話などを付け加える補足的な説明をいう。
コトバンク
細目（さいもく）とは。
こまかいところまでくわしくしてある箇条。
こまかな項目。こわけ。
コトバンク
これだけでは、使い方をイメージしにくいと思いますので、WEBサイト上での具体的な方法を挙げいきます。
著作権情報（コピーライト）
footerなどによくある著作権表示がsmallタグの使用にあたります。
本サイトでいうと、「Copyright 2024 I-f – Web Works -」これが著作権情報にあたります。
<p><small>Copyright 2024 I-f - Web Works -</small></p>あくまでも一例ですが、上記のような形で使用します。
smallタグはインライン要素なので、pタグのようなブロック要素の中に入れて使用するのが適切です。
細目（細目）
細目は、画像や本文テキストの後に「※」などで、補足をしてある形を見たことがあるかと思います。
そういった場合もsmallタグの使用に該当します。
その他の利用について。
smallタグは、「著作権情報」や「細目」以外にも使用ができます。
- 免責
- 警告
こちらにも、smallタグの使用が推奨されています。
smallタグを使用するときの注意事項。
smallタグは、本来の意味のとおり、囲ったテキストを小さくしてくれます。
テキストのサイズは、ブラウザによりことなります。
そのため、smallタグを設置したら、必ずCSSで調整することをお勧めします。
見ているブラウザでテキストのサイズに問題がなくても、ブラウザを変えるとサイズが変わってしまいます。
また、著作権情報だからといって必ずsmallタグで設置しないといけないかというと、そうではありません。
サイトによっては、smallタグを使用せずに「著作権情報」を表示しているサイトもあります。
HTMLの構造上、上手くいかないときいなどは、無理に使用せずにデザインを優先していいと思います。
(SEO的には、smallタグの方がいいかもしれませんが。)
まとめ
smallタグは、著作権表示・細目に使用することが望ましく、ただテキストを小さくするのには使用しないようにしましょう。
テキストを小さくしたい場合には、spanを使用して、テキストサイズを指定する方法が適切です。
タグは、意味を持っています。
むやみに利用せず、適切な意味を理解して、サイトの構築にあたってください。