web-dev-qa-db-ja.com

<meta charset = "utf-8"> vs <meta http-equiv = "Content-Type">

HTML5 Doctype の文字セットを定義するために、どの表記法を使うべきですか?

  1. ショート:

    <meta charset="utf-8" /> 
    
  2. 長いです:

    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
1462
CuriousMind

HTML 5では、それらは同等です。短い方を使用してください、覚えやすくてタイプしやすいです。 ブラウザサポートは問題ありません それは後方互換性のために設計されているので。

1037
Quentin

メタ文字セット 宣言の両方の形式は同等であり、ブラウザ間で同じように動作するはずです。ただし、Webファイルの文字セットをUTF-8として宣言する際に覚えておく必要のあることがいくつかあります。

  1. UTF-8エンコーディングでファイルを保存しますwith-byte-order mark (BOM)。
  2. メタ文字セット を使用して、HTMLファイルのエンコーディングを宣言します(上記と同様)。
  3. Webサーバーmustはファイルを提供し、Content-Type HTTPヘッダーでUTF-8エンコーディングを宣言します。

ApacheサーバーはデフォルトでISO-8859-1のファイルを提供するように設定されているため、.htaccessファイルに次の行を追加する必要があります。

AddDefaultCharset UTF-8

これにより、Content-Type応答ヘッダーでUTF-8エンコードを宣言するファイルを提供するようにApacheが構成されますが、ファイルmustはUTF-8( BOMなし)で始まります。

メモ帳は、BOMなしではUTF-8でファイルを保存できません。 Notepad ++ が可能な無料のエディター。プログラムメニューバーで、[エンコード]> [BOMなしのUTF-8でエンコード]を選択します。 「エンコード」>「BOMなしでUTF-8に変換」を使用して、ファイルを開いてUTF-8で再保存することもできます。

Wikipediaのバイトオーダーマーク(BOM) の詳細。

246
CodeBoy

もう1つの理由は、マークアップで文字セットを指定する可能性がある他のインスタンスと一致するためです。例えば:

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

<p><a charset="UTF-8" href="http://example.com/">Example Site</a></p>

一貫性はエラーを減らし、コードを読みやすくするのに役立ちます。

Charset属性は大文字と小文字を区別しないことに注意してください。 UTF-8またはutf-8を使用できますが、UTF-8の方が明確で、読みやすく、正確です。

また、メタ文字セット属性またはページヘッダにUTF-8以外の値を使用する理由はまったくありません。 UTF-8は、1999年のHTML 4以降のWeb文書のデフォルトのエンコード方式であり、最新のWebページを作成するための唯一の実用的な方法です。

また、UTF-8ではHTMLエンティティを使用しないでください。著作権記号のような文字は直接入力する必要があります。使用する必要がある唯一のエンティティは、5つの予約済みマークアップ文字用です。アンパサンド、小なり、二重小なりです。エンティティにはHTMLパーサが必要です。これを使用するのは必ずしも望ましいとは限らないため、エラーが発生し、コードが読みにくくなり、ファイルサイズが大きくなり、使用するエンティティによってはさまざまなブラウザで誤ってデコードされることがあります。著作権、商標、引用符、引用符、引用符、アポストロフィ、半角記号、半角記号、ユーロ、およびその他の文字をコンテンツに入力して挿入し、それらの実際の文字をコードに使用する方法を学びます。 Macには、キーボードシステム環境設定で有効にできる文字ビューアがあり、必要な文字を見つけてドラッグアンドドロップするか、または対応するキーボードビューアを使ってどのキーを入力するかを確認できます。たとえば、商標はOption + 2です。 UTF-8には、人間が書いたあらゆる言語のすべての文字と記号が含まれています。そのため、ダッシュの代わりに - を使用する言い訳はありません。句読点やタイポグラフィーのルールも学ぶことは悪い考えではありません。たとえば、ピリオドは外部ではなく密接な引用符で囲まれていることを知っている場合などです。

コンテンツタイプやエンコーディングのようなものにタグを使用することは非常に皮肉なことです。これらのことを知らないと、メタタグの値を取得するためにファイルを解析できないからです。

いいえ、そうではありません。ブラウザは、ファイルをブラウザのデフォルトエンコーディング(UTF-8またはISO-8859-1)として解析し始めます。 US-ASCIIはISO-8859-1UTF-8の両方のサブセットであるため、ブラウザはどちらの方法でも正しく読むことができます...それは同じです。ブラウザがメタ文字セットタグに遭遇したとき、エンコーディングがブラウザがすでに使用しているものと異なる場合、ブラウザは指定されたエンコーディングでページをリロードします。そのため、メタ文字セットタグをheadタグの直後、他のものの前、タイトルの上にも配置します。そのようにあなたはあなたのタイトルにUTF-8文字を使うことができます。

あなたはBOMなしでUTF-8エンコーディングであなたのファイルを保存しなければなりません

それは厳密には正しくありません。文書にUS-ASCII文字しかない場合は、US-ASCIIとして保存し、UTF-8として使用できます。これはサブセットです。しかし、Unicode文字があるなら、あなたは正しい、あなたはBOMなしでUTF-8として保存しなければならない。

