キャラクタ・セットを使う


ホームページを作ろうとして、ぶつかる問題の1つに、「使えない文字」というのがあります。 半角カタカナ(半角の句読点や括弧も含む)や機種依存文字(丸付き数字など)などで、これらを Web ページ上で使用すると文字化けする場合が多いのです。 こうした制限は、今後少しずつ解消の方向に向かうと思われますが、当面これらは使わないほうがいい、どうしても使いたいときは文字や記号を GIF イメージとして貼り付けるしかない、ということになっています。

HTML文書の厄介さは、通常のエディタやワープロソフト上でなら問題なく使える文字・記号でも使えないものがある、或いは制限付きでしか使用できないものがある、ということです。 それは半角カタカナや機種依存文字に限ったことではありません。例えばHTMLのタグとして使用される < や > です。これは、特殊文字のように一致するコードがない、というのとは違いますが、HTMLの定義で < > はタグを表すものとされているために、これをそのままでは表示してくれない場合が多いのです。

もっとも Internet Explorer や Netscape Navigator では、<今週のハイライト!> のように中に日本語などが入っている場合、問題なく表示されるようですが、マイナーなブラウザの場合、全く非表示となります。 IE や Netscape でも <WHAT'S NEW> のように半角英字が入っている場合には、(実際には WHAT'S NEW などというタグは無いにも拘わらず)これをタグと取り違えて、非表示にしてしまうのです。 じゃあ < > なんか使わなきゃいいじゃないか、とも思えますが、Web ページ上でタグを説明しなきゃならないときには困りますね。

ごく普通のホームページの場合でも、

「リンクする場合には <A href="http://www.umechando.com/"> 梅ちゃん堂へ </A> として下さい」


と書くこと、よくありますね。 これをそのまま書くと、タグが実行されてしまい、

「リンクする場合には 梅ちゃん堂へ として下さい」


となってしまいます。 こういう問題を解決するために、WWWブラウザではHTML上で & と ; の間に決まった略語、或いは#とコード番号を書くことで、文字を表すシステムを用意しています。これをキャラクタ・セットと言います。

例えば < なら &lt; または &#60; と書き、> なら &gt; または &#62; と書きます。こうすればタグを実行されることなしにタグ文字をブラウザ上に表すことが出来るのです。 先の例で言えば、

「リンクする場合には &lt;A href="http://www.umechando.com/"&gt; 梅ちゃん堂へ &lt;/A&gt; として下さい」


となりますね。 必ず最後に半角の ; を付けることを忘れないで下さい。&lt; と &gt; は正式にはそれぞれ &#60;、 &#62; と書くべきもので、60 と 62 が各々のコード番号です。 &lt; と &gt; は覚えやすくした形と考えて下さい。

まあこのくらいは、この HTML Tips をしっかり研究なさっている方ならとっくにご存じでしょう。キャラクタ・セットは大部分の半角ラテン文字と半角記号を用意しています。例えば " なら &quot; または &#34;、% なら &#37;、5 なら &#53;、@ なら &#64;、A なら &#65;、 a なら &#97;、§ なら &#167;、© なら &#169;、® なら &#174;、¶ なら &#182;、¾ なら &#190; という具合です。(半角カタカナや全角文字などはカバーしていないようです。)そのすべてを覚えることは、普通の人にはほとんど必要ないかも知れません。

キャラクタ・セットが役に立つのは、上のタグ記号の場合を別とすれば、ドイツ語・フランス語・スペイン語などの西欧諸言語を表示する場合です。 これらの言語では、英語にはない特殊記号をしばしば使います。あなたがお使いの日本語 IME にも、それら特殊記号を表す機能はあるかも知れませんが、それらは限られたソフトウェア上で表示可能なのであり、HTMLには対応していません。 WWWブラウザ上でドイツ語やフランス語などを表示するとき、上に述べたキャラクタ・セットが役に立ちます。しかも以前はブラウザの表示文字コードを「欧文(欧米または中欧語)」に変換しなければ表示できませんでしたが、 IE 4.0 以上ではデフォルトの「日本語(自動判別)」のままで良くなりました。言い換えれば、日本語とそれらの言語とを同一ページ上で表示することが可能となったのです。

ここから先は従って IE 4.0 以上で見ることを強くおすすめします。Netscape 4.0x なら「表示」→「文字コードセット」で「欧米」または「Unicode」にして、Netscape 3.0x なら「オプション」→「文字のコードセット」で「中欧」にして、IE 3.0x なら「欧米」にすることで見ることは出来ます(但し日本語が文字化けします)。

言語 (language) 単語 (words) ソース (source)
ドイツ語 (German) Fuß, Käse, Öl, über Fu&#223;, K&#228;se, &#214;l, &#252;ber
フランス語 (French) café, château, pièce, leçon caf&#233;, ch&#226;teau, pi&#232;ce, le&#231;on
スペイン語 (Spanish) señor, está, sólo, número se&#241;or, est&#225;, s&#243;lo, n&#250;mero


以下に、サンプルとしてドイツ語とアイスランド語の単文を掲げます。ドイツ語は昔の Fraktur(ひげ文字)の感じを出すために Lucida BlackLetter を用いています。

Sah ein Knab' ein Röslein steh'n, Röslein auf der Heiden.
War so jung und morgenschön, lief er schnell es nah' zu seh'n.
Sah's mit vielen Freuden.
Röslein, Röslein, Röslein rot, Röslein auf der Heiden.
(ゲーテ「野バラ」より)
Faðir vor, þú sem ert í himnunum, helgist nafn þitt.
Komm riki þitt ; verði vilji þinn, svo á jörðu sem á himni ;
Gef oss í dag vort daglegt brauð ;
Og gef oss upp skuldir vorar, svo sem vér og höfum gefið upp skuldunautum vorum ;
Og leið oss ekki í freistni, heldur freisa oss frá illu.
(マタイ 6, 9〜13「主の祈り」)


なお、ここでは紙面の都合上、現在使われているキャラクタ・セットのほんの一部しか紹介しませんでした。もし全てのキャラクタ・セットのコード番号を知りたいのでしたら、以下のソースをコピーして適当なHTMLファイルに貼り付け、 ブラウザ上で実行してみて下さい。

<TABLE border=1 cellspacing=0><TR>
<TH align="center" colspan=10>キャラクタセット・コード表 (#31〜#255) programmed by Umechan-do</TH>
<SCRIPT Language="JavaScript">
<!--
var C = 30;
for (i = 0; i < 226; i++)
{
C++;
with (document)
{
if(C % 10 == 0) write("<TD><FONT SIZE=4>",C," = &#",C,";</FONT></TD></TR>");
else if(C % 10 == 1) write("<TR><TD><FONT SIZE=4>",C," = &#",C,";</FONT></TD>");
else if(C == 256) write("<TD colspan=5> </TD>")
else write("<TD><FONT SIZE=4>",C," = &#",C,";</FONT></TD>");
}
}
//-->
</SCRIPT>
</TR></TABLE>



次のトピックは「"else"を活かせ」です。

目次 | ← 前のトピック | ↑ページのトップ | 次のトピック →

ご意見・ご質問がありましたら「ザ・掲示板」またはメールにて梅ちゃん堂まで