Bahasa

Meta Charset Tag

What <meta charset="utf-8"> melakukan, why HTML spec ingin ini di pertama 1024 bytes, how sebuah wrong encoding causes mojibake, dan why ini adalah sebuah rendering-correctness issue alih-alih sebuah peringkat factor.

Pertama kali diterbitkan: 2 Jul 2026 · Terakhir diperbarui: 3 Agu 2026 · Advanced
Bahasa
AIDitulis olehAI v2
1 sinyal bukti di halaman ini

meta charset tag — <meta charset="utf-8"> — declares Anda halaman's character encoding so browser dan crawler turn raw bytes ke right characters. HTML spec memerlukan ini di dalam pertama 1024 bytes dari document, dan best practice adalah literal pertama child dari <head>. Get ini wrong (missing, late, atau sebuah mismatched encoding) dan Anda get mojibake: accented letters, curly quotes, em dashes, non-Latin scripts, dan emoji render sebagai garbage — which dapat corrupt what's displayed dan terindeks. ini adalah NOT sebuah direct peringkat factor; Google's hanya guidance adalah untuk 'gunakan Unicode/UTF-8 where mungkin.' UTF-8 adalah near-universal, spec-diperlukan encoding untuk HTML5 today. sebuah server-dikirim konten-jenis header charset overrides di-halaman tag, which adalah sebuah umum source dari migration bugs. ini adalah one dari browser-facing tags di meta-tags cluster.

TL;DR — <meta charset="utf-8"> declares document’s character encoding. WHATWG HTML spec memerlukan declaration untuk menjadi serialized completely di dalam pertama 1024 bytes dari document, dan untuk HTML5 nilai harus match utf-8; best practice adalah placing ini sebagai literal pertama child dari <head>. sebuah missing, late, atau mismatched encoding produces mojibake — corrupted accented characters, curly quotes, non-Latin scripts, dan emoji — which adalah sebuah rendering dan pengindeksan-correctness masalah, not sebuah sinyal peringkat. Google’s hanya public line adalah “use Unicode/UTF-8 where possible.” (terjemahan) “gunakan Unicode/UTF-8 where mungkin.” sebuah server-dikirim Content-Type charset header overrides di-document tag, which adalah sebuah classic post-migration mojibake bug. hanya one charset meta element adalah allowed per document, dan ini memiliki no effect di XML. sebuah UTF-8 byte-order mark (BOM), jika present, wins di atas everything else; otherwise header HTTP wins di atas di-halaman tag — full precedence order below.

Evidence for this claim For HTML documents, the charset declaration must identify UTF-8. Scope: Modern HTML conformance requirements. Confidence: high · Verified: WHATWG HTML: Character encoding declaration Evidence for this claim The complete character-encoding declaration must occur within the first 1024 bytes of the document. Scope: HTML serialization requirement intended to make encoding available early to parsers. Confidence: high · Verified: WHATWG HTML: Specifying the document's character encoding

What tag adalah

charset declaration tells sebuah parser which character encoding untuk gunakan when ini turns document’s bytes ke text. WHATWG HTML Living Standard puts ini plainly: “The charset attribute specifies the character encoding used by the document. This is a character encoding declaration.” (terjemahan) “ undefined attribute specifies character encoding digunakan oleh document. ini adalah sebuah character encoding declaration.” MDN’s framing adalah practical versi: “This attribute declares the document’s character encoding.” (terjemahan) “ini attribute declares document’s character encoding.”

modern syntax adalah pendek form:

<meta charset="utf-8">

There’s juga sebuah legacy pre-HTML5 form Anda’ll masih see di older templates:

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

Both declare yang sama thing. pada sebuah modern HTML5 document Anda hanya perlu pendek <meta charset="utf-8"> — menggunakan both adalah redundant, not harmful, dan spec allows hanya one charset-declaring meta element per document anyway. ( http-equiv form adalah best thought dari sebagai legacy alih-alih something untuk tambahkan fresh; jika Anda’re auditing sebuah halaman itu memiliki ini, ini isn’t broken, ini adalah hanya old.)

spec requirements Anda actually perlu untuk know

