Как настроить кодировку сайта самостоятельно: UTF-8, charset и исправление ошибок

Краткое саммари

Для новых сайтов почти всегда выбирают кодировку UTF-8: ее понимают браузеры, CMS, базы данных и поисковые роботы. Если charset не указан или HTTP-заголовок конфликтует с мета-тегом, на странице могут появиться «кракозябры», а пользователи быстро закроют сайт.

Проверять кодировку лучше в трех местах: в исходном коде страницы, в HTTP-заголовке Content-Type и в настройках базы данных.

Кому стоит прочитать эту статью:

• владельцам сайтов, у которых слетела кодировка или вместо текста появились непонятные символы;
• веб-мастерам и SEO-специалистам, которые проверяют техническое состояние сайта перед индексацией в Яндексе и Google;
• разработчикам, которые переносят сайт, меняют CMS, сервер, хостинг или базу данных;
• тем, кто хочет понять, где указать charset UTF-8 в HTML, .htaccess, Apache, nginx и MySQL.

Зачем нужна кодировка сайта и charset

Кодировка (charset) — способ сопоставить символы с числовыми значениями, чтобы браузер показал текст правильно. О ней может сообщать HTTP-заголовок Content-Type, например text/html; charset=UTF-8, и мета-тег в блоке head HTML-страницы.

Если кодировка сервера и страницы не совпадает, браузер декодирует текст неверно. В результате контент на сайте отображается как набор бессвязных букв, иероглифов и символов, в народе называемых «кракозябрами». Такой текст прочитать невозможно, так что пользователь просто уйдет с сайта и найдет другой ресурс. Или останется, если ему не очень важно содержание:

Google рекомендует указывать сведения о кодировке явно. В HTML-разметке лучше использовать короткую запись <meta charset="utf-8"> и размещать ее как можно ближе к началу head, чтобы браузер не угадывал кодировку.

Кодировка влияет на SEO?

Разберемся, как кодировка сайта влияет на индексацию в Яндексе и Google и почему ошибка charset может ухудшить поведенческие метрики.

Яндекс четко заявляет:

«Тип используемой на сайте кодировки не влияет на индексирование сайта. Если ваш сервер не передает в заголовке кодировку, робот Яндекса также определит ее самостоятельно».

Позиция Google такая же. Поисковики не рассматривают Charset как фактор ранжирования или сигнал для индексирования, тем не менее, она косвенно влияет на трафик и позиции.

Если кодировка сервера не совпадает с той, что указана на сайте, пользователи увидят нечитабельные символы вместо контента. На таком сайте сложно что-либо понять, так что скорее всего пользователи сбегут, а на сайте будут расти отказы.

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

FAQ по разделу

Кодировка сайта влияет на ранжирование?

Напрямую нет, но если из-за ошибки charset текст нечитаем, растут отказы и падает качество страницы для пользователя.

Что важнее, HTTP-заголовок или мета-тег charset?

Если сервер передает charset в HTTP-заголовке, браузер обычно ориентируется на него. Поэтому важно, чтобы заголовок и мета-тег не конфликтовали.

Нужно ли указывать кодировку, если сайт работает нормально?

Да, явное указание UTF-8 снижает риск ошибок после переноса сайта, смены хостинга или обновления CMS.

Виды кодировок: UTF-8, Windows-1251 и что выбрать

Кодировок много, но в веб-разработке для русскоязычных сайтов чаще всего встречаются два варианта: современная UTF-8 и наследственная Windows-1251.

UTF-8 — стандарт для современных сайтов

Unicode Transformation Format — универсальный стандарт кодирования, который работает с символами почти всех языков мира. В UTF-8 символы занимают от 1 до 4 байт, поэтому кодировка подходит для мультиязычных сайтов, emoji, спецсимволов и интерфейсов на разных языках.

Есть несколько вариантов Unicode — UTF-8, UTF-16, UTF-32, но для HTML-страниц в вебе обычно используют UTF-8.

Windows-1251 — устаревающая кодировка кириллицы

Windows-1251 — однобайтовая кодировка для кириллицы, созданная на базе кодировок, использовавшихся в русификаторах Windows. Раньше она часто встречалась на русскоязычных сайтах, но сейчас  остается только в старых проектах, архивах, самописных CMS и базах данных, которые давно не переносили на UTF-8.

