背景色と文字色が同色だと検索エンジンスパム?
検索エンジンは、スパム対策をいろいろ行っています。 「ブラウザ上では見えないけど(色情報が無関係である)検索エンジンには読める文字」(=隠し文字)は、 代表的な検索エンジンスパムです。 この「隠し文字」は、検索エンジンからかなり嫌われます。
※検索件数の高そうなキーワードを隠し文字で列挙しておくことで、無関係な検索キーワードでの検索結果にもヒットさせられます。 これを許すと、正しい検索結果が表示できなくなるため、検索エンジンはこの方法を嫌います。
先ほどのソースは、人間にも問題なく読めるデザインなので、検索エンジンスパムとはいえません。
しかし、スタイルシートを読まなければ、背景色と文字色が同色なために「読めない文字」になってしまいます。 検索エンジンは、おそらくこの記述を「隠し文字」だと判断してしまうでしょう。 つまり、検索エンジンスパムだと解釈されてしまう可能性があります。
スパムだと判定されてしまうと、検索結果の表示から除外されたり、除外されなくても上位には表示されなくなったり、 様々なペナルティが課せられてしまいます。 せっかく作ったページが、そのような誤解を受けるのはイヤですよね。
デザインはスタイルシートのみで
そう誤判定されないように、デザインはすべてスタイルシートで行っておきましょう。
冒頭のソースの問題点は、次のようにデザインをすべてスタイルシートで記述することで解決できます。 (しかも、ソースは短くなっています。)
div.samplebox {
background-color: green; color: white;
}
<div class="samplebox">
全部スタイルシートでデザイン
</div>
ブラウザ上での表示は、先ほどのソースとまったく同じです。 しかし、こちらは背景色と文字色の両方をスタイルシートで指定しているため、スタイルシートを無視しても、文字はちゃんと読めます。