ホームページ >ウェブフロントエンド >htmlチュートリアル >html5の文字セットは使用できますか?
少し前に、IE6 でプロジェクト内のページが突然文字化けするようになり、そのときにさまざまなトラブルシューティングを行ったところ、最終的に HTML5 の DOCTYPE と Charset および中国語のコメントを使用した問題であると推測したため、一時的に古い Charset メソッドを使用して、後で修正してください。文字化けしたコードは再び表示されませんでした。
実際、HTML5 Charset が IE6 で認識できるかどうか確信が持てなかったので、いくつかのテストを行いました。
まず、2 つの Charset 宣言メソッドについて説明します。実際、これらは誰もがよく知っているはずです。
最初のメソッドを HTML5 メソッドと呼び、2 番目のメソッドを HTML4 メソッドと呼びます。
テスト環境:
Windows XP Sp2、中国語版+英語版のIE6、Windows 7上のIE9とそのさまざまな互換モード、およびChrome、Firefoxなどの現在の安定版
HTMLファイルを使用するため、すべて UTF8 でエンコードされているため、ここでのテスト ケースの HTML ファイルも UTF8 (BOM なし) 形式です。プロジェクトも同様に gbk または gb2312 でエンコードされます。
テストには 2 つのメソッドが使用されました:
メタメソッド: HTML5 および HTML4 メソッドとそのマッシュアップを含む
サーバーサイドメソッド: サーバー側で charset を設定、ここでは nginx が使用されます、charset=utf-8
テストケース—— メタメソッド:
UTF8
UTF8 HTML4メソッド
UTF8-GB2312
UTF8+メタ前の中国語コメント
UTF8+HTMLとHEAD間の中国語コメント
GB2312
GB2312 HTML4メソッド
GB2312-UTF8
GB2312 +メタの前の中国語コメント
GB2312+HTMLとHEAD間の中国語コメント
テストケース - サーバーメソッド:
サーバー設定エンコーディング
メタエンコーディングとサーバーエンコーディングは矛盾しています
上記の各ユースケースは直接アクセスできます
テスト結果:
各ブラウザで一貫して実行されたテスト ケース。
UTF-8 ソリューションはすべて正常に表示されました。
charset はドキュメントの UTF-8 エンコーディングと一致しないため、すべて文字化けしました。
1、6 は HTML5 文字セットを使用してそれぞれ UTF8 と gb2312 を定義します。1 は文字化けせずに正常に表示され、6 は文字化けがあります。これは、IE6 の中国語版と英語版の両方に当てはまり、IE6 がHTML5 文字セット;
1,2 使用例 使用例 6 と 7 と同様、HTML5 メソッドと HTML4 メソッドを使用して文字セットを定義すると、それぞれ同じ効果があります。
3 番目の使用例では、最初に HTML5 メソッドを使用して、 gb2312ですが、ページは正常に表示されますが、8番目のユースケースでは結果ページが文字化けして表示されるため、2番目のメタタグがかかっていないことが推測できます。効果;
4 と 5 のユースケースは文字化けしません。これは、単純な HTML コメントが文字化けしないことを示しています。これら 2 つのエンコーディングが異なる js などの外部ファイルを読み込んだときに何が起こるかについては、ここではテストされていません。
サーバーメソッドでは、ユースケース 1 ではメタ設定を使用せずに文字セットを設定し、ページは正常に表示されますが、ユースケース 2 ではメタ設定 charset=gb2312 がサーバーのバージョンとは異なりますが、文字化けは発生しません。サーバーから返された文字セットの優先度が高いことを示すコード
結論:
実際、文字セットの仕様については、Google の開発ドキュメントでも説明されています。
は HEAD タグ内になければなりません。つまり、
を含む他のコンテンツの前になければなりません。スペースと DOCTYPE 宣言は最初の 512 バイト内にある必要があります。
HTML5 と HTML4 は同じ効果を持ちます。どちらかを使用するだけです。
上記のテストは、項目 4 が正しいことも証明しており、両方の記述方法を使用できることを示しています。
さらに、サーバー側で charset を設定することもお勧めします。これは、より効率的で便利です。 Google は現在このアプローチを使用しています。
そのため、ページが統一された方法で記述されている限り、文字化けの問題は発生しません。そのため、HTML5 の DOCTYPE 宣言と Charset 宣言を大胆に使用できます。ただし、上記の Google ドキュメントの仕様に従うようにしてください。あまり多くのことを頭に入れず、js などの外部リソースを後ろに置いてください。
テストに漏れがあるのは避けられませんので、間違いがある場合は、修正して一緒に話し合ってください~~
。