文字コード宣言は行いましょう(HTML)

HTMLで日本語を使用する場合、そのファイルの保存方法が複数存在します。それはいくつかのルールを使用して日本語を保存し、ブラウザがそのルールに則って読みとることで表示するためです。このルールのことを文字の符号化方式と言います。

保存する時の文字コードとブラウザが読みとる時に使う文字コードが違っていると文字化けが発生してしまいます。これは一部の符号化方式を除き、そのファイルがどのような文字コードで保存されたものなのかをブラウザが判別できる確実な手段が無いために発生します。しかし、そのHTMLファイルの作者がブラウザに対してどのような文字コードで保存したのかを明示することによってブラウザは確実に表示できるようになります。それが文字コードの宣言です。文字コードは次のようにmetaタグを使って宣言します。

ISO-2022-JP(いわゆるJIS): <meta http-equiv="Content-Type" content="text/html; charset=iso-2022-jp">
Shift_JIS(WindowsやMacではこの文字コードがよく使われます): <meta http-equiv="Content-Type" content="text/html; charset=shift_jis">
EUC-JP(UNIX系OSではこの文字コードがよく使われます): <meta http-equiv="Content-Type" content="text/html; charset=euc-jp">

これをhead要素内のできるだけ先頭に記述することによってブラウザは、文字化けを起こさずに正しく表示することができるようになります。

具体的には次のようにします。

<html>
    <head>
        <meta http-equiv="Content-Type" 
            content="text/html; charset=iso-2022-jp">
        
        <title>既に文字コードが宣言されていますので、
            日本語タイトルが安全に使えます</title>
        
        <meta name="description" content="検索エンジンに表示したい文章も、
            このように文字コード宣言の後ろに書きます。">
        
        <!-- 当然日本語のコメントも文字コード宣言の後ろに書くべきです -->
    </head>
    <body>
        <p>
            文字コード宣言に沿った文字コードで保存した日本語で
            記述すると文字化けしません
        </p>
    </body>
</html>

文字コード宣言に関する注意

それでは過去の事例や筆者の経験から注意点をいくつか挙げておきます。これらは全て重要なことです。

文字コード宣言より手前に日本語を書かない: 上記の例にあるように、日本語は文字コードを宣言した後で使うことが原則です。これはコメント内の文章も例外ではありません。
文字コード宣言とは異なる文字コードで保存しない: 文字コードをShift_JISだと宣言しているのに別の文字コードで保存したりすると確実に文字化けします。何故なら、冒頭で述べたように文字コードを確実に判別できる手段が存在しないため、ブラウザは文字コード宣言を信じる他にないからです。
文字コード宣言を間違えない: 文字コードの名前は大文字、小文字は区別されませんのでShift_JISとshift_jisは同じ意味を持ちます。しかし、Shift_JISをShift-JIS等、存在しない文字コード名で書いてしまうと文字化けする可能性が高いので注意してください。
フレーム定義ファイルのタイトルに日本語を使う場合はフレーム定義ファイルでも文字コードを宣言しましょう: フレーム内のファイルには文字コード宣言を行っていても、そのフレームを読み込むHTMLファイルで文字コード宣言が行われていない場合、タイトルが文字化けしてしまいます。文字コードの自動判別は文章が長い方が精度が高くなりますが、タイトルのような一文で確実な判定ができることは希です。通常のファイル以上に気をつけて文字コードを宣言しましょう。
文字コード宣言は1回だけ: 文字コードの宣言を2回以上行うと、どちらの指定を優先するかはブラウザの仕様に依存することになります。これではわざわざ文字コードを宣言するメリットがなくなりますので注意しましょう。

文字コードは日本語を使う場合、必ず宣言するようにしましょう。

補足: HTTPヘッダとの競合

HTTPヘッダにContent-typeという項目があり、上記のMETAタグによる指定はこれを補完するものです。ただし、Mozillaの場合はHTTPヘッダに文字コード宣言が入っていた場合、METAタグの記述を無視します。つまり、このMETAタグが有効なのはHTTPヘッダのContent-typeに文字コードが指定されていない場合、となります。

なお、本来であれば文字コード宣言はHTMLファイル内ではなく、HTTPヘッダで指定されているべきものです。しかし、サーバ設定の変更が必要なため、日本の多くのプロバイダのサーバではContent-type: text/htmlとだけ送信し、文字コードを付加しないようになっています。

逆に言えば、サーバ設定を変更できる人でサイト内のページが全て同じ文字コードの場合、 Content-type: text/html; charset=Shift_JISをHTMLファイル送信時に付加するようにすれば、各HTMLファイルでの文字コード指定は必要なくなります。