UTF-8 adalah effectively mandatory untuk HTML5. MDN states ini directly: attribute’s “value must be an ASCII case-insensitive match for the string utf-8, because UTF-8 is the only valid encoding for HTML5 documents.” (terjemahan) “nilai harus menjadi sebuah ASCII case-insensitive match untuk string undefined, because UTF-8 adalah satu-satunya valid encoding untuk HTML5 documents.” WHATWG spec goes further dan memerlukan document’s actual encoding untuk menjadi UTF-8 regardless dari what’s declared. UTF-8 covers essentially setiap script plus emoji, which adalah why ISO-8859-1 / Windows-1252 / Shift-JIS era dari per-region encodings adalah di atas untuk baru berfungsi — itu survive hanya sebagai legacy compatibility cases.

ini harus land di pertama 1024 bytes dari document. ini adalah sebuah hard spec requirement, not sebuah soft suggestion. MDN: “<meta> elements which declare a character encoding must be located entirely within the first 1024 bytes of the document.” (terjemahan) “undefined elements which declare sebuah character encoding harus menjadi located entirely di dalam pertama 1024 bytes dari document.” alasan adalah mechanical — parser sniffs byte stream untuk sebuah encoding sebelum ini dapat safely interpret rest. jika Anda declaration menampilkan up too late, parser dapat sudah memiliki committed untuk sebuah guessed encoding (atau memiliki untuk restart, which costs performa). Note framing carefully: ini adalah pertama 1024 bytes dari entire document, not hanya dari <head>.

Evidence for this claim The complete character-encoding declaration must occur within the first 1024 bytes of the document. Scope: HTML serialization requirement intended to make encoding available early to parsers. Confidence: high · Verified: WHATWG HTML: Specifying the document's character encoding