Выбор кодировки остается на усмотрение веб-мастера, но для нового сайта лучше выбирать UTF-8. Ее поддерживают все популярные браузеры и поисковики, она удобнее для многоязычного контента и помогает избежать проблем при интеграции с внешними сервисами.

FAQ по разделу

Можно ли смешивать UTF-8 и Windows-1251?

Нет, разные кодировки в файлах, базе данных и HTTP-заголовках — частая причина «кракозябр».

UTF-8 подходит для русского языка?

Да, она правильно хранит кириллицу, латиницу, знаки пунктуации, emoji и символы других языков.

Как определить кодировку на сайте

Определить кодировку страницы своего или чужого сайта можно через исходный код. Откройте страницу, выберите «Просмотр кода страницы» или нажмите Ctrl+U в браузере и найдите упоминание charset внутри тега head.

На странице сайта используется кодировка UTF-8:

Узнать вид кодирования можно с помощью сервиса для анализа сайта. Сервис проверяет в том числе и техническую сторону ресурса: анализирует серверную информацию, определяет кодировку, проверяет редиректы и другие пункты.

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

Проверить кодировку еще можно через сервис Validator.w3, о котором писали в статье о проверке валидации кода. Нужная надпись находится внизу страницы.

Если валидатор не обнаружит Charset, он покажет ошибку:

Но валидатор проверяет прежде всего синтаксис разметки. Для полной проверки charset дополнительно посмотрите HTTP-заголовок Content-Type в DevTools браузера, командой curl -I https://site.ru/ или в Яндекс Вебмастере, если сайт подтвержден.

FAQ по разделу

Где быстрее всего посмотреть кодировку сайта?

В исходном коде страницы по поиску charset. Затем проверьте HTTP-заголовок Content-Type.

Почему сервис не видит ошибку кодировки?

Он может проверять только HTML-разметку. Если проблема в базе данных, CMS или серверных заголовках, нужна ручная проверка всех уровней.

Если кодировка не отображается: как исправить кракозябры на сайте

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

О проблеме на вашем сайте будут сигнализировать метрики поведения: вырастут отказы, уменьшится глубина просмотров, снизятся конверсии. Но чаще всего ошибку видно сразу: вместо нормального текста появляются непонятные символы.

Главное правило — для всех файлов, шаблонов, скриптов, базы данных, подключения к БД и сервера должна быть указана одна кодировка. Ошибка часто возникает после переноса сайта на новый хостинг, импорта дампа MySQL или обновления старой CMS.

Яндекс советует использовать одинаковую кодировку для страниц и кириллических адресов структуры. К примеру, если робот встретит ссылку href="/корзина" на странице с кодировкой UTF-8, он сохранит ее в этом же UTF-8, так что страница должна быть доступна по адресу "/%D0%BA%D0%BE%D1%80%D0%B7%D0%B8%D0%BD%D0%B0".

FAQ по разделу

Что проверить первым, если слетела кодировка?

Начните с HTTP-заголовка Content-Type и мета-тега charset. Если там разные значения, приведите их к UTF-8.

Почему проблема появилась после переноса сайта?

Дамп базы, файлы шаблона или настройки сервера могли перенести в другой кодировке. Проверьте кодировку файлов, таблиц, колонок и подключения к базе.

Можно ли исправить только одну страницу?

Да, если ошибка локальная. Но если «кракозябры» видны в разных разделах, нужно проверять весь стек: HTML, сервер, CMS и БД.

Где указать кодировку сайта: HTML, сервер, .htaccess и база данных

У всех таблиц, колонок, файлов, сервера и всего, что связано с сайтом, должна быть одна кодировка. Для современного сайта обычно приводят все к UTF-8/utf8mb4:

• кодировка в мета-теге HTML;
• кодировка в HTTP-заголовке сервера;
• кодировка в настройках Apache/httpd.conf, .htaccess или nginx;
• кодировка документа и файлов шаблона;
• кодировка в базе данных MySQL или MariaDB.

Кодировка в мета-теге

Добавьте указание кодировки в head файла шаблона сайта. Для HTML5 достаточно короткого мета-тега charset.

При создании HTML-документа укажите meta charset в начале блока head. По стандарту объявление кодировки должно попадать в первые 1024 байта документа, поэтому не ставьте его после длинных скриптов, стилей и комментариев.

Мета-тег может выглядеть так:

<meta http-equiv="Content-Type" content="text/html; charset=utf-8">

или так:

<meta charset="utf-8">

В HTML5 они эквивалентны, но короткая запись <meta charset="utf-8"> проще и используется чаще.

