Как пользоваться: HTML-сущности
- Выберите Кодировать, чтобы экранировать текст для HTML, или Декодировать, чтобы преобразовать сущности обратно в символы.
- Вставьте текст — результат обновляется по мере ввода.
- При кодировании выберите, какие символы преобразовать (только специальные для HTML или также акценты, символы и эмодзи), и формат сущностей: именованные, десятичные или шестнадцатеричные.
- Нажмите Копировать. Кнопка Поменять местами пропустит результат через обратное преобразование.
Что такое HTML-сущности?
HTML-сущности — это управляющие последовательности, которые представляют символы, иначе интерпретируемые как разметка, или символы, которые трудно набрать с клавиатуры. Они начинаются с & и заканчиваются на ; и существуют в трёх формах: именованной (©), десятичной (©) и шестнадцатеричной (©). Все три выводят символ ©. Кодирование необходимо всегда, когда на веб-странице выводится пользовательский текст или примеры кода: без него <script> в комментарии был бы выполнен, а не показан.
Пять символов, которые нужно экранировать
| Символ | Сущность | Зачем |
|---|---|---|
& | & | Начинает любую сущность |
< | < | Начинает тег |
> | > | Закрывает тег |
" | " | Закрывает значение атрибута в двойных кавычках |
' | ' | Закрывает значение атрибута в одинарных кавычках (' не определена в HTML 4) |
В обычном текстовом содержимом достаточно экранировать & и <. Внутри значений атрибутов нужно экранировать и кавычки. Опция «Только специальные символы HTML» делает именно это и оставляет остальной текст читаемым. Это правильный выбор для страниц в UTF-8, а таких сегодня большинство.
Нужны ли сущности для акцентов и символов?
Если страница отдаётся в кодировке UTF-8 (<meta charset="utf-8">), можно писать é, € или эмодзи напрямую. Кодирование всех не-ASCII символов по-прежнему полезно, когда контент проходит через системы, не работающие с UTF-8: устаревшие CMS, некоторые почтовые шаблоны, XML-фиды или исходные файлы с неизвестной кодировкой. Именованные сущности есть только для ограниченного набора (Latin-1, греческие буквы, распространённые математические и типографские символы). Для всего остального, например эмодзи, используются числовые ссылки: 😀 → 😀.
Полезные сущности
| Сущность | Результат | Применение |
|---|---|---|
| (неразрывный пробел) | Чтобы «10 кг» не разрывалось на две строки |
­ | (мягкий перенос) | Возможный перенос в длинных словах |
— / – | — / – | Тире |
… | … | Многоточие |
“ ” | “ ” | Типографские кавычки |
€ © ™ | € © ™ | Символы |
Как работает декодирование
Декодер распознаёт все 2 231 именованную символьную ссылку, определённую в HTML Living Standard, а также десятичные и шестнадцатеричные ссылки. В пограничных случаях он следует правилам браузеров: – превращается в en dash (по таблице Windows-1252), а недопустимые кодовые точки — в �. Имена сущностей чувствительны к регистру: É — это É, а é — это é. Для URL используйте кодировщик URL, а для бинарных данных — Base64. Нужно преобразовать HTML в читаемый текст? Попробуйте HTML в Markdown.
Также ищут как: html escape, html entities.
Инструменты, которые хорошо сочетаются с HTML-сущности
- HTML форматер — Вставьте минифицированную или неаккуратную разметку и получите чистый HTML с единообразными отступами, включая встроенные блоки <style> и <script>.
- Markdown в HTML — Введите или вставьте Markdown и мгновенно получите чистый HTML: с безопасным живым предпросмотром, таблицами GFM, списками задач и блоками кода с ограждениями.
- Переводчик азбуки Морзе — Введите текст, чтобы получить код Морзе, или вставьте точки и тире, чтобы расшифровать их.
- Конвертер текста в двоичный код — Введите текст, чтобы увидеть его в виде двоичного кода, или вставьте двоичный код (а также hex, восьмеричный или десятичный), чтобы перевести его обратно в читаемый текст.
Часто задаваемые вопросы
Какие символы нужно экранировать в HTML?
& и < в текстовом содержимом, а также " (и ', если используете одинарные кавычки) внутри значений атрибутов. Экранирование > строго не обязательно, но принято.Защищает ли экранирование HTML от XSS?
<script>, обработчиков событий, CSS или URL вида href="javascript:…" этого недостаточно: там нужна обработка с учётом контекста.В чём разница между &nbsp; и обычным пробелом?
подряд не схлопываются в один, как обычные пробелы.Что лучше использовать: именованные или числовые сущности?
é, легче читаются. Числовые работают для любого символа Unicode и в XML, где предопределены только & < > " '.