ホームページ作成

ガイド:西村 文宏

ホームページ作成の基本や便利なサービスなど、様々なお役立ち情報をお伝えします。

取材依頼 問合せ

 

掲載日: 2005年 11月 02日

丸囲み数字、機種依存文字を使うには

丸囲みの数字は「機種依存文字」

印刷物や手書きのノートなどでは、箇条書きをしたい場合や何かの順番を表したい場合に、①・②・③などの「丸囲みの数字」がよく使われます。 この「丸囲みの数字」をホームページ上でも使いたいと思うなら、ちょっと注意が必要です。 なぜなら、「丸囲みの数字」は機種依存文字と呼ばれ、 そのままでは閲覧者の環境によって、全く異なる文字に見える可能性があるからです。

しかし、HTMLにはそういった異なる機種間の問題を解消できる仕組みが用意されています。
今回は、閲覧者の環境によらず、「丸囲みの数字」を表示する方法をご紹介致しましょう。

機種依存文字がそのままでは使えない理由

「機種依存文字を使ってはダメ」とは、昔からよく言われてきました。 現在では、「機種依存」というよりは「OS依存」と言った方が分かりやすいかも知れません。 要するに、「丸囲みの数字」など一部の文字は、「WindowsとMacで全く異なる文字に見えてしまう」※1ということです。

コンピュータは、文字をコード(番号)で表現しています。
例えば、丸囲みの数字5「⑤」は、Windowsでは 8745※2 というコード(番号)で表されます。 しかし、Macでは 8745※2 は、カッコ付き曜日(金)「㈮」という記号を表しています。 ですから、Windows上で「④⑤⑥」と書いても、それをMac上で見れば「㈭㈮㈯」に見えてしまう※3ということです。

なお、機種依存文字ではない文字には、どんな環境でも同じコードが割り当てられています。例えば、「★」は、WindowsでもMacでも 819A※4 というコードで表されるので、 どの環境で閲覧しても同じように「★」に見えます。

<補足>
※1:Mac版ブラウザの種類によっては、Windowsの機種依存文字が正しく表示され、Macの機種依存文字が化ける(=Windows上の場合と同じ表示になる)ものもあります。(Netscape7など)
※2:SHIFT-JISコードの場合の番号
※3:これはフォントの問題で、Mac上でもWindowsと同じコードに機種依存文字を割り当てているフォントを使えば、上記のような文字化けは起こりません。(その代わり、Macで正しく見えるよう作られたファイル内の機種依存文字が化けてしまいます。)
※4:SHIFT-JISコードの場合の番号。他の文字コードでも番号が異なるだけで、環境に寄らず同じように見える点は一緒。

機種依存文字でも使える!

以上の理由から、「丸囲みの数字」はそのまま使うわけにはいきません。 しかし、数値文字参照というHTMLの仕組みを利用すれば、実は問題なく表示できるのです。

数値文字参照とは、文字を数値で表現するというHTMLの仕組みで、主に、 キーボードから入力しようのない文字を表現したい場合に活用されています。 例えば、著作権記号の「 © 」や発音記号の「 æ 」などです。

この数値文字参照で表現できる文字には、実は「丸囲みの数字」も含まれているのです!

数値文字参照で「丸囲みの数字」を表現する

HTML中に、次のように記述してみましょう。すると、丸囲みの数字1「①」が表示されます。

 ①

さらに、次のように記述すれば、丸囲みの数字が1〜20まで表示されます。

 ①/②/③/④/⑤
 ⑥/⑦/⑧/⑨/⑩
 ⑪/⑫/⑬/⑭/⑮
 ⑯/⑰/⑱/⑲/⑳

上記のソースを表示させると、以下のように見えます。

①/②/③/④/⑤
⑥/⑦/⑧/⑨/⑩
⑪/⑫/⑬/⑭/⑮
⑯/⑰/⑱/⑲/⑳

数値文字参照では、9312番が丸囲みの数字1に、9313番が丸囲みの数字2に対応しています。 丸囲みの数字20は、9331番です。 これを使えば、WindowsでもMacでも同じように丸囲みの数字を表示することができます。

HTMLで丸囲みの数字を使いたい場合は、このように数値文字参照を使うようにしましょう。

他の解決策(Unicode)と注意点

HTMLの文字コードが何であっても、今回ご紹介した「数値文字参照」を使えば、丸囲みの数字を表示できます。 しかし、数値文字参照を使うためには、表示したい文字が何番なのかを調べる必要があり、少々面倒です。

もう1つの解決策として、文字コードに UTF-8(Unicode)を使うという手もあります。 Unicodeは、世界の文字を共通の文字コードで表現するために作られたもので、丸囲みの数字も定義されています。 ですから、UTF-8 などの文字コードで保存できるテキストエディタを使ってHTMLを記述すれば、普通に丸囲みの数字を使っても、文字化けすることはありません。

ただし、古い環境では Unicode を解釈できない可能性があります。また、数値文字参照も、必ずしもすべての環境で解釈できるとは限りません。 確実にどんな環境でも同じ文字を表示させるためには、「機種依存文字の使用を避ける」しかありません。
しかし、古い環境は徐々になくなっていくでしょう。また、数値文字参照はHTML標準の表現方法ですし、Unicodeもこれから文字コードの主流になっていくでしょう。 ですから、今後はほとんどの環境で問題なく表示できるようになっていくと考えられます。 どうしても使いたい場合は、今回ご紹介した方法を使うと良いでしょう。

関連記事

数値文字参照は、スパムメールを防ぐ目的にも活用できる可能性があります。 なぜ、文字を数値に置き換えるとスパムメールを防げるのでしょうか? 以下の関連記事もぜひどうぞ。

ガイドメールマガジン
携帯電話のメールアドレスでは登録できません

掲載の記事・写真・イラストなど、すべてのコンテンツの無断複写・転載・公衆送信等を禁じます。