THE HAM MEDIA BLOG

文字コードの憂鬱

Clip to Evernote このエントリーをはてなブックマークに追加
カテゴリ:
HTML
タグ:
HTML
文字コード
エンコーディング

文字コードの憂鬱

HTMLでも時折悩まされるHTML
PHPでの方が悩む事の方が多いんだけど、
今後ミスを減らすためのメモのためにエントリー

コーディングをしていて、作っているときは何も問題は無かったのに、
サーバーに入れて確認したら、文字化けしていて見れなくなった!!
なんてことは無いでしょうか?

僕はHTMLを勉強しはじめのときにものすごく悩まされました。

サーバーによって違う

そんなによくわかっていないのだが、
どの文字コードをどのようにして読むかはサーバーの設定によって違うようだ。

今の僕の文字コード環境は、Macのローカル環境だとUTR-8とEUCに対応。
会社のサーバーは、一つがShift-JISに対応で、もう一つがEUC-JPとバラバラ。

EUC-JP対応のにUTF-8でとあるCMSを入れたら文字化けが激しすぎたし、
最初は何がなんだかわからなくなっていた。

HTMLでの文字化け

自分のMacローカルでの話だけど、
下記のようなHTMLで、エンコーディングをShift-JISにしていたら、
文字化けしてしまった。

HTMLソース

<html>
<head>
<title>文字コードテスト(Shift-JIS)</title>
</head>
<body>
    <p>サンプルテキスト</p>
</body>
</html>

表示した結果

■Firefoxの場合
文字化け

■Operaの場合
文字化け

ブラウザによって文字化けの表示のされ方はちょっとだけ違うが、
結局文字化けが起こっていることには変わりない。

ちなみに、上記の場合、サーバーがUTF-8のみしか受け付けないので、
meta要素のcharsetでShift-JISを指定したとしても文字化けは解消されなかった。
サーバー環境に対応したエンコーディングを指定しないとだめだということだ。

どのようにしたらいいか

文字コードは、エディタで作成時点から設定しなくてはならないが、
それだけではなく、meta要素での指定も必要である。
その2カ所が合致していて、
且つサーバー環境に適応しているなら問題なく表示される。

つまりのサンプルは以下のように修正すればよい

修正後のHTMLソース

<html>
<head>
<meta http-equiv="Content-Type"
    content="text/html; charset=utf-8" />
<title>文字コードテスト(UTF-8)</title>
</head>
<body>
    <p>サンプルテキスト</p>
</body>
</html>

保存はかならずUTF-8と、meta要素に合わせて設定しておく事を忘れずに。

UTF-8以外であれば、保存のエンコーディングと、
metaのcharsetも修正していおくこと!

PHPやデータベースでも文字コードは要注意

まだ勉強途中なのだが、PHPで入力したテキストを操作するときや、
データベースなどに保存や取り出しを行う際も、
この文字コードが厄介になってくるようだ。

僕の環境下の場合、データベースへの書き込み・読み出しは
問題なく動作し、表示されるのだが、
データベース上でどのように保存されているのかを確認したら、
そこでの表示は文字化けをしていた・・・なんて状態にもなっていた。

この点に関してはどのように修正したらいいのかわからないため、
現在も引き続き勉強中だったりする。

この記事へのコメント
コメントを書く
お名前: [必須入力]

メールアドレス: [必須入力]

ホームページアドレス:

コメント: [必須入力]

認証コード: [必須入力]


※画像の中の文字を半角で入力してください。

この記事へのトラックバック

トップに戻る