html - css スタイルシートによる画像 alt 属性

Question

方法 1:

伝統的に、次のような画像を含めます。

<img src="image.png" alt="image" />

そして、alt attribute2つの理由で彼らの中にいるでしょう:

1. 画像で訪問者を助ける
2. SEOの目的。そのため、ボットとクローラーは画像が何であるか、つまりキーワードを認識しています。

方法 2:

ただし、css スタイル シートを介して画像を含める場合:

HTML

<div class="image"></div>

CSS

.image {
background-image: url(images/products_partitioning.png);
}

SEOの目的で、「方法1」、「方法2」に見られるように、alt属性を含める方法はありますか。

Answer 1

いいえ。

画像が背景画像である場合、代替コンテンツを持つことは意味がありません (定義上、コンテンツではないため)。

<img>画像が背景画像でない場合は、 CSS ではなく要素を介して含める必要があります。

（要素に実際のコンテンツを持ち、その要素に背景画像と一緒に固定サイズを設定するハックがありますが、それはtext-indent: -9999px醜くて意味がありません（また、あなたが求めたものの逆です））。