====== HTML a meta tagy kódování ====== Správná deklarace kódování v dokumentu HTML zajišťuje, že prohlížeč správně zobrazí speciální znaky, symboly a diakritiku (např. č, ř, ž). V dnešní době je standardem používání univerzálního kódování [[it:sw:unicode|UTF-8]]. ===== 1. Meta tag charset v HTML5 ===== V moderním standardu HTML5 je deklarace kódování maximálně zjednodušena. Používá se k tomu element `` umístěný v sekci `
`.
Moje encyklopedie
...
---
===== 2. Proč musí být tag na začátku? =====
Prohlížeč začíná číst soubor odshora dolů. Doporučuje se umístit `` jako **úplně první prvek** v sekci ``.
* Prohlížeč musí znát kódování dříve, než narazí na jakýkoliv text (včetně tagu `
---
===== 4. Vztah mezi HTML tagem a HTTP hlavičkou =====
Kódování může být definováno na dvou místech:
1. **HTTP hlavička:** Server pošle informaci v rámci odpovědi (`Content-Type: text/html; charset=UTF-8`).
2. **HTML Meta tag:** Definice přímo v souboru.
**Pravidlo priority:** Pokud server pošle informaci v HTTP hlavičce, má tato informace obvykle přednost před tím, co je napsáno v HTML souboru. Proto je důležité mít správně nastavený i webový server (např. Apache nebo Nginx).
---
===== 5. Časté chyby a řešení =====
==== Problém: Diakritika je poškozená (např. é místo é) ====
* **Příčina:** Soubor je uložen v kódování UTF-8, ale v HTML je deklarováno `ISO-8859-1` (nebo naopak).
* **Řešení:** Vždy se ujistěte, že fyzické kódování souboru v textovém editoru (např. VS Code, Notepad++) odpovídá deklaraci v meta tagu.
==== Problém: Záhadné znaky na začátku stránky (BOM) ====
* **Příčina:** Soubor obsahuje neviditelnou značku [[it:sw:unicode#bom|Byte Order Mark]].
* **Řešení:** Uložte soubor v editoru jako "UTF-8 bez BOM".
[Image showing a text editor's encoding selection menu: UTF-8 vs Windows-1250]
----
//Související články://
* [[it:sw:unicode|Standard Unicode a UTF-8]]
* [[it:net:http_protocol|HTTP protokoly a hlavičky]]
* [[it:net:web_servers|Konfigurace webových serverů]]
//Tagy: {{tag>web-development html meta-tags encoding utf-8 frontend}}//