web-dev-qa-db-ja.com

<b>タグと<i>タグが廃止されたのはなぜですか?

この質問は私の大学のクラスの1つで出ました。教授はそれがより説明的であるという回答を与えただけですが、<b><i>は意味がかなり明確で、<strong><em>よりも入力が簡単であるように見えます。

これらのタグの廃止に関する公式の議論は何でしたか?

103
LanceLafontaine

昨年の夏、私は完全なHTML5仕様、および以前のすべてのHTML仕様(放棄されたものも含む)、および私が見つけたすべてのCSS仕様、および多くのXML仕様を読みました。私は意味論的にリッチなハイパーテキストドキュメントが大好きなので、HTML5の関連するHTMLセマンティクスの背後にある考えを紹介しましょう。

HTML5の前

HTML5以前は、ibはまったく時代遅れでした。その理由は、それらが本質的にそれぞれemおよびstrongのように機能したが、presentationに焦点を当て、 意味論(これは悪いことです)。

実際、iは、テキストをイタリック体にする必要があることを意味します(テキストを画面上にレンダリングする方法について説明しました)。一方、emは、テキストが強調されることを意味していました(テキストのセマンティクスについて何かを述べていました)。

ここには重要な理論上の違いがあります。 emを使用する場合、ユーザーエージェント(=ブラウザー)はテキストが強調されるべきであることを認識しているため、ドキュメントが画面に表示されている場合は斜体で表示できます(フォーマットできない場合はすべて大文字)。または、太字でもユーザーがそれを好む場合)、ドキュメントがユーザーに話しかけられた場合など、発音が異なる場合があります。

重要なのはセマンティクスについてであることに注意してください。たとえば、フレーズ

  • catは私のものです。 (=犬ではありません!)
  • 猫はmineです。 (=あなたのものではありません!)

同じ意味ではありません。

同じ違いがb(太字フォント)とstrong(強調)にも当てはまります。

一般的にデジタルライティング、特にハイパーテキストオーサリングの一般的な原則は、コンテンツとスタイルを分離することです。ハイパーテキストオーサリングでは、これはコンテンツがHTMLファイルにあり、スタイルがCSSファイル(または複数のCSSファイル)にあることを意味します。異なるが関連する原則は、ドキュメントはセマンティクスが豊富であることです(ヘッダー、フッター、リスト、強調、住所、ナビゲーション領域などのマークアップ)。これには多くの利点があります。

  • コンピュータプログラムがドキュメントを解釈する方がはるかに簡単です。これらのプログラムには、ブラウザー、音声合成アプリケーション、検索エンジン、デジタルアシスタントが含まれます。 (たとえば、ブラウザは、アドレス帳を検索して解釈できる場合にのみ、アドレス帳にアドレスを保存できます。また、見出しを正しくマークアップすると、Microsoft WordがTOCを作成して自動的に更新できることを知っているかもしれません。 。)
  • 後でスタイルを変更する方がはるかに簡単です。 (860ページのドキュメントのすべての第3レベルの見出しの色を変更する場合は、スタイルシートの1行を変更できます。コンテンツとプレゼンテーションが混在している場合は、ドキュメント全体を手動で確認する必要があります。 。そしておそらくあなたはおそらく1つか2つの見出しを見逃して、文書を専門外に見せることになるでしょう。)
  • 状況に応じて異なるスタイルシートを使用できます(ドキュメントは画面に表示されているか、紙に印刷されていますか?)。エンドユーザーに自分でスタイルを選択させることもできます。 (私のウェブサイトでは、いくつかの代替スタイルシートを提供しています。IEおよびFFでは、[表示]メニューを使用してこれらを変更します。)

つまり、ibHTMLタグプレゼンテーションを懸念していたため、廃止されましたが、これはまったく間違っています。

HTML5内

HTML5では、ibは廃止されなくなりました。代わりに、セマンティックな意味が与えられます。ですから、彼らは今や実際には意味論についてであり、表現についてではありません。

以前と同様に、emを使用して強調をマークアップします:「猫ismine」ただし、印刷物でイタリックを使用する他のほとんどすべての場合には、iを使用します。例えば:

  • iを使用して、分類指定をマークアップします:「私はR。norvegicusが好きです。」
  • iを使用して、周囲のテキストと比較して別の言語でフレーズをマークアップします:Àla carte
  • Word自体について話すときは、iを使用してWordをマークアップします。「drinkは名詞でも動詞でもあります」

class属性を使用して正確な使用法を指定することもお勧めです(Googleの「microformat」と「microdata」も)。そしてもちろん、2番目のケースでは、実際にlang属性を使用して正しい言語を指定する必要があります。 (それ以外の場合、たとえばの場合、音声合成エージェントはテキストの発音を誤る可能性があります。)