UTF-8でファイルを保存する優れたテキストエディタが必要な場合は、Notepad ++をお勧めします。

Macでは、Mac App Storeから入手できるBare Bones TextWrangler(無料)、またはMac App StoreにあるBare Bones BBEditを39.99ドルで購入できます。このような優れたツールには非常に安価です。どちらのアプリでも、ドキュメントウィンドウの下部にメニューエンコーディングを指定するメニューがあり、「UTF-8 no BOM」を簡単に選択できます。そしてもちろん、あなたはそれをPreferencesの新しい文書のデフォルトとして設定することができます。

しかし、WebサーバーがHTTPヘッダーのエンコーディングを提供している場合(これが推奨されます)、両方の[metaタグ]は不要です。

それは間違っています。もちろんHTTPヘッダーでエンコーディングを設定する必要がありますが、ページをブラウザからローカルストレージに保存して後で開くことができるようにmeta charset属性でも設定する必要があります。表示されるエンコーディングの唯一の指示は、メタ文字セット属性です。同じ理由でベースタグも設定する必要があります。サーバーではベースタグは不要ですが、ローカルストレージから開いた場合、ベースタグを使用するとページがサーバー上にあるかのように機能します。資産の配置など、リンク切れはありません。

AddDefaultCharset UTF-8

あるいは、次のように特定のファイルタイプのエンコーディングを変更することもできます。

AddType text/html;charset=utf-8 html

UTF-8とLatin-1(ISO-8859-1)の両方のファイルを扱うためのヒントは、UTF-8ファイルに "text"拡張子を、Latin-1ファイルに "txt"を付けることです。

AddType text/plain;charset=iso-8859-1 txt
AddType text/plain;charset=utf-8 text

最後に、レガシーDOSや(従来の)Macの行末ではなく、特にこれらのレガシーシステムから遠ざかるにつれて、行末にドキュメントを保存することを検討してください。有効なHTML5、UTF-8エンコーディング、およびUnixの行末を持つHTML文書は、よくできた仕事です。あなたは多くの文脈でその文書を共有し、編集しそして保存しそして読みそして回復しそして信頼することができる。リンガフランカです。デジタルペーパーです。

81
Simon White

<meta charset="utf-8">は/と共にHTML5に導入されました。

ドキュメントに記載されているように、どちらも有効です。ただし、<meta charset="utf-8">はHTML 5専用です(そして、入力や覚えが簡単です)。

やがて、古いスタイルは近い将来廃止される予定です 。私は新しい<meta charset="utf-8">に固執するでしょう。

片道しかないが、上がっている。技術的な場合、それは古いものを廃止している(本当に、本当に速い)

ドキュメンテーション: HTMLメタ文字セット属性 - W3Schools

30
Omar

他の答えに異議を唱えない一方で、私は以下が言及する価値があると思います。

  1. 「長い」(http-equiv)表記と「短い」表記は、どちらか先に勝った方が同じです。
  2. Webサーバーのヘッダーはすべての<meta>タグをオーバーライドします。
  3. BOM(Byte order mark)は everything を上書きします、そして多くの場合それはhtml 4(そしておそらく他のものも)に影響するでしょう。
  4. エンコーディングを宣言していない場合は、おそらくブラウザで定義されている「代替テキストエンコーディング」でテキストを取得します。 FirefoxでもChromeでも、それはutf-8ではありません。
  5. 他の手がかりがない場合、ブラウザはあなたの文書をまるでASCIIの中にあるかのように読み込もうと試みるので、奇妙な符号化を使うことはできません(ただしBOM付きのutf-16はそうするべきです) ;
  6. 仕様ではエンコード宣言は文書の最初の512バイト以内でなければならないと言っていますが、ほとんどのブラウザはそれ以上のものを読み込もうとします。

echo 'HTTP/1.1 200 OK\r\nContent-type: text/html; charset=windows-1251\r\n\r\n\xef\xbb\xbf<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><meta charset="windows-1251"><title>привет</title></head><body>привет</body></html>' | nc -lp 4500を実行してブラウザをlocalhost:4500に向けることでテストできます。 (もちろん、部品を変更したり削除したりする必要があります。BOM部品は\xef\xbb\xbfです。シェルのエンコード方式には注意してください。)

エンコーディングを明示的に宣言することは非常に重要です。ブラウザに推測させると、セキュリティ上の問題が発生する可能性があります。

17
squirrel

HTML5を使用する場合は、Webブラウザに<meta charset="utf-8" />を使用してください。

HTML4やXHTMLを使うとき、あるいはphp 5.3のDOMDocumentのように時代遅れのDOMパーサーのためには<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />を使います。

10
Timo Huovinen

Mozilla Foundation 、および sitepoint に基づくニュースがあります。

この値(http-equiv=content-type)は廃止されているので使用しないでください。 <charset>要素のmeta属性を優先してください。 enter image description here

2
user10089632

電子メールに署名を埋め込むには、長いバージョンを使用します。

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

その理由は、多くのメールリーダーがhtml5を使用しないため、常に古いhtmlスタイルを使用することをお勧めします。実際には、divs + cssよりもテーブルを使用する方が適切です。

0
chelder