20. HTML言語

目次へ 前の項目へ次の項目へ

HTML (Hyper Text Markup Language) はページ記述言語です。プログラミング言語 は数値計算や実行処理を行うものだけでなくこのような記述言語もあります。最近 では個人でwebページを開設することが普通になってきているので、なじみのある 人も多いかもしれません。しかし、市販のHTML文書作成ツールやワープロなどの HTML形式での保存を利用していると、実際の制御コード (これをタグト呼びます ) には縁が無いかもしれません。ここでは、実際のページに記述してあるタグの意 味を少し勉強してみましょう。それにより、ワープロなどに頼るよりも自分でソー スを書く方がすっきりと記述できることが分かると思います。

HTMLを学習する際にもっとも効果的なのは文法を初歩から学ぶのではなく、実際の ページのソースを見ることです。たとえば、今見ているこのページのソースは、 Netscape を使用している場合だと、「表示」メニューの「ページのソース」によ り見ることができます。先程のLaTeXのように、本文以外にいろいろと文字が記入 されているのが分かると思います。HTMLではタグはわかりやすく<と>で囲む ようになっています。また、タグですが、基本的には始めと終わりを <body>と</body>のように二つのタグではさむようにして見た目を制 御しています。中には、片方だけでも仕事をするタグがあるので、時に、終了タグ は省略されることがあります。また、wwwブラウザはあいまいな記述や不完全な記 述でもとりあえず表示するようになっているので、それなりには表示できます。他 の言語のように厳密に処理することはありません。

さて、HTMLの方ですが、このページのソースを見ると分かるように、ヘッダとボディ に別れています。それぞれタグの指定があります。ヘッダとはページの中身ではな くタイトルやここにはありませんが文字コードの指定など前処理を司る部分でボディ の方が本文の表示を担っています。背景の色や文字の色などを指定したければボディ タグの「属性」として指定するとページ全体に反映されます。部分的に変更する場 合は、その場所に記述すればよいことになっています。

個別のタグの使用法や文法に関してはきちんと説明すると膨大なテキストになって しまいますので、ここでは手抜きをさせていただきます。まずは、このリンクをた どって別のページを開いてください。そのページは、1年生のコンピュータ実習の 授業で基本的なタグの練習をしたものです。HTMLの表現力は少し貧弱ですが、表や 箇条書きを使うとすっきりした構成のページが作成できます。それらをどのように 扱うかが分かれば、それなりに記述できるようになります。ただし、表に関しては、 複雑なタグの使い方をしないといけないので、構成をしっかり考えて正確に記述し ないといけません。そのための練習として表の例がいくつかそのページに挙げてあ ります。ページのソースを表示して、中身を見てください。できれば、この場でエ ディタで簡単なページを作成して表示してみると良いかもしれません。

方法は、エ ディタで適当なページを作成し、拡張子をhtmlにして保存します。(hoge.htmlのよ うに) そして、Netscape の「ファイル」メニューから「ページを開く」を選択し、 出てきたウィンドウにページの場所と名前を指定します。記入欄の右の「ファイル を選択」をクリックするとディレクトリ表示モードになりますので、ディレクトリ のウィンドウからそのページデータがあるディレクトリを指定し、ファイルのウィ ンドウからそのファイルを指定します。そうすると、下の「選択」ウィンドウにファ イルの所在が絶対パス指定されますので、「OK」をクリックします。先程のウィン ドウに戻ったら、「Navigatorで開く」をクリックするとページを開きます。エディ タで修正を加えたら再び保存し、Netscape の「再読込」ボタンをクリックすると 変更が反映されます。そうやって、何度も修正しながら仕上げるのがきれいなペー ジの作成方法です。

ちなみに、こちらに市販のワープロのHTML保存により作成したページを示します。 ページの表現は同じですが、ソースを見るとその違いに驚くと思います。フォント のサイズや型、文字の位置などがきめ細かく設定されています。しかし、その分ソー スの分量が格段に増えているうえ、ソースの内容を知るには繁雑になっています。 当然、ファイルの容量も増えていますので、ページの表示まで時間がかかる ことになります。フォントなどはブラウザが表現できない場合にはぎざぎざの見づ らい文字になる可能性もあるので、あまり余計な情報が無い方がすっきりします。 ご注意ください。


ページの先頭へ目次へ 前の項目へ次の項目へ