В темах WordPress и других популярных CMS тег charset обычно указан по умолчанию, но его стоит проверить после смены темы, шаблона или плагина оптимизации.

Кодировка в файле httpd.conf

Инструкции для сервера Apache находятся в файле httpd.conf. Путь зависит от хостинга и ОС: часто это /etc/apache2/, /etc/httpd/ или каталог панели управления хостингом.

Если нужно сменить кодировку Windows-1251 на UTF-8, замените строку AddDefaultCharset windows-1251 на AddDefaultCharset UTF-8. Перед правкой проверьте, не задается ли charset еще и в настройках виртуального хоста или CMS.

Осторожнее: если вы измените в файле кодировку по умолчанию, то она изменится для всех проектов на этом сервере.

Убедитесь, что сервер не передает HTTP-заголовки с конфликтующими кодировками. Для nginx charset обычно настраивают директивой charset utf-8; в нужном server или location-блоке.

Кодировка в .htaccess

Если сайт работает на Apache и хостинг разрешает переопределения, добавьте кодировку в файл .htaccess:

1. Откройте панель управления хостингом или файловый менеджер.
2. Перейдите в корневую папку сайта.
3. В файле .htaccess добавьте в самое начало код:
   1. для UTF-8 — AddDefaultCharset UTF-8;
   2. для старого проекта на Windows-1251 — AddDefaultCharset WINDOWS-1251.
4. Очистите кэш сайта, CDN и браузера, затем проверьте HTTP-заголовок Content-Type.

Кодировка документа

Готовые файлы HTML важно сохранять в нужной кодировке сайта. Узнать текущую кодировку файла можно через Notepad++: откройте файл и зайдите в «Encoding». Меняется она там же: чтобы сменить кодировку на UTF-8, выберите «Convert to UTF-8 without BOOM». Нужно выбрать «без BOOM», чтобы не было пустых символов.

Кодировка базы данных MySQL и MariaDB

Выбирайте нужную кодировку сразу при создании базы данных. Для современных проектов используйте utf8mb4: она хранит кириллицу, emoji и символы за пределами базовой многоязычной плоскости Unicode. Для MySQL 8 часто выбирают utf8mb4_0900_ai_ci, для совместимости с MariaDB и старыми версиями MySQL — utf8mb4_unicode_ci.

Где менять кодировку у БД:

1. Кликните по названию нужной базы в утилите управления БД phpMyAdmin и откройте ее.
2. Кликните на раздел «Операции»:
   
3. Введите нужную кодировку для базы данных MySQL:
   
4. Перейдите на сайт и очистите кэш.

Для всех таблиц, колонок, файлов, сервера и подключения к базе должна быть одна логика кодировки. Если сайт переводят на UTF-8, базу данных тоже лучше привести к utf8mb4.

С новой БД проще, но если вы меняете кодировку у существующей базы, то у созданных таблиц и колонок заданы свои кодировки, которые тоже нужно поменять.

Проблема может не решиться, если все дело в кодировке подключения к базе данных. Что делать:

1. Подключитесь к серверу с правами mysql root пользователя:
   mysql -u root -p
2. Выберите нужную базу:
   USE имя_базы;
3. Выполните запрос:
   SET NAMES 'utf8’;

Если вы хотите указать Windows-1251, то пишите не «utf-8», а «cp1251» — обозначение для кодировки Windows-1251 у MySQL.

Чтобы установить utf8mb4 по умолчанию, откройте на сервере my.cnf или отдельный конфиг MySQL/MariaDB и добавьте настройки под вашу версию сервера:

В области [client]:

default-character-set=utf8

В области [mysql]:

default-character-set=utf8

В области [mysqld]:

collation-server = utf8_unicode_ci
init-connect='SET NAMES utf8'

character-set-server = utf8

FAQ по разделу

Где указывать charset, в HTML или на сервере?

Лучше в обоих местах, но без противоречий. Мета-тег и HTTP-заголовок должны указывать одну кодировку, обычно UTF-8.

Что выбрать для MySQL: utf8 или utf8mb4?

Выбирайте utf8mb4. Старый utf8 в MySQL не хранит часть символов Unicode и может привести к ошибкам с emoji и редкими символами.

Нужно ли менять .htaccess, если сайт на nginx?

Нет, .htaccess относится к Apache. В nginx кодировку задают в конфигурации сервера, если это нужно для проекта.