Вебсправочник
Основы веб-разработки

UTF-8: как избежать нечитаемых символов

Согласуем кодировку файла, HTML и HTTP-ответа для русскоязычной страницы.

Зачем это нужно

Кодировка определяет, как байты превращаются в символы. Если документ сохранён одним способом, а браузер интерпретирует его другим, русский текст может стать нечитаемым. Простая замена шрифта обычно не исправляет такую проблему.

Сохраните файл в UTF-8

Выберите UTF-8 в редакторе и проверьте фактическое сохранение. Добавление meta charset не перекодирует уже существующий файл: оно лишь сообщает браузеру ожидаемую кодировку.

Укажите кодировку рано

Разместите meta charset=»utf-8″ в начале head. Серверный Content-Type также должен согласованно указывать charset. При конфликте сначала изучите реальный ответ, а не только исходный файл на компьютере.

Проверьте цепочку данных

Текст может испортиться до браузера: при импорте, чтении файла или обмене с базой. Найдите первый этап, на котором строка стала неверной. Повторное сохранение уже испорченного текста не восстановит исходные символы автоматически.

Важное ограничение

Не выполняйте массовую перекодировку единственной копии материалов. Сначала сохраните оригинал и проверьте результат на небольшом фрагменте.

Контрольная проверка

  • HTML сохранён в UTF-8.
  • Meta и HTTP не противоречат друг другу.
  • Русские буквы, тире и специальные символы проверены.
  • Исходные файлы сохранены перед преобразованием.

Продолжить изучение: meta, структура документа.

Самостоятельный учебный материал. Техническая документация: первоисточник по теме ↗. Если результат отличается, проверьте код и версию браузера.