15
13

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

ChromeブラウザでUTF-8なのにWebページが文字化けするときの対処法

Last updated at Posted at 2016-05-30

UTF-8でhtmlを書いているのに、何故かChromeブラウザで文字化けするときの対処法。
なお、IEでは問題ない場合もある。
metaタグとBOMの関連で、私はハマったので、メモって話。

以下へ保存形式と記述を統一したら解決した。

  • BOM無しのUTF-8で保存する(UTF-8N)。
  • 改行コードはLFとする。
  • ヘッダに<meta charset="UTF-8">を書く。

特にこの最後のcharsetは要注意。
<meta http-equiv="Content-Script-Type" content="text/javascript; charset=UTF-8">
を書いていて、
且つ上記の<meta charset="UTF-8">無く
且つBOM無しUTF-8で保存していたりすると、
見事に文字化けしてくれるので厄介。┐(´ー`)┌

上記の組み合わせでBOM付きUTF-8だと
文字化けしない(当方の環境では)ので、
「BOMは付けるべきか?」と勘違いしかけたので、本当に厄介。

「あれー?metaタグのcharsetでUTF-8指定しているのに???」
ってなってハマった。
上記のは「javascriptコードがUTF-8だ」と言っているだけで、
そのHTMLファイルがUTF-8とは言ってないぞ、と
理解されるらしい。(^^;)

まぁ、分っている人にはアタリマエなのかもですが。
htmlに対しては
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
と書くのが正しいわけなので(たぶん)。

※HTML5からは「<meta charset="UTF-8">」でOK。
※metaタグのcharsetのはこちらが分りやすい⇒http://www.htmq.com/html5/meta.shtml

15
13
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
15
13

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?