強調する
ここでは強調を表すタグについて説明していきます。
使用する要素はem要素、strong要素、b要素の3つになります。強調する対象によって使用するタグが変わるため、それぞれの使い方を解説していきます。
<em>
em要素は強調を表し、文章にある必要性があるテキストなどに使用します。そのため使用する箇所によって少し意味合いが変わるような使い方が適切といえるでしょう。例えば下の例でいうと、焼肉という単語が強調されています。これを明日という単語を強調した場合、明日食べたいのだなと少し意味合いが変化します。
さらに強い強調をする場合は下の<strong>を使用します。
要素 | 解説 |
<em> | 意味合いの変わる強調 |
<p>明日は<em>焼き肉</em>が食べたいですね。</p>
ブラウザ表示例
明日は焼き肉が食べたいですね。
<strong>
strong要素は重要性や、注意を表す強調として使用されます。上のem要素よりも強い強調を表すタグです。また、strong要素を使用して意味合いが変化することは無いためem要素に比べて自由度は高いといえます。しかし、最近ではSEO対策のために過度にstrong要素を使用してGoogleからペナルティを受けてしまうこともあるようなので、使用頻度には気をつけましょう。
要素 | 解説 |
<strong> | 強い重要性を表す強調 |
<p>強い重要性を表すタグとして<strong><strong></strong>を使用します。</p>
ブラウザ表示例
強い重要性を表すタグとして<strong>を使用します。
<b>
b要素は強い重要性も、意味合いが変わることもありませんが、他のテキストと区別をしたい箇所に使用します。例えば文章と商品名、文章と地名などを区別する場合です。
要素 | 解説 |
<b> | 他と区別する強調 |
<p>昨日食べた<b>まろやかプリン</b>は本当にオススメです!</p>
ブラウザ表示例
昨日食べたまろやかプリンは本当にオススメです!
HTML文字 関連記事
- 改行・段落・区切り … <p>,<br>,<hr>
- <pre>を使ってコードを表す … <pre>
- 特殊文字一覧
- ルビをつける … <ruby>,<rt>
- 上付き文字・下付き文字 … <sub>,<sup>
- テキストの意味に適切なタグ … <i>,<u>,<small>
- コメントアウト … <!-- -->
- 定義語・省略語 … <dfn>,<abbr>
- 強調する … <em>,<strong>,<b>
- 引用した文章や単語を表す … <cite>,<q>,<blockquote>,<mark>
- 画像を表示する … <img>
- <div>でコンテンツをグループ化 … <div>
- <span>でテキストを区別する … <span>