CSS « ウェブデザイナー的ホームページ制作最適化

‘CSS’ タグのついている投稿

CSSのクラス名でSEO対策しよう！！

2008 年 12 月 10 日 by admin

このタイトルを見て、「スタイルシートでSEO対策なんてできないでしょ！？」と思っている人も多いはず。でも、ちゃんと、Yahoo!検索 インフォセンターで、アナウンスもしている方法なので、是非、SEOを極めたい方は必見です！！

まずこのCSSでSEO対策する目的は『ウェブページ内の重要性の低い要素を検索エンジンに通知する為』です。

もう少し詳しく言うと、ヘッダーやフッダーなどは、基本的には、サイト内へのナビゲーションであることが多い為、ページ内のコンテンツに対する重要性が高くない場合が多いと思います。そこで、ページのコンテンツに対する重要性が低いものをYSTに知らせることができます。そのYSTに知らせる時に、CSSを使います。

実際に使う場合には、HTMLタグ（div、spanなど）にclass=”robots-nocontent”属性を指定します。

<div class="robots-nocontent">～</div>
<span class="robots-nocontent">～</span>
<p class="robots-nocontent">～</p>

【情報引用】http://info.search.yahoo.co.jp/archives/002879.php

, , , , ,

CSS, SEO

コメントは受け付けていません。

CSSでリストのマークを画像にする

2008 年 9 月 4 日 by admin

CSSでリストのマークを画像にするには、CSSのlist-style-imageプロパティを使う。画像が何も無い場合は、何も指定していないものと同様に、黒丸マークが表示されます。

<ul style="list-style-image:url('star.gif');">
<li>リスト１</li>
<li>リスト２</li>
<li>リスト３</li>
</ul>

,

CSS, 初心者向け

コメントは受け付けていません。

CSSで画像を一部だけしか表示させない！！

2008 年 9 月 1 日 by admin

CSSで画像の一部だけを表示させるには、CSSのclipプロパティを使います。何も指定が無ければ画像全体が表示されますが、CSSのclipプロパティを使うと、指定した部分を切り抜いて表示させることができます。
「rect(auto 50px 50px auto)」は、「rect(画像上端からの距離 画像右端からの距離 画像下端からの距離 画像左端からの距離)」って感じ。

<img style=”position:absolute;clip:rect(auto 50px 50px auto);” src=”http://design.web-nouhau.com/image/site/urawa-reds.jpg”>

▼切り抜き表示

▼指定なし表示

,

CSS

コメントは受け付けていません。