■CSSの基礎知識

CSSとは、Cascading Style Sheetsの略です。
HTMLが部品であれば、CSSはその部品の色や大きさ、配置する場所を決める仕様書のようなものです。

HTMLで指定できることと、CSSで指定できることというのは重なってくる部分も多いです。
例えば、HTMLで文字の色や大きさなどを指定することもできますが、全てHTMLで指定すると、それだけサイト全体のHTMLが増えてしまいます。

すっきりしたHTMLを作ることはSEO的にも有利と言われていますし、また、HTMLで変更した文字の色や大きさを全て別のものに変えようとすると、また全てのHTMLを見直さないといけません。

トップページ、個別ページ、カテゴリアーカイブ、月別アーカイブ。
全てHTMLで文字の色や大きさの変更などをしていると、元に戻す時に大変な労力になってしまいます。
再構築の時間もバカになりません。

ところが、文字の色や大きさをCSSで指定していると、CSSは全てのページに適応される仕様書ですから、CSSを変更し、CSSだけ再構築するだけで、全てのページの文字の色や大きさを変更することができます。

ですが、CSSだけが良い、HTMLだけが良い、というわけではなく、
適材適所でCSSとHTMLの使い分けが重要ということになります。



HTMLを変更するときは、ライブドアブログでは
「ブログの設定/管理」→「デザインの設定」→「custom（カスタマイズ）」→「CSS」と進んで変更します。



変更する際には、バックアップをお忘れなく。



実際にＣＳＳをカスタマイズしてみましょう。
まずは、文字の色や、フォントの種類、文字の色、について以下のページを参考に変更してみてください。

• フォントのサイズ - font-sizeについて
• フォントの種類 - font-familyについて
• 文字の色 - colorについて

特に、文字の大きさについては、変更した方が良い場合があります。

フォントのサイズ でも触れてありますが、「Ｆｉｒｅｆox」で見たfont-sizeのxx-smallは、かなり見づらいものがあります。

Firefoxとは、インターネットエクスプローラーのようないわゆるウェブブラウザで、かなりシェアを伸ばしてきています。１０％くらいはシェアがあるとか。これは無視できない存在になっています。

できれば実際にダウンロードし、自分のサイトの見え方を確認してみてください。
Firefox


fontのサイズは数値指定と相対指定があります。
フォントのサイズではpxでの数値指定を中心に解説してあり、この指定の仕方の場合、ブラウザで文字の大きさを変更したりしていても、表示が崩れない、という利点があります。

また、相対指定だと大きさをパーセントで指定したり、フォントの高さを1emとした指定の仕方もあります。

■例■
font-size: 80%;
font-size: 100%;
font-size: 120%;
font-size: 0.8em;
font-size: 1em;
font-size: 1.2em;　など

これらの指定の仕方だとブラウザで文字の大きさを変更したりしている場合、特に文字が見えにくい方が文字を大きく表示する設定にされている場合、文字の大きさは全体的に大きくなりますが、その際サイト全体の表示が崩れる可能性があります。

どちらか好きな方で指定してみてください。


サイトにあわせたフォントの種類、色合いも選ばれてみてください。

CSSを変更したらCSSを保存し、CSSの再構築を行ってみてください。