良い子のみんなぁー！
トリおばちゃんおねえさんの知恵袋の時間だよぉー！
今日は「文字化け」について、初めてのお友達にもわかりやすく解説しちゃうよ～。
実はおねえさんも１年くらい前にサーバーにインストールしたツールが文字化けしちゃって、とぉーっても苦労したんだ。
そん時にやれ「エンコード」だの、やれ「キャラクタセット」だの、
難しいことを一気にたくさんパイセンから教えてもらって、頭がパンクしそうになったので、もう一度きちんと復習しておこうと思って、今回この記事を書くことにしました～。
「復習が１年後とか遅ぇよ」っていうツッコミはこのさい(ヾﾉ･∀･`)ﾅｲﾅｲにしてぇ～、一緒に楽しくお勉強していきましょー！
文字コードについて知っておこう
「文字化け」のことをお勉強するにあたって、まずパソコンがどうやって文字を認識しているかを知っておこう！
パソコンって実はとーっても賢そうに見えて、扱えるデータは0と1しかないって知ってた？
とっても意外だよね。
光通信とは？でお話しした0と1の電気信号と同じだね。
だけど、0と1しか扱えなかったら、こういう文字はどうやってパソコンに認識させるの？って話になるよね。
そこで、この0と1を組み合わせてパソコンが文字を認識できるようにしたものが文字コードと呼ばれるものなんだよ。
ちょっとわかりにくいかな・・・？
たとえば、ASCII（アスキー）と呼ばれる英数字を表す文字コードでは、01000001が「A」という文字にあたるのね。で、「B」は01000010、「C」は01000011という具合に割り当てられてるんだ。おもしろいね。
でもでも、これじゃあ英数字しか扱えないし、日本語のひらがな・カタカナ・漢字っていうたくさんの文字を扱おうと思ったら、この数字の組み合わせだけでは当然足りなくなるよね！
そこで、日本語には日本語用の文字コードも作られたんだよ。
この辺は難しいから、サラッと流してくれたらいいんだけど、、、
0と1だけのデータを２進法表記って呼んでいて、更にこれを変換して16進法表記にしたら、0と1以外にも、0～9とA~Fを使った組み合わせができるんだって( ´_ゝ｀)ﾌｰﾝ
２進法→16進法に変換ってあたりでもう脳みそバーン！（世代がバレるかしら）って感じだけど、まぁ簡単に言えば、エライ人が複雑な日本語もパソコンで認識できるような文字コードを作ってくれた、くらいに思ってもらえればいいかな。
で。
日本語対応の文字コードにも実は色々あって、Shift_JISやUTF-8、EUC-JPなんかが有名かな。
ガラケー主体だった時代はEUC-JPが結構使われてたみたいだけど、今はスマホやタブレットが主体になってきてるからね。
だいたいのサイトがShift_JISかUTF-8になってきているよ。
今後はUTF-8が色んな国の文字に幅広く対応できることからメジャーになると言われているよ。
ち・な・み・に。
よく混乱する人が多いのだけれど、文字コード関連の話でよく目にする"Unicode"。
これは厳密にいうと、文字コードではなく「文字集合」と呼ばれるものになるの。
うん、目が死んでるね。
まず、日本語の「あ」とか「い」とか、英語の「A」とか「B」とか、そういった表したい文字の集まりを「文字集合」だと思ってもらったらいいかな。
そして、更にその文字グループをパソコンに理解させるために、数字を割り当てたものを「文字コード」って呼ぶんだ。
この辺はマニアックな話だから、( ´_ゝ｀)ﾌｰﾝ程度でいいよ、( ´_ゝ｀)ﾌｰﾝで。
冒頭でちょこっと出てきた「キャラクタセット（charset）」は厳密にいうと文字集合のことなんだけど、文字コードを含めて指すことも多いよ。
わかりやすく図にするとこんな感じ。
文字化けが起こる原因を解明
前置きが長くなっちゃったけど、これらのきほんを踏まえた上で、文字化けの原因について説明していくよ！
なぜ、インターネットをしているとたまに「なんじゃ、この暗号は！？」みたいな読めないサイトがあるのか、つまりは文字化けしちゃってるのか、ということなんだけど。
簡単にいうと、そのページを作っているHTMLファイルの文字コードと、ブラウザで設定されている文字コードが一致していない時に起こるんだよ。
例えば、HTMLファイルでは「UTF-8で書いたよ」ってなってるのに、ブラウザは「EUC-JPで読むよ」って設定されているとか。
もっとわかりやすくいえば、フランス語で書かれた文章を、ドイツ語の辞書を使って読もうとしているような状態だね。
たいていこれはそのページを作った人に問題があることが多くて、HTMLの中で「このページの文字コードは○○ですよ」って指定するのを忘れてたりとか。
じゃあ、それはどこで指定できるの？って話だよね。
このページのソースを見てもらえればわかるんだけど、<head>から</head>の間に<meta charset="文字コード" />って入れれば文字コードの指定ができるよ！
簡単でしょ。
ちゃんと指定しなかったり、HTMLファイルの保存形式はUTF-8なのに、meta charsetをEUC-JPとか不一致にしてしまうと、文字化けの原因になるので注意してね！
きちんとページを表示させるのは他でもないウェブマスターの役目だよ！
文字化けの直し方
最後に、文字化けのページに遭遇しちゃった時の応急処置を教えておくね。
手動でエンコードを変える
- Internet Exploreの場合
右クリックメニューのエンコードから文字コードを選択してね。「その他」から更にバリエーション豊かな文字コードが選べるよ。
- Google Chromeの場合
実はChromeは右クリックメニューから「エンコード」がなくなっちゃったの。これはGoogleが「我々はChromeの性能に自信を持っているから、もう必要ないのだ」というドヤ顔的見解から外したみたい。ただ、拡張機能として追加すれば使えるみたいなので、必要に応じて追加してね。ここからDLできるよ。
文字化け修正サイトを使う
調べてみると、コピペするだけで文字化けを直してくれるサイトも結構あるみたいだね。特に「もじばけらった」は可愛らしいデザインもさることながら、使いやすい上に色んなエンコーディングを試せるので、おススメしておくよ。
- もじばけらった：http://lab.kiki-verb.com/mojibakeratta/
まとめ
インターネットを使う上で誰もが一度は経験したことのあるイヤ～な「文字化け」。でも、パソコンでの文字の仕組みや文字化けの原因がわかった今は、そんなに難しいことじゃないでしょ？
もう文字化けに遭遇しても「うわっ、文字化けだ！」なんて白旗を上げることもなくなるはず。これから文字化けを見ても、焦ってウィンドウを閉じたりせず、冷静にさっき教えた方法で対処してみてね。
もし周りに文字化けで困っている人がいたら、直し方を教えてあげてね。
これが出来るだけで、みんなに「すごぉーい」って言われるよ。
それじゃ、文字化けのお話はこれでおしまい。
ま～たね～☆☆☆
（はぁ～慣れないキャラで書くと疲れるわ）
カテゴリ：インターネットの基本 [コメント：6]
トリさん こんばんは！
さゆこです
＞HTMLファイルの文字コードと、ブラウザで設定されている文字コードが一致していない時に起こるんだよ。
ほぉ～～～！そうだったのか！！
知らなかった！！！
また一つお利口になりました (ﾟ∀ﾟ)
トリおねーちゃん、ありがとー！
ま～たね～☆☆☆
（キャラ合わせ終了）
ではでは＾＾
さゆこさん、こんばんは！
ノリを合わせて下さりありがとうございました（笑）
パソコンがだいぶ賢くなってきたので、文字化けに遭遇する機会も減りましたけどね。
だから余計にエンカウントすると焦ります^^;
コメントありがとうございました！
ふーん・・・
へー・・・
そっかー
なるほどね〜
はっ！？
いかん、空気読まなくちゃ！
はーい、みんなーinowayお兄さんだよー。
今日はお兄さんね、トリお姉さんのとこに遊びに来ました〜。
え？
一人しかいない？
トリオ姉さんなのに？
お姉さんはね、トリオじゃなくてピンなんだよ。
つまり、ピン姉さん。
はい、つまんないこと言って申し訳ない。
もうじばけない。
文字化け無い。
そう、この記事を読んだらもう文字化けなんて無いも同然さ！
それじゃ、みんな！
ま～たね～☆☆☆
(本当に申し訳ありません)
inoway殿
井上兄さんの本領発揮やでぇ～！
もうレベル高須クリニックすぎて、ピン姉さんは何も返せないYO。
兄さんところにもっとコメントしに行きたいけど、良いボケが思いつかなくて手が止まってしまうYO。
でもめげずにまた遊びに行きます。必ず。
いつも素敵なコメントをありがとうございます。
ピン子
トリさん、こんにちは。
はまぞふです。
文字化け、僕はよく目にしてました^^;
仕事では、サーバー上やら、
htmlやらをいじる機会も多く、
文字化けの仕組みは“なんとなく”
理解はしていたつもりですが、
この記事でよくわかりました^^
文字化け修正サイトは初めて知りました。
今度、文字化けに出会ったら、
“もじばけらった”使ってみます^^
応援完了です^^
はまぞふさん、ご無沙汰しております！
そうなんですよ～今の時代便利なもので文字化け修正サイトが結構色々あるんですよ。
昔は文字化けを見た瞬間「はい、アウトー」って諦めてたんですけどね（笑）
色々あるなかで「もじばけらった」はサイトデザインも見やすくて気に入ってます。
なかなか文字化けに遭遇する機会も減りましたが、エンカウントした際には是非ご活用ください。
それでは、応援ありがとうございました！