HTML Entity кодировщик
Что такое HTML-сущности (entities)
HTML-сущности (entities) -- это специальные последовательности символов, которые представляют зарезервированные или специальные символы в HTML. Они начинаются с амперсанда (&) и заканчиваются точкой с запятой (;). Без корректного кодирования браузер может неправильно интерпретировать ваш код, а сайт становится уязвимым для XSS-атак.
Зарезервированные символы
Символы <, >, & и кавычки имеют специальное значение в HTML-разметке. Если их нужно показать как текст, а не как часть тега, используйте сущности. Например, чтобы отобразить знак < в тексте, запишите его как < -- иначе браузер воспримет его как начало HTML-тега.
Специальные символы
Символы авторского права, товарных знаков, валют, математические знаки и типографские символы нельзя набрать с обычной клавиатуры. HTML-сущности предоставляют удобный способ вставки таких символов: © для авторского права, ™ для товарного знака, € для евро.
Типографика
Для русскоязычных текстов особенно важны кавычки-ёлочки (« и »), длинное тире (—), среднее тире (–), многоточие (…) и неразрывный пробел ( ). Правильная типографика делает текст профессиональным и читаемым.
Где применяется кодирование HTML-сущностей
Правильное кодирование спецсимволов -- обязательная практика для любого веб-проекта. Вот основные сценарии использования.
Защита от XSS-атак
Кодирование пользовательского ввода -- первый рубеж защиты от межсайтового скриптинга (XSS). Без экранирования символов < и > злоумышленник может внедрить вредоносный JavaScript в вашу страницу.
Обфускация email-адресов
Кодирование email-адресов через числовые HTML-сущности затрудняет работу спам-ботов, которые сканируют страницы в поисках адресов. Пользователь увидит обычный адрес, а парсер -- набор кодов.
Правильная типографика
Кавычки-ёлочки, длинные тире, неразрывные пробелы и другие типографские символы делают текст профессиональным. HTML-сущности гарантируют корректное отображение во всех браузерах и кодировках.
Работа с кодом в HTML
При публикации примеров кода на веб-странице все угловые скобки и амперсанды должны быть закодированы, иначе браузер интерпретирует их как разметку вместо того, чтобы показать как текст.
Кроссбраузерная совместимость
HTML-сущности одинаково работают во всех браузерах и на всех платформах, в отличие от прямой вставки Unicode-символов, которая может зависеть от кодировки документа и шрифта.
RSS-ленты и XML
В RSS, Atom и XML-документах кодирование спецсимволов строго обязательно. Даже одиночный амперсанд без кодирования сломает валидность документа и не даст парсерам его обработать.
Три формата/ сравнение HTML-сущностей
Стандарт HTML определяет три способа записи сущностей. Каждый имеет свои преимущества и ограничения.
Именованные (Named Entities)
Читаемые человеком мнемоники. Легко запомнить и поддерживать в коде. Определено около 2000 имён в стандарте HTML5. Самые частые: &, <, >, ", , ©, —.
& < > " © — « »Плюс: читаемость. Минус: не для всех символов существуют имена.
Числовые (Numeric / Decimal)
Записываются как &#код; где код -- десятичный номер символа в Unicode. Работают для любого символа Unicode, включая редкие. Универсальны, но менее читаемы.
& < > " © — « »Плюс: покрывают все Unicode-символы. Минус: числа трудно запомнить.
Шестнадцатеричные (Hex)
Записываются как &#xкод; где код -- шестнадцатеричный номер Unicode. Удобны при работе с Unicode-таблицами, где коды символов указаны в hex-формате (U+0026 = &).
& < > " © — « »Плюс: соответствуют Unicode Code Point. Минус: менее привычны.
Рекомендация: используйте именованные сущности для основных символов (&, <, >, ", ) -- они читаемы и легко поддерживаются. Для остальных символов подойдут числовые.
Кодировка UTF-8: если ваш документ использует UTF-8 (а в 2025 году это стандарт), большинство спецсимволов можно вставлять напрямую. Кодирование обязательно только для < > & и кавычек в атрибутах.
Популярные HTML-сущности
Полная таблица часто используемых HTML-сущностей с разбивкой по категориям. Все три формата записи для каждого символа.
!Зарезервированные символы HTML
| Символ | Описание | Named | Numeric | Hex |
|---|---|---|---|---|
| & | Амперсанд | &amp; | &#38; | &#x26; |
| < | Меньше | &lt; | &#60; | &#x3C; |
| > | Больше | &gt; | &#62; | &#x3E; |
| " | Двойная кавычка | &quot; | &#34; | &#x22; |
| ' | Апостроф | &apos; | &#39; | &#x27; |
«Русская типографика
| Символ | Описание | Named | Numeric | Hex |
|---|---|---|---|---|
| « | Кавычка-ёлочка открывающая | &laquo; | &#171; | &#xAB; |
| » | Кавычка-ёлочка закрывающая | &raquo; | &#187; | &#xBB; |
| — | Длинное тире (em dash) | &mdash; | &#8212; | &#x2014; |
| – | Среднее тире (en dash) | &ndash; | &#8211; | &#x2013; |
| … | Многоточие | &hellip; | &#8230; | &#x2026; |
| ␣ | Неразрывный пробел | &nbsp; | &#160; | &#xA0; |
©Знаки и символы
| Символ | Описание | Named | Numeric | Hex |
|---|---|---|---|---|
| © | Копирайт | &copy; | &#169; | &#xA9; |
| ® | Зарег. товарный знак | &reg; | &#174; | &#xAE; |
| ™ | Товарный знак | &trade; | &#8482; | &#x2122; |
| € | Евро | &euro; | &#8364; | &#x20AC; |
| ₽ | Рубль | &#8381; | &#8381; | &#x20BD; |
| ° | Градус | &deg; | &#176; | &#xB0; |
| ± | Плюс-минус | &plusmn; | &#177; | &#xB1; |
Советы по работе с HTML-сущностями
Практические рекомендации для правильного использования HTML entities в ваших проектах.
1Всегда кодируйте пять символов
Минимум пять символов должны быть закодированы в любом HTML-документе: амперсанд (&), угловые скобки (< и >), двойные кавычки (") в атрибутах. Это базовое правило защиты от поломки разметки и XSS-атак.
2Используйте UTF-8 в meta-теге
Убедитесь, что в вашем HTML-документе указана кодировка: <meta charset="UTF-8">. С UTF-8 можно вставлять кириллицу, символ рубля и другие символы напрямую, кодируя только зарезервированные HTML-символы.
3Не забывайте про неразрывный пробел
Символ предотвращает перенос строки между словами. Используйте его между инициалами и фамилией (А. С. Пушкин), после предлогов (в Москве) и перед единицами измерения (100 кг). Это стандарт русской типографики.
4Серверная сторона: всегда экранируйте
При выводе пользовательских данных на страницу серверный код обязан экранировать спецсимволы. В PHP -- htmlspecialchars(), в Python -- html.escape(), в JS/React -- автоматическое экранирование JSX. Никогда не вставляйте пользовательский ввод напрямую (innerHTML).
5Проверяйте валидность HTML
Используйте инструменты разработчика и W3C Validator для проверки корректности HTML-сущностей. Часто встречающаяся ошибка -- амперсанд без кодирования в URL-параметрах внутри href: ?a=1&b=2 вместо ?a=1&b=2.
6Используйте кавычки-ёлочки
По правилам русской типографики используются кавычки-ёлочки («...»), а не прямые ("...") или английские (“...”). Для вложенных кавычек -- „ёлочки внутри ёлочек". В HTML: «текст».
Как пользоваться кодировщиком
Простая пошаговая инструкция для кодирования и декодирования HTML-сущностей.
Выберите режим
Переключитесь между Encode (кодирование) и Decode (декодирование) в верхней панели. Encode конвертирует символы в HTML-сущности, Decode -- обратно.
Настройте формат
В режиме кодирования выберите формат: именованные (&), числовые (&#) или hex (&#x). Включите опцию "кодировать все символы" при необходимости.
Вставьте текст
Введите или вставьте текст в левое поле. Результат появится мгновенно в правом поле без нажатия кнопок. Конвертация происходит в реальном времени.
Скопируйте результат
Нажмите кнопку "Копировать", чтобы скопировать результат в буфер обмена. Или используйте справочник внизу для быстрого копирования конкретных сущностей.
Часто задаваемые вопросы
Был ли этот калькулятор полезен?
Инструмент справочный — не заменяет эксперта
Только для информационных целей. Все расчёты, результаты и данные, предоставляемые инструментом, носят исключительно ознакомительный и справочный характер. Они не являются профессиональной консультацией — медицинской, юридической, финансовой, инженерной или иной.
Точность результатов. Калькулятор основан на общепринятых формулах и методиках, однако фактические результаты могут отличаться в зависимости от индивидуальных условий, исходных данных и применяемых стандартов. Мы не гарантируем полноту, точность или актуальность приведённых расчётов.
Профессиональные решения — медицинские, финансовые, инженерные — должны приниматься только после консультации с квалифицированным специалистом. Не используйте автоматический расчёт как единственное основание для важных решений.
Ограничение ответственности. Авторы и разработчики сервиса не несут ответственности за прямой или косвенный ущерб, возникший из-за использования данных расчётов. Пользователь принимает на себя всю ответственность за интерпретацию результатов.
Похожие калькуляторы
URL Encode/Decode
Кодирование и декодирование URL-параметров онлайн. Поддержка кириллицы, percent-encoding, разбор URL на компоненты.
/url-encode-decodeJSON форматтер и валидатор
Онлайн форматирование, валидация и минификация JSON с русским интерфейсом. Подсветка синтаксиса, древовидный просмотр, статистика и проверка ошибок.
/json-formatterRegex-тестер с русской документацией
Онлайн тестирование регулярных выражений с подсветкой совпадений, захватом групп и русскоязычной документацией. Шпаргалка по синтаксису regex.
/regex-tester-ruКалькулятор размера бандла (JS/CSS)
Оценка итогового размера фронтенд-сборки по зависимостям. Сравнение пакетов, бюджет бандла, рекомендации по оптимизации.
/razmer-bandla-js-cssBase64 кодировщик/декодировщик
Кодирование и декодирование Base64 онлайн с поддержкой UTF-8 и кириллицы. Base64URL, Data URI, статистика размера.
/base64-encoder-decoderГенератор паролей (безопасный)
Создать надежный пароль онлайн. Настройка длины, символов. Оценка сложности и энтропии.
/password-generatorКалькулятор типографики: Type Scale, межстрочный, Fluid Typography
Комплексный типографический калькулятор. Модульная шкала (Type Scale), расчёт межстрочного интервала (line-height), оптимальная длина строки, вертикальный ритм (baseline grid), подбор пар шрифтов и Fluid Typography с CSS clamp().
/typography-calculatorКалькулятор пропорций золотого сечения
Расчёт пропорций по золотому сечению (φ = 1.618). Визуализация золотого прямоугольника и спирали Фибоначчи.
/zolotoe-sechenieКонвертер типографских единиц
Конвертация между пунктами, мм, пикселями, em/rem. Типографская шкала, пика, цицеро, дюймы.
/konverter-tipografskih-edinicJWT декодер
Декодирование и анализ JWT-токенов онлайн. Просмотр header, payload и signature с русскоязычными пояснениями. Проверка срока действия токена.
/jwt-decoderMarkdown-редактор с превью
Онлайн Markdown-редактор с мгновенным предпросмотром HTML. Панель инструментов, подсветка синтаксиса, экспорт в HTML.
/markdown-editorЧекер HTTP-заголовков сайта
Анализ заголовков безопасности HTTP: CSP, HSTS, X-Frame-Options. Визуальный конструктор CSP, рекомендации.
/checker-http-zagolovkovСчётчик символов и слов
Подсчёт символов, слов, предложений, абзацев. Время чтения, частота слов, проверка длины SEO-тегов.
/schyotchik-simvolov-slovГенератор Cubic Bezier (CSS transition)
Интерактивный генератор кривых Безье для CSS анимаций. Визуальная настройка плавности переходов, пресеты (ease, linear) и копирование кода.
/cubic-bezierКалькулятор код-ревью: время, размер PR, дефекты, нагрузка
Комплексный калькулятор код-ревью: оценка времени проверки кода, анализ размера PR (XS/S/M/L/XL), покрытие ревью и bus factor, плотность дефектов и escape rate, нагрузка команды ревьюеров, метрики качества (churn, rework, first-pass yield).
/code-review-calculator