読者です 読者をやめる 読者になる 読者になる

不器用(TOT) エンジニアの気ままにプログラミング

~考え、作って、また考える~

Webページでの日本語の文字化け

Webページで日本語を表示しようとした際、

文字化けが起きた。

 

例えば、下記のように日本語で「テスト」と表示させる。

f:id:shevhome:20151102133102p:plain

 すると、ページを表示すると

f:id:shevhome:20151102133032p:plain

と文字化けしてしまった。

 

これはなんでかと調べたところ、

ファイルの文字コードが「UTF-8」でなかったことが原因だった。

f:id:shevhome:20151102134145p:plain

 

で、なんで「IOS-2022-JP」という文字コード

登録されてしまったかを考えると、

以前、viの入力時に日本語が文字化けしてしまう現象が起き、

その対応を行っていた対応が間違っていたようだ。

shevhome.hateblo.jp

 

上記で、~/.vimrcを追加作成していたのだが、

そのファイルの中身は

f:id:shevhome:20151102134021p:plain

で作成しており、ファイルエンコードの指定をutf-8だけに変更した。

f:id:shevhome:20151102134401p:plain

 

再度、index.htmlを編集しようとすると、

日本語の対象箇所がutf-8で開き直したためだと思われるが、

文字化けする。

これを正しい日本語に編集して保存。

f:id:shevhome:20151102134510p:plain

 ↓

f:id:shevhome:20151102134641p:plain

 

そして、再度、ファイルの文字コードを調査。

f:id:shevhome:20151102134808p:plain

するとファイルの文字コードは「UTF-8」になった。

 

その状態で元々、日本語が文字化けしていたWebページを

ブラウザで確認すると、

f:id:shevhome:20151102134928p:plain

と日本語が表示された。

 

とりあえずは、この対処で治ったので様子を見てみる。