文字化けの原因ついに判明！UTF-8に設定しているのにブラウザではShift_JISと認識する謎
私のブログはMovableTypeを利用しているのですが、これまで、ブラウザによっては文字化けするようで、その原因が不明でした。しかし、先日あることに気づき、実践してみたところ文字化けが解消されました！それは至って単純なことでしたが、意外と落とし穴なのではないのかと思い、メモっておきたいと思います。
- 文字コードを指定するmetaタグの位置が重要
- 文字コードはmetaタグで指定すると思いますが、私も「meta http-equiv="Content-Type" content="text/html; charset=UTF-8"」このように設定していました。しかし、一つ重要なことが…「meta name="keywords"」や「meta name="description"」の前に置くことが重要なのです。これまで私は逆にしていました。（×の例のように）
×の例では、keywordsやdescriptionの後には当然日本語を記入していますが、metaタグで文字コードを指定する前に書いているので勝手にSift_JISと判断してしまうようで、結果文字化けとなってしまいます。これを解消至って簡単。順番を代えればＯＫです。意外と知らない内容で、勉強になりました。
文字化けの原因はこれ
