サイト制作

HTMLのmarkとstrongはどう違う？検索の目印と重要な文章を分ける

慈愛妃きづな

2026-11-07

この記事には広告・アフィリエイトリンクが含まれます。

色を付けたいからmark、太字にしたいからstrong、と選ぶ前に。文脈との関連性と重要性という役割の違いを確認します。

markは、今の文脈で見つけてほしい部分

サイト内で言葉を検索したとき、結果の文章の中で一致した語が目立つと探しやすくなります。こうした、今の目的に関連する部分を示すのがmark要素の使い方の一つです。文章全体で最も重要というより、今ここを見ると役に立つ、という意味になります。

引用文の中で注目してほしい箇所に目印を付ける場合にも使えます。ただし、引用元が強調していた部分と、紹介する側が追加した目印は区別できる説明を添えたいですね。

strong要素が表すのは、内容の重要性や緊急性などです。検索に一致しただけの語と、必ず確認してほしい重要な注意は、同じ意味ではありません。標準の見た目が黄色や太字だからという理由だけで選ばず、文章での役割を先に決めましょう。

単にブランドカラーを付ける装飾や、プログラムの構文を色分けする目的なら、markを大量に並べる使い方とは分けて考えます。見た目の調整はCSSで行えます。

markの存在は、多くのスクリーンリーダーで標準では読み上げられません。黄色い部分だけを見ればわかる、という説明には頼らず、検索語や注目する理由を文章でも示しましょう。

確認するときは、色を変えた場所の数だけでなく、どこに注目すればよいかが読み手に伝わるかを見ます。目印を少なく絞ると、本文も追いやすくなります。