昨年の夏、私は完全なHTML5仕様、以前のすべてのHTML仕様(放棄されたものも含む)、見つけられるすべてのCSS仕様、および多くのXML仕様を読みました。私は意味的に豊富なハイパーテキストドキュメントが大好きなので、HTML5の関連するHTMLセマンティクスの背後にあるアイデアを説明しましょう。
HTML5の前
HTML5の前に、i
そしてb
ファッションの外に確かでした。理由は、それらは本質的にそれぞれem
とのようstrong
に機能するが、セマンティクスではなくプレゼンテーションに焦点を当てているためです(これは悪いことです)。
確かに、i
テキストは斜体にする必要があることを意味しました(テキストを画面上でどのようにレンダリングするかについて何かを言いました)。他方でem
は、テキストが強調されることを意味しました(テキストのセマンティクスについて何か言った)。
ここには重要な理論上の違いがあります。を使用するem
場合、ユーザーエージェント(ブラウザ)はテキストを強調する必要があることを知っているので、ドキュメントが画面上に表示される場合は斜体で表示できます(書式設定が不可能な場合はすべて大文字、または場合によっては太字でも)ユーザーはそれを好む)、ドキュメントがユーザーに話しかけられている場合など、異なる発音をすることができます。
強調は本当にセマンティクスについてであることに注意してください。たとえば、フレーズ
- 猫は私のものです。(=犬ではありません!)
- 猫は私のものです。(=あなたのものではありません!)
同じ意味を持ちません。
同じ違いがb
(太字フォント)とstrong
(強い強調)に適用されます。
デジタルライティング全般、特にハイパーテキストオーサリングの一般原則は、コンテンツとスタイルを分離することです。ハイパーテキストオーサリングでは、これはコンテンツがHTMLファイルにあり、スタイルがCSSファイル(またはいくつかのCSSファイル)にあることを意味します。異なるが関連する原則は、ドキュメントがセマンティクス(ヘッダー、フッター、リスト、強調、アドレス、ナビゲーションエリアなどのマークアップなど)に富んでいる必要があるということです。これには多くの利点があります。
- コンピュータプログラムがドキュメントを解釈するのははるかに簡単です。これらのプログラムには、ブラウザ、テキスト読み上げアプリケーション、検索エンジン、デジタルアシスタントが含まれます。(たとえば、アドレス帳を見つけて解釈できる場合にのみ、アドレス帳にアドレスを保存できます。また、見出しを正しくマークアップすると、Microsoft Wordが目次を作成して自動的に更新できることをご存知かもしれません)
- 後でスタイルを変更する方がはるかに簡単です。(860ページのドキュメントのすべての第3レベルの見出しの色を変更する場合は、スタイルシートの1行を変更できます。コンテンツとプレゼンテーションが混在している場合は、ドキュメント全体を手動で確認する必要があります。 。また、見出しが1つまたは2つ欠落していると、ドキュメントが専門的でないように見える可能性があります。
- 状況に応じて異なるスタイルシートを使用できます(ドキュメントは画面に表示されますか、それとも紙に印刷されますか?)。エンドユーザーが自分でスタイルを選択できるようにすることもできます。(私のWebサイトでは、多数の代替スタイルシートを提供しています。IEおよびFFでは、[表示]メニューを使用してこれらを変更します。)
だから、要するに、i
そしてb
彼らがいたので、廃止されたHTMLタグを懸念プレゼンテーション完全に間違っています、。
HTML5で
HTML5 i
でb
廃止されなくなりました。代わりに、セマンティックな意味が与えられます。したがって、実際にはセマンティクスに関するものであり、プレゼンテーションに関するものではありません。
前と同じように、em
強調は「猫は私のものです」とマークアップするために使用します。しかしi
、印刷物で斜体を使用する他のほとんどすべての場合に使用します。例えば:
i
分類学的指定をマークアップするために使用します:「私はR. norvegicusが好きです。」
i
周囲のテキストとは異なる言語でフレーズをマークアップするために使用します:Àla carte
i
単語自体について話すとき、単語をマークアップするために使用します:「飲み物は名詞でもあり動詞でもあります」
class
属性を使用して正確な使用法を指定することもお勧めします(Googleの「microformat」と「microdata」も)。そしてもちろん、2番目のケースでは、lang
属性を使用して正しい言語を指定する必要があります。(それ以外の場合、たとえば、音声合成エージェントがテキストを読み違える可能性があります。)
1年ほど前、HTML5仕様cite
では、書籍、映画、オペラ、絵画などの名前をマークアップするために使用する必要があるとも述べています。
最後に、ずっと前から、dfn
テキスト内のフレーズの定義インスタンスをマークアップするために使用されます(数学的な定義や用語の定義など)。
- グループは、このようなこと*単一のバイナリ操作を装備した集合Xで...
したがって、印刷された本のイタリック体(多くの異なるものを意味する可能性があります)は、4つの異なるHTML5タグで表されます。(たとえば、テキスト内のすべての定義のリストを作成するようにブラウザーに依頼できるため、試験前にすべての定義を確実に把握できます。)
とに目を向けるstrong
とb
、HTML5仕様ではstrong
、警告や文中の非常に重要なキャッチワードなど、テキストの重要な部分をマークアップするために使用する必要があります。一方、b
キーワードなど、テキスト内で簡単に見つける必要があるものをマークアップするために使用する必要があります。b
リストアイテム(LI)の見出しとしても使用します。
<b>
して<i>
おり、廃止されていません。