非天マザー by B-CHAN

iPhoneの使い方、IT、ビジネス、金融、経済、不動産、保険、音楽、映画、ニュース、自己啓発その他。

ブログの勉強で感心したCSSという発明

ブログを書く言語 

HTML

 

 

前回の記事はエイプリルフールネタでした。

懸命にスワイプした人、ごめんね〜。

 

というわけで本題。

 

ブログを書くだけなら、文章を書くスキルだけでOKです。

しかし、アクセス数を増やすために、デザインやレイアウトを変えたりするには、少し専門的な知識が必要になります。

そう、HTML(ハイパー・テキスト・マークアップ・ランゲージ)とCSS(カスケーディング・スタイル・シート)ですね。

 

ボクは幸運にして、インターネットの過渡期に生きています。

ボクより上の世代の人たちは、かなり年配になってからインターネットが登場したため、四苦八苦している人が多いです。もちろん得意な人もいます。

ボクより下の世代の人たちは、物心ついたときからインターネットは当たり前に存在します。

ボクの世代は、インターネットの無い環境で生まれ育ち、大人になってからインターネットが登場しました。

つまり、インターネットの無い世界とある世界の両方を十分経験しています。

なので、HTMLの変遷も経験しています(興味のある人なら)。

 

HTML中心の時代

 

ほんの一昔前は、ホームページはHTMLで書いていました。

例えば、

 

<p>こんにちは、今日は快晴です。</p>

 

という文章の、快晴だけ文字サイズを変える場合は、

 

<p>こんにちは、今日は<font size="5">快晴</font>です。</p>

 

というふうに、HTMLタグで文字サイズを指定していました。

つまり、文章の内容と、そのビジュアルの両方をHTMLが担っていたわけです。

 

しかし、その方法だと、不都合があります。

例えば、文章に複数の見出しがあるケース。

見出しとは、こういうのです。

見出しだよ〜

 

もし見出しが1箇所だけなら、その見出しを、

 

<h1>見出しだよ〜</h1>

 

と書けば済みます。

 

CSSの普及

 

しかし見出しが複数だったらどうでしょう。

このブログなんて過去の記事の見出しを数えたら、おそらく数千か所あります。

それらの見出しの文字の大きさや色をいっせいに変更したい場合、さっきのHTMLでのやり方だと、数千か所を全部変更する必要がありますよね。

例えば、今は見出しの文字の色はピンク色ですが、これをすべて青色に統一したいと思った場合。

ブログに存在するすべての<h1>タグをひとつひとつ修正するわけにはいきません。

そこで登場するのがCSSなんですね。

 

あらかじめ、CSSに、

 

h1{ color:pink;}

 

と書いておけば、ブログ内のすべての<h1>タグ、つまり見出しがピンク色になります。

ということは、

 

h1{ color:blue;}

 

と変更すれば、すべての見出しがいっせいに青色になるわけです。

 

HTMLはあくまでも文書の論理的構造を表すもの。

つまり、どれが見出しで、どれが本文で、と示すわけです。

一方、ビジュアルに関してはCSSがその役割を担う。

そうすることで、ホームページ作成の

  • 簡便性
  • 即時性
  • 可読性

が飛躍的に向上しました。

HTMLの時代から、HTML+CSSの時代へ。

この変遷をリアルタイムに観てきたボクは素直に感動しました。

なるほど、頭の良い人たちはうまいこと考えるなあ、と。

 

WEB業界の人にとっては当たり前かもしれない話をおおげさに書いてスミマセン。

 

発明とは

 

しかし、よく考えれば、この画期的な発明は、HTMLだけでは不便なために、それを解消するために生まれたんですね。

 

必要は発明の母。

発明は不便を解消するために生まれる。

 

なるほど。

 

みなさん、日常生活で普段は見過ごしてしまっている不便はありませんか?

きっとそこから新しい発明が生まれますよ。

 

www.b-chan.jp