Когда кодировать
Только пять символов имеют значение в тексте и атрибутах HTML: & начинает сущность, < и > ограничивают теги, а " и ' завершают значения атрибутов. Экранируйте их всякий раз, когда вставляете недоверенный текст в страницу, — и вы защищены от внедрения разметки (XSS в HTML-контексте). Всё остальное, включая буквы с диакритикой, эмодзи и символы, можно писать буквально в документе UTF-8; кодировать их как é — привычка эпохи Latin-1, которая только затрудняет чтение исходника.
Три способа записать символ
| Форма | Пример | Примечания |
|---|---|---|
| Именованная | é → | 2 125 имён в HTML5; читаемы, но в XML без DTD работают только пять базовых. |
| Десятичная | é | Работает везде, включая XML и SVG. |
| Hex | é | Совпадает с нотацией кодовой точки Unicode U+00E9; тоже универсальна. |
Ловушки
— настоящий символ (U+00A0). Он переживает копирование-вставку как невидимый неразрывный пробел и ломает сравнение строк; инспектор Unicode его находит.- Браузеры принимают некоторые устаревшие сущности без точки с запятой (
©,&), поэтому URL вроде?a=1©=2в неэкранированном атрибуте превращается в?a=1©=2. В атрибутах всегда пишите&. - Двойное кодирование (
&lt;) отображается на странице как буквальное<; кодируйте один раз, в момент вывода. - В строках JavaScript HTML-сущности не декодируются; используйте там
\u00E9или задавайтеtextContentи вовсе обходитесь без экранирования.
Вопросы
Что такое ?
Неразрывный пробел, U+00A0: пробел, который запрещает перенос строки и не схлопывается с соседними пробелами. Используйте его между числом и единицей измерения (10 км) и больше нигде.
Нужно ли кодировать буквы с диакритикой?
Нет, если страница отдаётся как UTF-8, как и должна любая современная страница. Пишите é напрямую. Кодируйте только тогда, когда файл может быть сохранён в другой кодировке или когда нужно сделать невидимый символ видимым в исходнике.
Какие сущности работают в XML и SVG?
Только &, <, >, " и ', плюс числовые ссылки. Именованные сущности вроде © вызывают ошибку разбора в XML, если не объявлены.
Как показать HTML-код на веб-странице?
Закодируйте его: каждый < становится <, каждый & — &. Вставьте код в поле «Текст» с первым вариантом кодирования и скопируйте HTML-вывод в блок <pre><code>.