実践向きのCSS

実践向きのCSSは、SEOに直接関係している訳ではありませんが、検索エンジンに最適となるWEBページ製作では必須となってくるでしょう。HTMLを文章構造を示すために使わなければならないとすると、必然的にデザインは全てCSSで指定する事になります。では実際にどのような使い方をするのが好ましいのでしょうか?

こちらで説明したのと同じように、『絶対にこうでなければならない』という決まりはありません。しかし、一般的に『スマートなやり方』には法則があるようですね。まずは【ブロック要素】と【インライン要素】をしっかりと理解する事がCSS上達のカギだと思います。

ブロック要素とインライン要素

簡単に説明すると、ブロック要素は『お弁当箱』で、インライン要素が『おかず』です。
HTMLでは<body></body>の間に直接『おかず』を置く事は行儀が悪いので禁止されています。そのため、最初にCSSで『お弁当箱』をどんな大きさで何処に置くかをある程度決めてしまってから『おかず』を詰め込んでいくのが『スマートなやり方』です。この方が作業効率も良いからです。

CSSサンプル

CSSについての詳しい説明や、サンプルソースなどはdigilog.CSSで取り扱っております。

CSSを使う事で<body>間のソースが軽くなり、結果的に検索ロボットに純粋な情報源となるテキストを効率良く知らせる事が出来ます。

SEOのためのCSS応用テクニック

text-indentを使ってキーワードを埋め込む

<h1 style=" text-indent: -9999px; background-img: url(#####);">
 キーワード
</h1>
この場合キーワードという文字列はこの要素の-9999pxの位置に隠れてしまいますので、視覚的には見えませんが文字列が存在している事は検索ロボットに認識されます。どうしてもサイトロゴの画像を見出しに配置したい時などに使われます。

※このようなテクニックを多用するとスパム行為であると判断されるかもしれません。あくまで応急処置などにお使い下さい。

その他のSEOテクニック≫

戻る