HTMLってそもそも、なぁに？

サイト制作に興味がある方なら聞いたことがあると思います「HTML」という言葉。

一体どういう意味なの？って感じている方も多いと思います。

絶対に知っておかないといけないワケではありませんが、まずはホームページを作る前に言葉の定義を押さえておきましょう。

簡単にイラストで表すと下のようになります。

HTML（Hyper Text Markup Language）は、カンタンに言えば、Webページを作るための記述言語のことです。

このHTMLを使用して文書を記載することで、様々な環境下にあるパソコンや携帯等の端末でWebページを見ることができるようになります。

その方法はシンプルで、文章を「タグ」で囲って（挟んで）あげるだけです。

この文章を「タグ」で挟むことを「マークアップ」と呼んだりします。

例えば、こんな感じですね。

<p>Pタグでマークアップ中です</p>

HTMLの一番大きな特徴は、作成した文章に対して、上のようなタグを用いてマークアップすることで、文書に見出しや段落を付けることです。

ワード等で、文字の大きさや太さを変えて視覚的に見出しや段落分けをしていくのと同じですね。

同じようなことをHTMLという言語では、それぞれタグを使って行うわけですね。

この文章は見出しだよーっていうことにしたいときは、見出し用のタグを使ってその文章を囲ってあげれば、それで作業は完了です。

例えば、この記事のタイトルは「HTMLってそもそも、なぁに？」なので、

<h2>HTMLってそもそも、なぁに？</h2>

と記事の始まりに記載してあります。

上のタグは見出しを表すタグですが、簡単に言うと

<h1>見出し</h1>

<h2>見出し</h2>

<h3>見出し</h3>

<h4>見出し</h4>

と数字の少ない方から、大見出し・中見出し・小見出し・小小見出しのような形になります。「h」の後に続く数字が見出しのレベルを表すこととなるんですね。

使い方にも一定のルールがありますが、上記のタグで文章を囲むことで、その文章を見出しとして扱うことができるようになります。

と、このように、タグ自体は非常にシンプルな仕組みですので慣れれば使うことにストレスを感じることはなくなると思います。

そして、このようなタグを用いて文章全体をマークアップしていくことを「文書を構造化」すると言ったりしますが、サイトを制作するうえではこの言葉自体に大した意味はなかったりします。なので、そういう言葉があるんだぁ～っていうぐらいに覚えておいていただければ十分です。

ですが、「見出し」と「段落」がに関するタグがHTMLをマスターする上での、一番の基本だと思うので、もしよければこちらは覚えておいてくださいね。

この他にも「表」として表示したり、「リスト」として表示するタグがよく使われますが、基本はやはり「見出し」と「段落」です。

多くのサイトはこの「見出し」とそれに関する「段落（文書）」で構成されていますからね。

応用として、HTMLにはその見栄えを良くしたり、メリハリを付けるために見た目を指定することもできます。例えば、下線を引いたり、色を変えたり、文字を右寄せや、中央揃えにしたりすることも可能です。

ですが、これらの表示方法に関する記述は、「CSS（スタイルシート）」と呼ばれる別のファイルに記述することが勧められています。

こちらのファイルはサイト全体の設計図のようなものになるので、HTMLとは少し違った概念になりますが、また順を追ってわかりやすいように解説等ができればなと思います。

今回は少し長くなっちゃいましたが、最後まで読んでいただいて、ありがとうございました。

にほんブログ村

2011年7月22日 | コメント／トラックバック(3)

カテゴリー:サイト制作のレシピ