HTML初心者こそスタイルシートを覚えるべき理由

WEBページを作成するときには、まずHTMLで記述していきます。

初心者ならこのHTMLから覚えていくことになりますが、HTMLタグだけではWebデザインやページのレイアウトに限界があります。そこで登場するのがCSSスタイルシートです。

「やっとHTMLを理解したのにまだ覚えるものがあるのか!」という気持ちになり、HTMLタグだけでレイアウトを何とかしてしまいたいという人も多いかと思います。例えば、ページを左右に分割するだけならtableタグでもできますし、手っ取り早く行間を空けたいならbrタグをいくつも入れれば済む話でもあります。

スタイルシートは、やっと覚えたHTMLとは記述の方法が違うので、初心者はつい敬遠してしまいがちです。そして、HTMLだけで何ページも作ってすっかり慣れてきた頃に、やっとスタイルシートに着手することが多いのです。

ところが、その時には激しく後悔することになります。

スタイルシートを初期から導入すべき理由

スタイルシートとはそもそもなんでしょうか。

スタイルシートはHTMLとは別のCSSファイルという、ページの各要素の見た目を定義するファイルのことを指します。各HTMLの冒頭にこのCSSファイルを見に行くように1行だけ追加しておけば、CSSに書いたスタイルが全部のHTMLに反映されます。

Webサイトは、どのページも統一されたWebデザインにすることがほとんどです。

新しいHTMLページを書くたびに、レイアウトが同じになるようにHTMLタグを書くのは大変です。その点、スタイルシートは外部のCSSファイルに一度書いておくと他のページにも使い回しが効くので、最終的には楽になります。

特に作ったあとに大きな変更する場合など、100枚のHTMLでデザインを直すより、1枚のCSSを直すほうがはるかに楽ですよね。

まとめ

HTMLを覚えて、CSSはまだ、という方はもう一頑張りしてスタイルシートまで手を伸ばすとよいでしょう。記念すべき最初の1ページ目から、スタイルシートの活用しておくのが最終的に楽です。


Welcome to UX MILK

UX MILKはより良いサービスやプロダクトを作りたい人のためのメディアです。

このサイトについて