今更聞けないHTML&CSS講座第0回「HTMLとCSSって何？」

世の中には、大量のWebページがある。もちろん、今あなたが見ているこのページもその一つだ。

そのページだが、どういうふうに表示されているか知ってるだろうか？

気になったら、作ってみないか？

ｶﾝﾀﾝﾀﾞﾖ、ｺﾜｸﾅｲﾖ。

というわけ(?)で、HTMLとCSSというやつについて、これから講座という形で解説していこうと思う。

今回は、初回ということでそもそもこのHTMLとかCSSって何者なのかという部分について解説していく。

基本的には全部解説するが、初心者はここだけとか、ある程度知ってる人はここもとか、レベルによって解説の深さを分ける部分もある。自分に合った深さで勉強してほしい。

「HTML」って何？

HTMLとは、「HyperText Markup Language」の頭文字を取ったものだ。簡単に言うと、「書き方の決まりに則って、文章に意味を付加したもの」だ。例を出そう。

例えば、新聞。新聞には、まず新聞自体に「タイトル」、そして各記事に「見出し」がある。次に「概要」が続き、そのあとに「本文」が「段落」で書かれている。

HTMLも、このように各文章に「ここはタイトル」とか、「これは見出し」とか、「こっからここまでがひと段落」とか、色々な意味づけをしていくことができる。

そして、新聞では記事によって書き方が異なるが、HTMLの場合も見た目をカスタマイズして、それをブラウザで表示している、ということになる。

一つ注意して欲しいのだが、HTMLはあくまで文章に対する意味づけを行う、と考えて欲しい。確かに、HTMLだけでもある程度見た目に変化が起こるのだが、昨今ではほとんどがカスタマイズされている。ここはしっかり分離して考えた方が、メンテナンスする際にやりやすい。

で、この見た目をカスタマイズするのが、もう一つの解説対象「CSS」だ。

上にもちらっと書いたが、CSSとは「HTMLの見た目をカスタマイズする設定」にあたる。例えば、ページのタイトルは大文字かつ太字にして、この重要な部分は赤字にしてなどなど。

ちなみに、CSSは「Cascading Style Sheets」の略。これは、HTML文章の中にも書けるし、別ファイルとして外に出しておいて、HTMLで読み込むこともできる。もちろん、両方の方法を解説していく。

今回は導入ということで、そもそもHTMLやCSSとは何かについて説明した。

まずは、ここをしっかり押さえておいてほしい。

次回は、早速HTMLを書いていく。また、その際に使えるものも併せて紹介するつもりだ。CSSはHTMLの基礎が終わってから。

更新情報はTwitterでも呟いている。よかったら、ページ下部のTwitterアイコンから覗いていってほしい。

それでは。