HTML Entities
Войдите или зарегистрируйтесь, чтобы сохранять инструменты в избранное
Кодирование и декодирование HTML-сущностей
Кодирование HTML-сущностей для безопасной вставки текста в HTML-документы.
Заменяет специальные символы: < на <, > на >, & на &, " на ".
Предотвращает XSS-атаки и некорректное отображение HTML-кода на странице.
HTML Entities — кодирование и декодирование HTML-сущностей
HTML-сущности (HTML entities) — это специальные последовательности символов для отображения символов, имеющих особое значение в HTML (<, >, &) или отсутствующих на клавиатуре. Кодирование необходимо для предотвращения XSS-атак и корректного отображения контента.
Основные HTML-сущности
| Символ | Именованная | Числовая (dec) | Числовая (hex) |
|---|---|---|---|
| & | & | & | & |
| < | < | < | < |
| > | > | > | > |
| " | " | " | " |
| ' | ' | ' | ' |
| Пробел (неразрывный) | |   |   |
| © | © | © | © |
| ® | ® | ® | ® |
| € | € | € | € |
Именованные vs числовые сущности
Именованные (&, ) — читаемые, запоминаемые. Поддерживаются только HTML-стандартом. Числовые десятичные (&) — работают для любого Unicode-символа. Числовые шестнадцатеричные (&) — то же, но в hex-нотации. Все три варианта эквивалентны и поддерживаются всеми браузерами.
Предотвращение XSS-атак
XSS (Cross-Site Scripting) — внедрение вредоносного JS через пользовательский ввод. Кодирование HTML-сущностей предотвращает интерпретацию тегов браузером: строка <script>alert(1)</script> после кодирования отображается как текст, а не выполняется. Всегда кодируйте пользовательский ввод перед выводом в HTML.
Часто задаваемые вопросы
Когда нужно кодировать HTML-сущности?
Всегда при выводе пользовательского контента в HTML. Особенно важно для атрибутов тегов, содержимого <script> и URL-параметров.
Нужно ли кодировать кириллицу?
В UTF-8 документах — нет. Браузеры корректно отображают кириллицу без кодирования. Кодирование кириллицы в числовые сущности делает код нечитаемым без пользы.
Чем отличается от обычного пробела?
Неразрывный пробел ( ) не позволяет браузеру переносить строку в этом месте и гарантирует отображение нескольких пробелов подряд (браузер схлопывает несколько обычных пробелов в один).
Для URL-кодирования используйте URL Encoder, а для работы с Base64 — Base64 кодер.
Полезные статьи
WCAG контрастность: доступность цветов в веб-дизайне
Как проверить контрастность цветов по стандарту WCAG 2.1. Уровни AA и AAA, формула расчёта, рекомендации.
CSS Border Radius: скругление углов элементов
Как использовать border-radius: синтаксис, сокращённая запись, эллиптические углы. Генератор border-radius онлайн.