1年ほど前、HTML5仕様では、citeを使用して、本、映画、オペラ、絵画などの名前をマークアップする必要があるとも述べています。

  • Nymphomaniacをどう思いますか?

最後に、ずっと昔から、dfnは、テキスト内の句の定義インスタンスをマークアップするために使用されています(数学的な定義や用語の定義など):

  • groupは、単一の2項演算*を備えたセットXです...

したがって、印刷された本のイタリック体は、さまざまな意味を持つ可能性がありますが、4つの異なるHTML5タグで表されます。これは、先ほど説明したように、セマンティクスが優れているため、非常に優れています。 (たとえば、ブラウザにテキスト内のすべての定義のリストを作成するように依頼することができるので、試験の前にそれらすべてを確実に知ることができます。)

strongbに目を向けると、HTML5仕様では、strongを使用して、警告や非常に重要なテキストなど、テキストの重要な部分をマークアップする必要があります文中のWordを捕まえる。一方、bは、キーワードなど、テキスト内で見つけやすくする必要があるものをマークアップするために使用する必要があります。リストアイテム(LI)の見出しとしてbも使用しています。

139

Dovalが言うように、それらは非推奨ではありません。それらは まだ存在します ですが、多くの人々がHTML5以前に使用していたものとは異なる方法で使用する必要があります。

それは「意味のある」htmlについてです。どのように見えるかではなく、それが何であるかを説明する必要があります。ブラウザまたは理論的には他の表示媒体(たとえば、視覚障害者向けの読書アプリ)は、正確に解釈する方法を決定できる必要があります。

これは、「赤」などのCSSクラス名を使用してはならず、ここで別の色を使用することの背後にある機能的なアイデアを説明するより説明的なクラスを使用するべきではない理由と似ています。あなたは後で緑が良いと決めるかもしれません(そして、多分「強い」ものは太字のテキストの代わりに赤い色を使って表示されるべきです)。または、色覚異常のユーザーが、色を他の手段で置き換える特別なブラウザ設定を持っている場合があります。

58

本当の話は、biは、さまざまなHTML5ドラフト(大まかに言えば)で「プレゼンテーション用」として廃止、非推奨、呪われ、分析されたが、その後、これらのタグは広く多くのオーサリングプログラムで使用および生成されます。単純にそれらを許可する代わりに、要素を許可できるようにするために、彼らは彼らのために不自然な新しい「セマンティック」定義を開発しましたが、それでも「プレゼンテーション」マークアップについて厳格なふりをしています。新しい定義はドラフトごとに異なり、あいまいです。それらを同じように理解して解釈する2人の人を見つけることはほとんどできません。

申し訳ありませんが、参照はありません。上記の説明は、変更点をたどり、ドラフトとディスカッションを読んだ結果です。彼らは原因を明確に伝えていません。私はまだそれが本当の話だと思います。

結論は次のとおりです。ここでは何も役に立ちません。 b要素とi要素は、常に同じように機能します。通常の警告に従って、フォントをそれぞれ太字または斜体にします。これは考慮に入れるべき現実であり、ブラウザ、検索エンジン、またはその他のソフトウェアに影響を与えない準学問的な「セマンティクス」ではありません。

41

<b>タグと<i>タグは、「太字」と「斜体」の概念に基づいて作成されました。問題は、これらが一部のユーザーエージェントにとって完全に無意味である可能性があることです。たとえば、目の不自由な人のためのスクリーンリーダーでは、「イタリック」はどのように聞こえますか?

それらを<strong>および<em>に置き換えることで、印刷上の概念への直接リンクを削除しました。代わりに、ユーザーエージェントは適切だと思われる場合でもそれらをレンダリングできます。

11
Simon B

<b>タグと<i>タグは、文字どおり「太字」または「斜体」のテキストが必要な場合に不可欠です。

イタリック体のHTMLで方程式を書いている場合 ' 'は、イタリック体でない' I 'とは意味が異なります。その区別ができることが重要です。

<sup>または<sub>タグと同じようにそれらを考えます。このような「外観」タグを使わないと、方程式の意味を正しく表すことができません。

純粋なアプローチは、MathMLまたはTeXを使用することですが、ブラウザーのサポートはまだありません...

8
SAL

HTMLタグの基礎となる設計原則は、タグが「セマンティック」である必要があることです。つまり、低レベルの指示ではなく、意味と意図を示す必要があります。

古典的なテストは、「視覚障害者向けのブラウザでタグを有意義に使用できるか」というものです。

したがって、オーディオベースのブラウザでは、イタリックの音声を使用できないため、イタリックの「i」はほとんど役に立ちません。ただし、「em」タグは、ピッチを上げる、音量を上げる、アクセントを変更するなど、さまざまな方法でフレーズを強調できるため、意味があります。点字レンダラーは、ドットの間隔を変更したり、サイズを変更したり、振動を追加したりすることで強調できます。

0
James Anderson