2008/11/07
スタイルシートについて
ここに来て、急に寒くなり 我が家では、こたつを出しました。 職場では、薪ストーブを使っているのですが 今年の初めは、煙突が詰まってしまい大変でした。 煙突が、詰まると、なかなか燃えなくて 室内に、煙が充満した事も何度かあります。 炎が見えなくなったので消えたのかな？ と思っていたら、ストーブ内に充満していた煙に 火がついて、 ボン！ と爆発して、煙がストーブから飛び出て もやもやと立ち上ってる様子はなんか面白かったです 爆発と言っても、煙の爆発なので、そんなに激しくありません ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ スタイルシートについて ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ 前回の、メルマガで、タイトルについて私のページも 変更しましたが、その時、Yahoo!では1位、Googleは6位だった 順位が、変わりました。 なんと3位です。！！！ 自分でも、この効果にびっくりして、他のページも一部見直しました でも、今は7位になっています？？？ タイトルのみで、順位は上がりませんが、必要なポイントであることは 変わりません、地道に作業をしましょう。 今回は、アルゴリズムが替わった事が原因かなと思っています。 アルゴリズムとは、検索エンジン（Yahoo!やGOOGLE）が 順位を決める、基準になっています。 その中の1つに、タイトルの付け方があります。 他に、キーワードについて、どのくらい記事が書かれているかや 外部から、何件リンクされているかなど、様々な条件を 組み合わせて、順位が決まっています。 Yahoo!が、このアルゴリズムを毎月変更しています。 なので、上がったから、下がったからと言って そのたびに、対策を変更すると逆効果になります。 地道に、良いとされている事を、続ける事が一番の近道です。 ここで、ようやく今日の本題に入ります。 あなたは、スタイルシートを知っていますか？ ホームページの書式と言ったらHTMLですよね 普段、見ているホームページは、HTMLで書かれている 呪文のような物を、ブラウザー（インターネットエクスプローラー、 ファイヤーフォックス、オペラ）などホームエージを見るときに使う ソフトが、自動的に変換して見る事が出来ます。 普通の書面と違うのは、クリックすると違うページが開いたり しますが、これはHTMLでここをクリックしたら、このページを 開いてください。といった文章が入っているからです。 スタイルシートは、ホームページのこれからの書式になります。 昔、フレームでレイアウトしていた頃があります。 未だに、ホームページビルダーでは、フレームのページ作りを 誘導していますが、一番のメリットは、作りやすい事です。 ただ、検索エンジンには、不利なのでおすすめしません。 次に、テーブルでレイアウトする方法が、一般的になりました。 私も、一部はテーブルでレイアウトしています。 作り方が、簡単で、デザインしやすいです。 ただ、この方法も、すべてをテーブルで作った場合、余計なタグ <TD> <TABLE border="0" cellspacing="0" cellpadding="2"> <TBODY> などの、呪文が大量に、ソースに書き込まれます。 そのため、検索エンジンでは不利です。 では、スタイルシートは何をするかと言うと 余計な呪文をすべて別のページに書き込んで ページ内の、呪文がすごく少なくなります。 オッケイの呪文のページは http://www.kiruharu.com/style.css 上記にあります。 普通に、見るデーターではありませんので、 対応したソフトがないと見れないかもしれません。 一部をコピーするとこんな事が書いてあります。 .blue { color: #0000FF; } 私も、ソフト任せで作っているので、書き方まではわかりませんが 上記の意味は 「blue」と指定してあったら #0000FFこの色に すると、書いてあります。これの一番のメリットは、デザインが 統一出来る事です。今までは、1カ所1カ所色を指定していたと思いますが ここは青と指定していて、後から好きな青場合によっては赤にしても すべてを同じ色に変更できます。 私は、この機能を使って時々ページの色合いを変更しています。 ページ全体と言っても作業は1カ所です。 他の色指定をした場所の数カ所を変更することにより、イメージが がらっと変わります。 他にも、トップの画像を変更したりすることも1カ所の変更で作業が終わります。 数ページの変更の必要がありません。 もう１つの例を紹介します。 #header h1 { font-size: 16px; font-style: normal; color: #FFFFFF; font-weight: bold; margin: 0px; padding: 15px; } 上記は、header の h1 についての記述です。 ヘッダーのH1とは、私のページの場合一番上に、書き込まれている 文字のです。 h1とは大見出し<h1>文章</h1> の事です。普通大見出しを使った場合異常に大きな文字で ダサダサのページになりますが、スタイルシートを使うと font-size: 16px; 大きさは、１６ピクセル ピクセルは、よく使う単位ですが、わからなくても良いです。 見た目で、大きいと思えば１２にすれば良いし、小さいと思えば 数字を大きくすれば良いです。 重要なのは、大見出しなのに、好きな大きさに変更出来る事です。 これは、すごい事です。 私は、この事に感動して2ヶ月位、スタイルシートの勉強して スタイルシートを使いページを作りました。 また次回も、お楽しみに。 ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿ ご意見、ご感想お待ちしています。 感想などありましたら、下記のアドレスから送ってください。 http://form.mag2.com/geathiamau 沖野彫刻 沖野 兼一 ＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿＿
