文字化けするのなんで?

文字化けするのなんで?

渡邉 響子

こんにちは。アトリエKW 代表の 渡邉響子です。

インターネットにまつわる、いまさら人にきけない話を、ネット初心者の方に向けて紹介しています。

みなさんは、宇宙文字のような文字で書かれたメールを受け取ったり、宇宙文字のような文字で書かれたホームページを目にしたことはありますか?
20年くらい前にはよくあった話ですが、最近は少なくなってきているのであまり目にすることはないかもしれませんが・・・

これは「文字化け」という現象で、コンピューターが文字をどのように扱っているかに起因するあるある現象でした。

この機会に、なぜ文字化けが起こるのか、そして起きたときの対処法、さらに起こさないために気を付けることを知りましょう。

こんな方におすすめ
  • 判読できないメール、ホームページを目にした。または送ってしまったけど原因は何?
  • 文字化けした文章を読めるようにする方法が知りたい
  • これからHTMLを勉強しようとしている方

文字化けする原因の前に、コンピューターが文字をどのように扱っているのか

文字化けを理解するにはまず、コンピューターがどのように文字を扱っているかを理解しなければなりません。

「え?普通に文字は文字でしょ?」

と、人間のあなたはおっしゃりたいと思いますが、実はコンピューターは文字を文字とは認識していません。
あなたが アルファベットの a をキーボードから入力すると、コンピューターは 97 という数字で認識します。

「いったい何を言っているんですか?」となりますよね。わかります。

人間からしたら、文字をいちいち数字に置き換えるなんてナンセンス以外の何物でもありませんが、デジタルってなに?0 と 1 だけの世界 の記事でお話しした通り、コンピューターは 0 と 1 だけの世界。

デジタルってなに?0 と 1 だけの世界

デジタルってなに?0 と 1 だけの世界
デジタルってなに?0 と 1 だけの世界

文字を表すにも 0 と 1 で作れるもの、つまり数字で表しているのです。
こんな感じです。

文字コンピューターが認識する数値
a97
b98
c98
d99
::

人間が、a という文字を入力したら、97、b という文字を入力したら 98 という具合に、文字を数字に置き換えて表しています。
元々、コンピューターはアメリカで生まれたもの。彼らが普段使う文字は、アルファベットと数字、記号などで全部で 128 文字以下に収まります。
ですので 0 ~ 127 までの数値に、それぞれにどの文字当てはめるかという コード表 というものがあります。
それは ASCII コード表 と呼ばれます。ASCII は American  Standard Code for Information Interchange の略です。

また横文字か!とお怒りにならないでください・・・日本が最初にコンピューターを作っていればこうはなってなかったかもしれませんね。

ちなみに・・・ 実は 0 ~ 127 という数字は、コンピューターにとってはキリが良い数字です。
0 と 1 しかない世界、2進数の世界では、10進数の桁の考え方とちがってきます。
桁が増えるたびに 表せる最大数が、2の累乗で増えていきます。

2進数の桁数最大値(2進数)表せる数(10進数)範囲
110 ~ 121=2通り
2110 ~ 322=4通り
31110 ~ 723=8通り
411110 ~ 1524=16通り
5111110 ~ 3125=32通り
61111110 ~ 6326=64通り
711111110 ~ 12727=128通り
8111111110 ~ 25528=256通り

なんか難しくなってきた・・・と感じた方は、 デジタルってなに?0 と 1 だけの世界 の記事 をごらんくださいね。

コンピューターにとって 127 という数字は、7桁の2進数がすべて 1 になっている状態です。
この桁のことを ビット と言います。
つまりお伝えしたかったのは、ASCII コード は 0 ~ 127 の中に納まっているので、7ビットですべての文字を表現できるということです。
しかしながら 7ビット という数字は中途半端です。素数ですし。
ですのでもっとキリの良い数字 8 ビットを一つの単位とすることにしたようです、昔の人は。

この 8ビットというのを、1バイトと呼びます。
1バイトは 0 ~ 255 までの256種類の数値を表現できます。
ASCII コードの文字を表す際にも、中途半端な 7ビットで表すのではなく、8ビット、つまり1バイトで表します。

おや、ASCII 文字は 0 ~127 まで。残りの 128 ~ 255 までも表せるのに、もったいないなぁ・・・となりますよね。

そう思った日本人が、「そうだ、余っている 128 ~ 255 までのところに、カタカナを割り当てよう!」と考えました。

アイウエオ と濁点、「」と句読点 、 と 。 を含めても、64文字以内で収まります。やったね!ということで、ASCIIコードの余り部分 128 ~ 255 にカタカナが割り当てられた JIS X 0201 という文字の規格ができました。

