初心者さんが抑えておくべきCSS基礎知識

実は、ホームページ制作には、HTMLだけでなく、もう1つ重要な要素があるんです(笑)

それが、HTMLとは別の言語、CSSと呼ばれる文章です。はい、笑えませんよね…。

あんな暗号みたいなのが、もう一つあるのかよ！って衝撃を受けている方も少なくないと思いますが、残念ながら事実。

まずは論より証拠ってことで、HTMLの時と同様に、当サイトで実際に使用している CSSをご覧いただきたいと思います。

当サイトのCSS全部見るには、こちらをクリックしてもらうと、新規のタブが表示されて見ることができますが、全部みるのは精神的に辛いって方に、ほんの一部ですが抜粋しましたので、ご覧ください。

html,
body {
	height: 100%;
}

body {
	min-width: 320px;
	word-wrap: break-word;
	background-color: #fafafa;
}

body.mceContentBody {
	background-color: #fff;
}

.st-hide {
	display:none;
}

hr.hrcss {
	border: 0;
	height: 0;
	border-top: 1px solid rgba(0, 0, 0, 0.1);
	border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.post h4 .point-in i,
.n-entry i,
.p-entry i{
margin-right:5px;
}

安心してもらいたいから、初めから結論をお伝えしておくと、CSSもホームページ作成ソフトがやってくれるぞ！

でも、本来であれば、HTML同様に、CSSも自分で書かなくちゃいけないんだ。

CSSは、ホームページの装飾指示書。

これって… もしかして記述ルールが違うんじゃ？

って、感じとった社長さんは… かなり鋭いです！
 
大変残念なことではございますが、包み隠さずお伝えしますと、このCSSは、HTMLとは全く異なる文章でして… 当然のことながら、基本的な記述ルールは全く異ります。

で、肝心のCSSってのは、何をするモノかと言いますと…

ホームページの装飾や、レイアウトを制御する言語なんです。

家で例えると、構造や、骨組み部分は HTMLで表現され、CSSは、家の外壁の色や、窓の大きさ、家具のレイアウトなどを担当しています。

つまり、ホームページの装飾指示書であり、ホームページがオシャレになるか否かは、このCSSにかかっているといっても過言じゃありません。

CSSの効果を見てみよう！

で、そのCSSを実際に使うと、どんなことができるのかと言いますと、

文字を大きくしたり、

小さくしたり、

赤くしたり、

黄色いマーカーを引いてみたり…

こんな吹き出しを作ってみたり

このように、色や、形、レイアウトなどをコントロールし、ホームページのデザインを担当しているんです。
 
つまり、ホームページは、HTMLという設計書を元に作られた骨格に、CSSという装飾指示書に従って色を塗られ、できあがってるんです。

CSSもホームページ作成ソフトに丸投げを推奨します。

ディースケが、3万円払ってでもホームページ作成ソフトに投資すべきと言う理由… ご理解頂けたでしょうか？

HTMLを勉強して、次に、CSSも覚えて…

なんて事してたら、ホームページが完成するのに何年かかるか分かりません(笑)

仮に、アナタがCSSを勉強して、文字の色を赤くするのに成功したり、グレーのボックスを作れたとしても、それで、集客アップが見込めるかと言えば、答えは NO。

だから、CSSなんて、ホームページ作成ソフトに、お任せしちゃうのがベスト！

無料ブログを利用したことがあるならイメージし易いと思いますが、ホームページ作成ソフトを使えば、文字を大きくするのも、赤くするのもボタン一発。あんな、暗号みたいな奇怪な文章を覚える必要は全くありませんので(笑)

全てを、自分でやろうとするには、ホームページ制作に求められる知識は、あまりにも広範囲過ぎます。

自分がやるべきことと、自分がやるべきでないことを明確にする。

これは、初心者さんが挫折しないためにも、とっても重要なことだと思っています。

面倒なHTMLも、CSSも、3万円の投資で解決、アナタは、SEOに注力すべきと、ディースケは考えています。

次の講座は、独自ドメインについてです！

ホームページ作成ソフトと同じく、集客ホームページを作るためには欠かせないアイテムなんだ！