SMALL、B、I、BIG要素について

前提として

最終更新
2002-12-30T12:47:20+09:00

適切なHTMLタグがあるのにも拘わらず、それらを使わずに、これらの物理タグでマークアップするのは論外です。例えば、本来、h2タグでマークアップするべき見出しをbタグでマークアップする、などです。わざわざそのようなことをして、User Agentに見出しであることを隠蔽する必要など全くないのですから。

概要

最終更新
2002-12-30T12:48:08+09:00

HTMLで明示できない要素(サブタイトル、弱い表現等々)を、spanタグでマークアップする場合、そのときに限り、small、b、i、bigを用いるとより良い場合がある。

CSS非対応環境への配慮として使う

最終更新
更新はありません

small、b、i、bigタグなどの物理要素用のタグは、うまく使うとCSS非対応環境への配慮となります。

事例1 : サブタイトル

HTMLで定義されていない要素、例えばサブタイトルなどは、何でマークアップするべきでしょうか。

2つの例を比較してみます。

spanを使った例
<h1>良い文章を書くには
<span class="sub-title">素人なりの見解</span></h1>
smallを使った例
<h1>良い文章を書くには
<small class="sub-title">素人なりの見解</small></h1>

CSSでいくらサブタイトルとしてのスタイルを定義しても、spanタグを使う限りはCSS非対応環境では全く見分けがつかず、「良い文章を書くには素人なりの見解」と、意味が不明になりかねません。一方、smallを使えば、HTML3.2対応ブラウザであっても見栄えとして伝わる可能性があります。

どうせspanという匿名のインライン要素を使うなら、物理要素を使った方がベターな場合がある、という例です。もし、spanでHTMLにない要素をマークアップしているなら、一考する価値はありそうです。

マークアップに頼らない

そもそも、HTMLに定義されていない要素は、いくらdivやspanでマークアップしても閲覧者に伝わる保証はどこにもありません。こういう場合、言葉や文字、記号などでカバーするのが良いと思います。多少、見栄えに関する記号、例えば「|」や、「-」を使うことになっても、伝わらないよりは幾分ましだという立場です。

マークアップしない例
<h1>良い文章を書くには
- 素人なりの見解 - </h1>

特に見栄えにこだわったりしないのなら、私はこれで十分だと思うのです。

もちろん、あくまで見栄えのフレキシビリティにこだわるなら、次のようにマークアップしておく手もあります。

徹底的に見栄えにこだわる

徹底的にやる例

.sign{ display : none }

<h1>良い文章を書くには
 <small class="subtitle">
  <span class="sign"> - </span>
   素人なりの見解
  <span class="sign"> - </span>
 </small>
</h1>

「-」は後方互換のための要素だということをマークアップで示しておくことで、CSSでの柔軟な仕事ができるわけです。見栄えに関しての柔軟性と、マークアップの煩雑は比例関係にあります。コンテンツを重視するならマークアップはシンプルな方が良いはずですから、多用はお勧めできません。

物理表現それ自体に意味がある場合

最終更新
2004-05-09T15:31:59+09:00

日本ではまずこういったケースは無いでしょう。しかし海外では、イタリックであること自体に何か特別な意味があったりするかもしれません。そのような場合は、CSSでなく、これらの物理タグを使用するほうが良いはずです。

予想通り、そのような特別な事例を挙げているウェブページがありました。

ここでは、多言語による表記や学名をイタリック(i要素)で、ベクトルをボールド(b要素)としてマークアップするのは妥当だということが述べられています。共通するのは、どれもHTMLでは表現することの出来ない要素であり、かつ、その要素には慣習的な文字のスタイルがあるという事実です。