これら、8ビットつまり1バイトで表せる文字のことを 1バイト文字と呼びます。
またこの後話す日本語の文字コードに出てくるカタカナと比較して見た目が半分の幅になっていることから、半角文字と呼びます。

半角文字は アイウエオ のように、普通のアイウエオの文字にくらべ半分の幅で表示されます。
これはこの後お話ししますが、我々人間にとっては意味としてはあいうえおのカタカナですが、コンピューターにとっては、割り振られた番号が全く違う別の文字なんです。

JIS X 0201 については Wikipedia がとても参考になります。

JIS X 0201 の Wikipedia の記事

ここがポイント
  • コンピューターは、文字をすべて数値に置き換えて扱っている
  • 半角文字(アルファベットと記号、数字、半分の幅のカタカナなど)は、1バイト文字または半角文字と呼ばれる

半角文字に対して、漢字も表せる全角文字

先ほどまで話した文字は アルファベットと数字、記号、カタカナだけでした。
「でも日本人だったら漢字も使いたいじゃないか!」となりますよね。
でも考えてください。漢字って、何種類あるでしょうか?

私も気になって調べてみたのですが、5万種類という記事もあったり、いやいや 18万種類だという記事もあったりします。

さっき言ってた 8ビット = 256 種類までは収まらない・・・

ということになり、「しかたがない!表せる文字数を増やすために桁数を増やそう!」となったわけです。
そこで出てきたのが、8ビットの倍=16ビット、つまり、1バイトの2倍、2バイトで文字を表そうということになりました。
つまり私たち日本人が普段 目にしているこの文字は、2バイト文字 ということになります。
2バイトになると、256 種類× 256 種類 で、65,536 種類の文字を表すことができます。これなら常用漢字くらいならすべて納めることができます。

これが先ほどの1バイト文字に対して、見た目も横幅が2倍になっている、全角文字というわけです。

大丈夫ですか?ついてきてますか?
具体的な例を出しましょう。

ここがポイント

この ア は、横幅が広いので 全角文字 2バイト文字です。
この ア は、横幅が狭いので半角文字、1バイト文字です。

漢字は、全て全角文字、2バイト文字です。

そしてこれらは、コンピューターの中ではすべて数値として扱われています。

文字化けの原因

さて、やっと文字化けの原因です。

漢字を2バイト、つまり 0 ~ 65,535 の数字で表すということはわかりましたが、ではどの字を何番に割り当てようかという話になります。

たとえば、漢字の「漢」の字は、 0 ~ 65,535 のうちの何番目にしようか。漢字の「字」の字は・・・と、すべての漢字について、何番に割り当てようかということになるわけです。

そこで、昔の人たちがいろいろ考えたんですよ。いろんな人が。
全ての漢字とコンピューターが扱う数値の対応表を。

みんなで一緒になって考えれば問題は起きなかったんですが、それぞれがそれぞれの対応表を作ってしまった結果、何種類もその対応表ができてしまいました。

この対応表のことを 文字コード というのですが、それこそいくつもあります。
下に列挙しますが、横文字ばかりですし、いちいち覚える必要はありません。

  • JIS コード (ISO-2022-JP)
  • シフト JIS コード
  • EUC コード

これらの文字コードは、それぞれが「この漢字は何番!」と決めてしまったために互換性がありません。
ちなみに、 JIS コードは、昔のメール送信時に使われていたコード、シフト JIS コードは、Windows 系のパソコンで使われてきたコード、 EUC コードは UNIX という特殊なコンピューターで使われていた・・・といった感じで、コンピューターを作っていたメーカーがそれぞれ独自に規格を考えて作っちゃった時代があるんです。

そこで、文字化けが起こってしまうんです!

例えば Windows パソコンで作った書類は シフト JIS コードで書かれています。
それをそのまま、UNIX のコンピューターに送信すると、UNIX では EUC という文字コードで読もうとするため、全然別の文字として認識してしまいます。結果、わけのわからない文字がたくさん並ぶ文字化けが起こります。

特に昔は、メール送信には JIS コードで送るというのが決まりでした。
それを無視して 別のコードで書いた文章を送ってしまい、受け取った側で文字化けを起こすということがよくありました。

文字化けの原因は、文字コードの規格がいくつもあったせいです。

そういった経緯から、現在では インターネットでの書式、ウェブサイトやメールの文章に関しては、 Unicode、その中でも特に UTF-8 というひとつの規格を使うことで文字化けを防ぐことが一般化しました。
(UTF-8 については、1文字が2バイトではなく、もうちょっと複雑な仕組みになっているのですが、そこは今回はその説明は省きます)

文字化けが起きたときの対処法

