HTMLの基礎

 HTML(HyperText Markup Language)の略で、インターネットのホームページを記述する言語・書式のことを言い、この言語で書かれたものをHTMLファイルと言います。中身はテキストファイルですが、ブラウザソフトが解釈して画面に表示できるようにするため、タグと呼ばれる命令語を含んでいます。画像などのマルチメディアデータは、別ファイルになっており、パソコンの種類・OS・言語の違いを越えて、世界中に伝送するため、通信回線の負担を減らすように工夫されています。 HTML書式のドキュメントは、インターネットだけでなく、ネットワーク型の文書の標準としても、マニュアルなどに使われます。

 ブラウザと呼ばれるソフトで開くと、OS・ブラウザによらず同じ形式のドキュメントが見られるようになっています。HTMLファイルは、中身は文字だけのテキストファイルで、画像などの要素は別ファイルになっています。別ファイルを呼び出すのに、ファイルの有るサーバーのアドレスが使われ、そこへリンクするよう形式になります。文字と別ファイルへのリンク先を記述したテキストファイルがHTML文書です。

テキストファイルの種類

 HTML書式で書かれたファイルは、ソースと呼ばれます。拡張子はhtmまたはhtmlの4文字ですが、windows初期には、ファイルの拡張子は3文字という習慣があったため、htmが使われていましたが、現代はほぼhtmlの4文字形式になっています。どちらでも使えますが、敢えて古い規格を使う必要はないでしょう。htmlのファイル名は、半角しか使えません。

もう一つ、ソースファイルについて注意が必要なのは、文字コードです。ファイル名は半角ですが、中身の文字は日本人用のページには、当然日本語が使えます。日本語を使う場合、全角文字のコードには複数あり、これが「文字化け」というインターネット独特の現象の元でした。多く使われてきたものが、shift-JISとJISという2種類でした。パソコンの世界では、Shift-JISが常識だったこともあり、ホームページはShift-JISが標準でした。 しかし、今はよりグローバル対応のUTF-8が標準です。

ソースファイルの編集

  ブラウザでHTMLを開き、メニューから「ソースの表示」を実行すると、HTMLの内容が表示されます。IE6までは、ソースのテキストファイルを開くものが、Windows標準のメモ帳というテキストエディタでした。ローカルにあるHTMLファイルを開いた場合は、メモ帳で開いたソースを修正すると、変更を保存し直ちに編集ができました。しかし、今はメモ帳ではソース編集はできません。ブラウザに組み込まれたソース表示ツールは、編集はできなくなっています。その理由は、メモ帳ではShift-Jisのテキストしか編集できないからです。一時は、ソースを見せたくないという理由で、文字コードをJISにしているページも多かったのですが、今は別の理由でソースの文字コードはUTF-8になっています。

 ソースの編集を簡単にするために、個人用のページでは編集しやすいSHIFT-JISを使っていたのですが、何故UTF-8が多く使われるようになったのでしょうか。それは、HTMLソースの中の記述が、日本語の全角文字よりも、半角文字で記述される部分が多くなったからです。かつては、< >で挟まれたタグという記述が、若干あるだけでしたが、タグ以外のスクリプトの方が圧倒的に多くなったのです。これらは、スタイルシートコマンドと呼ばれるCSSであったり、ページのダイナミックな機能をつかさどるJavascriptが多くなったからです。文字情報としての全角文字のコンテンツより、はるかに大きな量の半角テキストデータが、HTMLの重要な要素になっています。

 CSSやJavascriptは、個人が0から作成することは困難で、無料で公開されているものを組み込んで使います。ホームページ編集ソフトは、このようなCSS・Javascriptのコードを作りだすのではなく、ソフトが持っているものを組み込みます。それらが、UTF-8で記述されているからです。世界共通で使う半角文字のスクリプトの部分が多くなったのです。Shift-Jisなどの日本語の全角文字を含む文字コード体系も、半角文字コードは共通、と聞いていましたが、UTF-8は全世界の文字コードを含むようになっているので、半角文字のコードも変わっています。文字として表示されないスペースや改行コードが変更されているので、メモ帳で編集したりすると、CSSやJavascriptの部分が壊れて動かなくなります。UTF-8のソースを編集するには、この文字コードのテキストも編集・保存できるエディターが必要です。

HTML以外のテキストファイル

 CSSの記述やJavascriptの 記述 は、テキストなので、HTMLファイルに記述することもできます。しかし、膨大な文字列のこの部分は、ソース編集で壊さないよう、別ファイルにすることもできます。実際には、別ファイルへのリンクを記述し、そこから読み込んできます。

<link rel="stylesheet" href="base.css" type="text/css" media="screen" />
この記述は、スタイルシートとして、bace.cssを使っているという定義のタグです。文字の色や大きさ、表示領域の幅や高さなどは、別の場所に書かれています。従って、HTMLファイルだけを見ても、編集はできません。

画像ファイルや音声ファイル・動画ファイルなど、テキストファイル以外のものが別ファイルになっているのは当然ですが、テキストファイルも別になっています。

Javascriptは、拡張子.js です。スタイルシートのCSSファイルは、拡張子 .css です。これらは中身はテキストなので、Wクリックすればメモ帳で開かれたりしますが、上書き保存すると壊れることがあります。決してWクリックで開いてはいけません。ホームページ編集をするものは、windowsの設定を変え、拡張子は常に見えるようにし、またTerapadなどのテキストエディタを用意し、右クリックでプログラムを選んで開くようにします。それができない人は、ホームページ編集をすべきではありません。

Designed by CSS.Design Sample