Как пользоваться: Инспектор Unicode-символов
- Вставьте текст, который ведёт себя странно: slug, который не совпадает, код, который не компилируется, или поле CMS с непонятным пропуском.
- Посмотрите на сводку: невидимые символы, необычные пробелы и похожие буквы подсчитываются и подсвечиваются красным или жёлтым.
- Нажмите на любой символ в строке, чтобы перейти к его строке с именем, кодовой точкой, UTF-8 байтами, HTML-сущностью и экранированием для CSS/JS.
- Нажмите Удалить невидимые символы, Нормализовать пробелы и кавычки или Преобразовать в простой ASCII, а затем скопируйте очищенный текст.
Почему невидимые символы вызывают ошибки
Текст, скопированный из Word, Google Docs, PDF, Slack или чатов с ИИ, часто содержит символы, которых не видно: пробелы нулевой ширины (U+200B), неразрывные пробелы (U+00A0), мягкие переносы, метки порядка байтов (U+FEFF) или направляющие метки. Из-за них slug в CMS отличается от введённого, ломаются JSON и CSS, поиск перестаёт находить нужное, а две «одинаковые» строки оказываются разными.
| Символ | Код | Типичный источник |
|---|---|---|
| Пробел нулевой ширины | U+200B | Веб-страницы, мессенджеры, ответы ИИ |
| Неразрывный пробел | U+00A0 | Word, Google Docs, в HTML |
| Метка порядка байтов | U+FEFF | Файлы, сохранённые как «UTF-8 с BOM» в Windows |
| Мягкий перенос | U+00AD | Инструменты переноса, Генератор мягкого переноса |
| Метка слева направо / справа налево | U+200E / U+200F | Двуязычный текст, номера телефонов |
Похожие буквы (гомоглифы)
Кириллическая «а» и греческая «ο» выглядят точно так же, как латинские «a» и «o», но это разные символы. Они встречаются в скопированном тексте и в фишинговых доменах. Инспектор отмечает буквы из другого алфавита, если они смешаны с латинскими словами.
Кодовые точки, UTF-8 и экранирование
У каждого символа есть кодовая точка (например, U+1F680). В вебе она хранится как от 1 до 4 байт UTF-8, поэтому в ограничениях по байтам «é» занимает 2 байта, а 🚀 — 4. В разметке используйте HTML-сущность, в CSS content — \1F680, а в JavaScript — \u{1F680}. Для целых строк используйте HTML Entity Encoder или URL Encoder, а для эмодзи и символов загляните в Выбор эмодзи и Текстовые символы.
Также ищут как: поиск невидимых символов, удалить невидимые символы, пробел нулевой ширины удалить, utf-8 байты символа, проверка гомоглифов, что за символ, найти скрытые символы.
Инструменты, которые хорошо сочетаются с Инспектор Unicode-символов
- Генератор slug — Превратите любой заголовок в чистый URL-slug в нижнем регистре.
- Умные кавычки → прямые — Код, скопированный из Slack, Notion, Word или блога, не запускается?
- Генератор ASCII-арта — Введите слово и сразу увидите его в 20 шрифтах ASCII-арта — Standard, Slant, ANSI Shadow, Doom и других.