【文字化け解決】文字コードと文字エンコーディング「UTF-8」「Shift_JIS」「EUC-JP」とは？

HTML/CSS/JavaScriptを書いてサーバにアップしたとき、ブラウザ上で文字化けが起こることがあります。なぜ文字化けが起こるのでしょうか？文字コード指定方法など対策についてです。

なぜ文字化けが起きる？

ファイル自身の文字コード（文字エンコーディング）と、それを表示するブラウザの文字コード（文字エンコーディング）が異なると、文字の対応表が異なるので文字化けが発生します。

日本の文字コード

日本では、「UTF-8」「Shift_JIS」「EUC-JP」の3つがよく使われている文字コード（文字エンコーディング）です。

HTMLでは UTF-8 を使用することが推奨されています。

文字コードの指定手順

1. プログラム上での文字コード指定
2. エディタで保存する際の文字コードを確認
3. FTP転送字の文字コード確認

プログラム上での文字コードの指定方法

HTML

<meta charset="UTF-8">

meta要素のcharset属性に文字コードを指定

CSS

@charset "utf-8";

スタイルシートで使う文字エンコーディングを定義。

JavaScript

<script src="sample.js" charset="UTF-8"></script>

src属性で外部Javascriptを読み込む場合は、charset属性で文字コード指定します。

まとめ

なぜ文字化けが起こるか？解決のための文字コードの指定方法についてでした。

JavaScriptの学習講座、エンジニアの転職

あわせて読みたい記事

JavaScriptとは？ タイプ別 入門/初心者向けおすすめ本5選【プログラミング】

【CodePenとは？】無料のWebコードエディタで使い方、ブログへの埋め込み方法。

JSONの書き方

【Anime.js入門】JavaScriptアニメーション基礎入門（変形編）

あわせて読みたい書籍