不幸にも、ウェブブラウザやメールソフトで文字化けの文章に遭遇してしまったら、「これは宇宙からのメッセージか?」とあせらずに、文字のエンコード設定を変更してみましょう。

お使いのウェブブラウザ、メールソフトごとに文字エンコードの変更方法が異なるので、ここでは個別に説明しません。
大概は表示しているページのどこでもいいので右クリックすると、「エンコード」というメニューがでてきます。そこにマウスを乗せるとさらに文字コードの一覧が現れます。
その一覧のうち、きちんと表示してくれる文字コードを選択するということになります。
(一覧のうちのどれがきちんと表示できるものかは、文字化けしているページごとに変わります)

今は、ウェブサイトもメールも、Unicode (UTF-8)というコードで作成するというのが常識になっていて、 文字化けを起こすこと自体が少なくなりました。そうそう文字化けに遭遇することもないでしょう。

それよりも大事なのは、文字化けしてしまうものを送らないことです。

文字化けをさせないために

先ほども話しましたが、現在は ウェブサイトもメールも Unicode (UTF-8)というコードで作成するのが常識になっています。
この Unicode (UTF-8) コードを使っていれば大丈夫!

え? 「Unicode (UTF-8) で文章を作れているかどうかをどう調べたらいいのか?」 ですか?

そうですよね。見た目は変わらない日本語の文字列。どの文字コードが使われているかは見ただけではわかりませんよね。

それは文章を作るときに使っているソフトの設定を見るしかありません。
設定で、文字のエンコードに関係するところを確認することになります。
でも安心してください。

最新のパソコン、スマートフォン、そしてメールソフトを使っていれば、だいたい勝手に Unicode (UTF-8) が使われています。

問題は、unicode (UTF-8) が一般化される前の古いパソコン、古いソフトをずっと使っているという場合です
Unicode が一般化する前は筆者も文字化けで苦労しまくりました・・・・

古いパソコンはこういった文字コードの問題もありますが、セキュリティーの面で無防備になっているということも大きな問題です。
メーカーが保証の対象外にしてしまったパソコンは、もう使わないようにするのが賢明です。
(インターネットにつなぐ用途ではない場合はまだ良いですが・・・けれども、できたら買い替えをおすすめします)

これからHTMLを勉強する方には知っておいてほしいこと

文字化けの原因のあらましをお伝えしましたが、我々ウェブデザイナーは特に文字化けをおこしてしまうわけにはいきません。
ウェブページには、文字化けを起こさないための工夫があることはご存じでしょうか?
HTML には、表に見える部分と、表には見えませんがブラウザに知らせておきたい情報を書きこむ部分があります。
具体的には、表に見える部分が<body> ~ </body> タグの間。
ブラウザへ知らせる情報の部分が <head> ~ </head> タグの間。

<html>
<head>
ブラウザに知らせる情報を書きこむエリア
</head>
<body>
表に見える部分
</body>
</html>

この、<head> のエリアに、どの文字コードを使っているかを書くようになっています。
具体的には、下記のように書きます。

<meta charset="UTF-8">

この場合は、 UTF-8 という charaset つまり文字コードを使っていますという宣言になります。
ここで、指定した文字コードで HTML を書いていれば、文字化けを起こすことはありません。

逆に、指定した文字コードと違う文字コードでHTMLを記述すると文字化けを起こします。
そのために、どの文字コードで記述しているかは、しっかり把握しておかなければなりません。

今は、HTML を記述するのにも便利な Visual Studio Code (無料)というソフトがあります。
他にも、Adobe の DreamWeaver (こちらは有料)など、最新のホームページを作成するための専用ソフトを使っている限りは、UTF-8 で統一して作ってくれるので、なんにも気にしなくていいです。

Visual Studio Code

Adobe DreamWaever

こういった、HTML 製作に特化したソフトを使わずに作ろうとすると、文字コードのことで悩む日が来ます。おそらく・・・
まぁ悩むことも経験になり、良い勉強になるかもしれません。

まとめ

文字化は、文字コードの規格が何種類もあることと、その取扱いを間違っていることが原因で起こることをお話ししました。
また、古いパソコン、ソフトを使うことで文字化けを起こす可能性が高くなります。

UTF-8 が一般化して本当によかったなぁ・・・


最後まで読んでくださってありがとうございます。

この、「いまさらきけない○○」シリーズは、本当にいまさら人にきけないようなネタでつづっていきます。
皆様からのリクエストにもお答えしたいとおもいますので、いまさらきけないなぁということがありましたら、アトリエKW の Twitter または LINE公式アカウントまで、お送りください。

アトリエKW 公式 SNS
Twitter アカウント
LINE 公式アカウント
友だち追加