Best practice beats spec minimum: membuat ini pertama child dari <head>. Don’t settle untuk “somewhere in the first 1024 bytes” (terjemahan) “somewhere di pertama 1024 bytes” — put <meta charset="utf-8"> sebelum Anda <title>, <link>, <script>, <style>, dan setiap lainnya tag. ini adalah placement modern tooling memeriksa. There’s sebuah open Lighthouse issue (#10023) proposing sebuah audit itu specifically memeriksa whether <meta charset> equals document.head.firstElementChild — i.e. flagging tag when ini isn’t literal pertama element di head, not merely when ini adalah missing. direction dari tooling adalah toward memeriksa placement, not hanya presence.

hanya one charset meta element per document, dan ** charset attribute memiliki no effect di XML/XHTML documents** (ini adalah permitted there hanya untuk ease migration untuk dan dari XML). Worth sebuah caveat jika Anda’re berfungsi dengan XHTML-disajikan konten atau RSS/Atom-adjacent templates.

BOM, header HTTP, meta tag — precedence order

browser don’t hanya read meta tag di isolation; encoding-sniffing algorithm memeriksa three sources di sebuah fixed order, dan pertama one itu gives sebuah jawaban wins:

  1. sebuah UTF-8 byte-order mark (BOM) — sebuah few bytes di very start dari file. jika browser detects sebuah BOM, itu determines encoding dengan certainty; nothing else adalah consulted.
  2. ** HTTP Content-Type header’s charset**, jika server mengirim one dan there’s no BOM. ini takes precedence di atas di-document meta declaration.
  3. ** di-document <meta charset> (atau legacy http-equiv) declaration**, diperiksa hanya jika neither dari above supplied sebuah encoding.
Evidence for this claim A UTF-8 BOM takes precedence over HTTP and in-document declarations; otherwise an HTTP charset has higher precedence than meta, so server and document declarations must agree. Scope: HTML documents, HTTP delivery and rendered metadata as applicable Confidence: high · Verified: Declaring character encodings in HTML

dalam praktik, BOMs adalah rare pada hand-authored HTML (mereka’re more umum sebagai sebuah artifact dari certain text editors atau file-export alat), so header-vs-tag conflict adalah one itu bites sebagian besar sering: sebuah halaman itu correctly declares <meta charset="utf-8"> dapat masih render garbled jika sebuah CDN, reverse proxy, atau misconfigured server mengirim sebuah berbeda charset di header. ini adalah sebuah classic symptom right setelah sebuah server atau CDN migration — HTML didn’t perubahan, tetapi header melakukan, dan now header adalah fighting tag. When Anda’re debugging mojibake, periksa untuk sebuah BOM dan respons header charset, not hanya halaman source.

adalah meta charset sebuah SEO peringkat factor?

No — dan ini adalah worth menjadi blunt because fear-based audit-alat copy sometimes implies otherwise. ini adalah sebuah rendering- dan pengindeksan-correctness prerequisite, not sebuah peringkat signal.

Google’s guidance here adalah thin dan indirect dibandingkan dengan tags ini discusses constantly (judul, deskripsi meta, robots, canonical). tidak ada dedicated Google Search Central halaman tentang character encoding — ini adalah one entry inside umum meta tags Google mendukung reference, di bawah “Content-Type and charset.” (terjemahan) “konten-jenis dan charset.” Google’s hanya pada-record line adalah sebuah recommendation, not sebuah peringkat claim: “We recommend using Unicode/UTF-8 where possible.” (terjemahan) “kami recommend menggunakan Unicode/UTF-8 where mungkin.” No verbatim statement dari Mueller, Illyes, Splitt, atau Canel specifically naming “meta charset” (terjemahan) “meta charset” atau “mojibake” (terjemahan) “mojibake” surfaces di trade press atau Search Off Record archives — charset adalah treated sebagai basic web-standards hygiene, table stakes like valid markup, alih-alih sebuah topic warranting SEO commentary.

Bing memiliki no distinct public position pada pada-halaman tag either; -nya documentation references UTF-8 hanya untuk -nya own API/feed formats (IndexNow key files, Webmaster API permintaan headers), not sebagai guidance tentang HTML <meta charset> pada Anda halaman. Since Bingbot adalah sebuah standard HTML parser, practical implication adalah yang sama: ikuti HTML spec’s UTF-8 / 1024-byte aturan.

So where dapat ini hurt Anda? Indirectly, dan hanya when encoding adalah genuinely broken: garbled text adalah sebuah konten-quality dan UX masalah, ini dapat corrupt what appears di snippets, dan severely broken output dapat look broken untuk Google’s pengindeksan sistem too. industry consensus, sebagai Ahrefs’ own meta-tags guide (oleh Joshua Hardwick) puts ini, adalah itu “unless your page is severely broken as a result of charset issues (which is unlikely), the impact is going to be quite minimal.” (terjemahan) “unless Anda halaman adalah severely broken akibatnya dari charset issues (which adalah unlikely), impact adalah going untuk menjadi quite minimal.” Fix ini because broken text adalah buruk, not because Anda expect sebuah peringkat bump.

cara periksa dan fix ini

sebuah quick diagnostic path when Anda suspect sebuah encoding masalah:

  • View source / DevTools. Confirm <meta charset="utf-8"> exists dan adalah pertama child dari <head>. di DevTools, periksa Content-Type respons header untuk sebuah charset nilai — jika ini disagrees dengan tag, header wins dan adalah Anda mungkin culprit. aturan out sebuah BOM too: ini adalah rarer, tetapi jika present ini beats both header dan tag.
  • Validators dan crawler flag ini. W3C validator dan aturan-based checkers (e.g. Rocket Validator’s “charset after the first 1024 bytes” (terjemahan) “charset setelah pertama 1024 bytes” aturan) akan panggil out sebuah late atau missing declaration. situs audits di Ahrefs situs Audit dan Screaming Frog surface charset issues di seluruh sebuah whole situs.
  • Fix right layer. jika placement adalah wrong, move tag untuk top dari head. jika encoding adalah wrong ( bytes themselves aren’t UTF-8, atau header mengirim sebuah conflicting charset), fixing meta tag alone won’t help — Anda memiliki untuk re-encode file sebagai UTF-8 dan/atau correct server’s Content-Type header so header dan tag agree.

fix adalah almost selalu trivial setelah Anda’ve identified which layer adalah di fault. ini adalah sebuah stable, panjang-settled bagian dari HTML spec — there’s no recent deprecation atau platform-perilaku perubahan untuk track; satu-satunya evolving nuance adalah tooling increasingly memeriksa placement, not hanya presence.

Where ini sits

charset tag adalah one dari browser-facing head elements — like viewport tag, ini adalah tentang rendering, not peringkat, which puts ini di sebuah berbeda bucket dari SEO-active tags di meta-tags cluster ( judul element, deskripsi meta, dan robots family). ini adalah adjacent untuk internationalization berfungsi I spend sebuah lot dari time pada: encoding adalah layer underneath hreflang dan multi-script konten — hreflang tells Google which language/region versi untuk sajikan, tetapi jika encoding adalah wrong text di itu versi adalah garbled regardless. untuk full map dari head elements grouped oleh job mereka melakukan, see meta tags hub.

Add an expert note

Pin an expert quote

New person? Create their unclaimed profile at /admin/experts/ → Pin a quote first.