Непонятные символы на сайте. Как задать кодировку страницы?

Как задать кодировку страницы. Непонятные символы на сайте

  Задаём набор символов

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

Возможно, при заходе на какой-нибудь веб-ресурс, вы обнаруживали, что не понимаете, что там написано :). Лучше сказать, никто не понимает, в том числе и браузер — вместо любого человеческого языка выдаются т.н. «кракозябры».

Суть здесь в том, что браузер не может понять, в какой кодировке показывать текст открытой страницы.

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

непонятные символы в браузере

  Не угадал

На картинке выше сделан скриншот заголовка данной статьи при несовпадении кодировки текста и кодировки в браузере. Т.к. тексты всего проекта web-ru.net в UTF-8, а просмотр был произведён в windows-1251, то показаны такие символы.

Как правило, ответственность за верное отображение всех текстов на веб-странице лежит на вебмастере и чтобы избежать этих маленьких проблем, следует сделать простые технические вещи.

Как задать кодировку страницы сайта?

Есть 3 способа сделать это. Но лучше их сразу совместить.

Файл(ы)

Необходимо чтобы файл страницы, или файлы шаблонов (если сайт на движке) были бы все в одной кодировке, например, в UTF-8. Почитайте, как сменить кодировку файла быстро.

Мета-тег

Нужно добавить на каждую страницу (или в шаблон шапки) специальный мета-тег, сообщающий браузеру о том, какой набор символов ему использовать для отображения текстов. Тег этот стандартный и выглядит обычно так:

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

или

<meta charset=»utf-8″ /> (вариант для HTML 5)

Надо вставить его в раздел <head></head> — лучше в самое начало, сразу после открывающего <head>:

мета-тег charset

  Мета-тег кодировки

Через .htaccess (если ничего не помогает)

Обычно первых двух вариантов достаточно и браузеры отображают текст как надо. Но с некоторыми из них могут быть проблемы и поэтому можно прибегнуть к помощи файла .htaccess.

Для этого в нём нужно прописать такую строчку:

AddDefaultCharset utf-8

Вот и всё. Если вы примените последовательно 3 этих способа задания кодировки на своём проекте, то вероятность того, что всё будет отображено как надо, близка к 100 %.

Как «увидеть», что скрывается за непонятными символами на сайте?

Если вы зашли на веб-страницу, видите «кракозябры» и хотите увидеть нормальный текст, то тут только два пути:

  • сообщить сайтовладельцу, чтобы всё настроил как следует
  • попытаться угадать кодировку самостоятельно. Делается это стандартными средствами браузеров. В Chrome, например, нужно в меню щёлкнуть «Инструменты => Кодировка» и из огромного  списка выбрать подходящий набор символов (т.е. угадать).

К счастью, практически все современные веб-проекты делаются в кодировке UTF-8, которая является «универсальной» для разных алфавитов и поэтому всё менее и менее вероятно увидеть эти непонятные символы в Интернет.

1 Star2 Stars3 Stars4 Stars5 Stars (1 оценок, среднее: 5,00 из 5)
Loading...
Случайные публикации:
  • Облачный сервис Яндекс Диск - приглашения, регистрация и обзорОблачный сервис Яндекс Диск - приглашения, регистрация и обзорВ последнее время т.н. облачные технологии, можно сказать, по...
  • С Новым 2012 годом!С Новым 2012 годом!Новый 2012 год наступил!        ...
  • Яндекс Метрика - гостевой доступ. НастройкаЯндекс Метрика - гостевой доступ. НастройкаЭто небольшая заметка в продолжение темы настройки Яндекс Метрики. Если вы х...
  • Смешные рекламные объявления в Интернете. Часть IСмешные рекламные объявления в Интернете. Часть I...А это, наверное, одна из причин, почему контекст от Бегуна ставят реже чем,
  • Как сделать рекламу в ВКонтакте? Таргетинг, переходы/показы, картинки и цены. ВидеоурокКак сделать рекламу в ВКонтакте? Таргетинг, переходы/показы, картинки и цены. ВидеоурокКак-то не нравился мне сайт vk.com... Точнее не сайт, а то, что столь...
Оставьте комментарий:
Один отзыв
  1. Олег:

    Интересная статья =)

    Ответить
Я не спамлю...