Содержание

Метатеги | htmlbook.ru

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

Метатеги для поисковых механизмов

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

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

Некоторые принципы, относящиеся к метатегам:

  • не включайте ключевые слова, которые не содержатся на ваших страницах;
  • не повторяйте ключевые слова;
  • используйте метатеги по их прямому назначению;
  • делайте описание и список ключевых слов различными для каждой страницы сайта с учетом содержимого.

description

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

Пример 1. Использование Description

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title>description</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
  <meta name="description" content="Сайт об HTML и создании сайтов"> 
 </head> 
 <body> 
  <p>. ..</p>
 </body>
</html>

keywords

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

Пример 2. Использование Keywords

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title>keywords</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="Keywords" content="HTML, META, метатег, тег, поисковая система"> 
 </head>
 <body> 
  <p>...</p>
 </body>
</html>

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

Автозагрузка страниц

Чтобы автоматически загружать новый документ через определенный промежуток времени используется инструкция http-equiv=»refresh» (пример 3).

Пример 3. Автозагрузка страницы

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title>Автозагрузка</title>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta http-equiv="refresh" content="5; URL=http://www.htmlbook.ru"> 
 </head>
 <body> 
  <p>...</p>
 </body>
</html>

Браузер поймет эту запись, как ожидать 5 секунд, а затем загрузить новую страницу, указанную в параметре URL, в данном случае это переход на сайт htmlbook.ru.

Этот метатег позволяет создавать перенаправление (редирект) на другой сайт. Если URL не указан, произойдет автоматическое обновление текущей страницы через количество секунд, заданных в атрибуте content.

Кодировка

Чтобы сообщить браузеру, в какой кодировке находятся символы веб-страницы, необходимо установить параметр <meta http-equiv=»Content-Type» content=»text/html; charset=имя кодировки»>.

Для операционной системы Windows и кириллицы charset обычно принимает значение utf-8 или windows-1251 (пример 4).

Пример 4. Выбор текущей кодировки

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 <head>
  <title>Кодировка</title>
  <meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
 </head>
 <body> 
  <p>Кириллица</p>
 </body>
</html>

Если указание кодировки отсутствует, браузер пытается сам определить, какой тип символов используется в документе и выбирает необходимую кодировку автоматически. Браузер не всегда может точно распознать язык веб-страницы и в некоторых случаях предлагает вьетнамскую кодировку вместо кириллицы. По этой причине лучше всегда указывать приведенную строчку. Тем не менее, возникают обстоятельства, когда указание кодировки может принести определенный вред. Например, веб-сервер автоматически использует перекодирование данных в KOI-8, а браузер, встретив параметр charset=windows-1251, переводит текст в кодировку Windows.

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

HTML Кодировки

Чтобы правильно отобразить html-документ, браузер должен знать какая кодировка символов использовалась при создании документа.
ASCII — одна из самых старых компьютерных кодировок, в которой каждому символу соответствует строго определенное число. Например, символу «a» соответствует число 97, а символу «A» — число 65.
Эта аббревиатура расшифровывается как American Standard Code for Information Interchange (американская стандартная кодировочная таблица для печатных символов и некоторых специальных кодов).
ASCII — это однобайтовая кодировка, в которую изначально заложено всего 128 символов: буквы латинского алфавита, арабские цифры и т.д.

Вы можете посмотреть на полный комплект Печатаемых символов ASCII.

Позже ASCII была расширена (изначально она не использовала все 8 бит), поэтому появилась возможность использовать уже не 128, а 256 (2 в 8 степени) различных символов, которые можно закодировать в одном байте информации.
Такое усовершенствование позволило добавлять в кодировку ASCII символы национальных языков разных стран, помимо уже существующей латиницы.
Вариантов расширенной кодировки ASCII существует очень много по причине того, что языков в мире тоже немало. Думаю, что многие из вас слышали о такой кодировке, как KOI8 (Код Обмена Информацией, 8 бит) — это тоже расширенная кодировка

ASCII. KOI8 включала в себя цифры, буквы латинского и русского алфавита, а также знаки пунктуации, спецсимволы и псевдографику.

Кодировка ISO

Организация Международных стандартов (International Standards Organization) создала диапазон кодировок для различных алфавитов/языков.

Кодировки серии ISO 8859

КодировкаОписание
ISO 8859-1 (Latin-1)Расширенная латиница, включающая символы большинства западноевропейских языков (английский, датский, ирландский, исландский, испанский, итальянский, немецкий, норвежский, португальский, ретороманский, фарерский, шведский, шотландский (гэльский) и частично голландский, финский, французский), а также некоторых восточноевропейских (албанский) и африканских языков (африкаанс, суахили).
В Latin-1 отсутствуют знак евро и заглавная буква Ÿ. Эта кодовая страница считается кодировкой по умолчанию для HTML-документов и сообщений электронной почты. Также этой кодовой странице соответствуют первые 256 символов Юникода.
ISO 8859-2 (Latin-2)Расширенная латиница, включающая символы центральноевропейских и восточноевропейских языков (боснийский, венгерский, польский, словацкий, словенский, хорватский, чешский). В Latin-2, как и в Latin-1, отсутствуют знак евро.
ISO 8859-3 (Latin-3)Расширенная латиница, включающая символы южноевропейских языков (мальтийский, турецкий и эсперанто).
ISO 8859-4 (Latin-4)Расширенная латиница, включающая символы североевропейских языков (гренландский, эстонский, латышский, литовский и саамские языки).
ISO 8859-5 (Latin/Cyrillic)Кириллица, включающая символы славянских языков (белорусский, болгарский, македонский, русский, сербский и частично украинский).
ISO 8859-6 (Latin/Arabic)Символы, используемые в арабском языке. Символы других языков с письмом на основе арабского не поддерживаются. Для корректного отображения текста в кодировке ISO 8859-6 требуется поддержка двунаправленного письма и контекстно-зависимых форм символов.
ISO 8859-7 (Latin/Greek)Символы современного греческого языка. Может использоваться также для записи древнегреческих текстов в монотонической орфографии.
ISO 8859-8 (Latin/Hebrew)Символы современного иврита. Используется в двух вариантах: с логическим порядком следования символов (требует поддержки двунаправленного письма) и с визуальным порядком следования символов.
ISO 8859-9 (Latin-5)Вариант Latin-1, в котором редко используемые символы исландского языка заменены на турецкие. Используется для турецкого и курдского языков.
ISO 8859-10 (Latin-6)Вариант Latin-4, более удобный для скандинавских языков.
ISO 8859-11 (Latin/Thai)Символы тайского языка.
ISO 8859-13 (Latin-7)Вариант Latin-4, более удобный для балтийских языков.
ISO 8859-14 (Latin-8)Расширенная латиница, включающая символы кельтских языков, таких как шотландский (гэльский) и бретонский.
ISO 8859-15 (Latin-9)Вариант Latin-1, в котором редко используемые символы заменены на необходимые для полной поддержки финского, французского и эстонского языков. Кроме того, в Latin-9 был добавлен знак евро.
ISO 8859-16 (Latin-10)Расширенная латиница, включающая символы южноевропейских и восточноевропейских (албанский, венгерский, итальянский, польский, румынский, словенский, хорватский), а также некоторых западноевропейских языков (ирландский в новой орфографии, немецкий, финский, французский). Как и в Latin-9, в Latin-10 был добавлен знак евро.

Для документов на английском и большинстве других западноевропейских языков, широко поддерживается кодирование ISO-8859-1.

Таблица кодов символов ISO-8859-1

В HTML ISO-8859-1 является кодировкой по умолчанию (в XHTML и в HTML5 кодировкой по умолчанию является UTF-8).
При использовании кодировки страницы, отличной от ISO-8859-1, вам необходимо указать это в теге <meta>.

Для HTML4:

<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1">

Для HTML5:

<meta charset="UTF-8">

Примером ANSI-кодировки является всем известная Windows-1251.

Windows-1251 выгодно отличается от других 8 битных кириллических кодировок (таких как CP866 и ISO 8859-5) наличием практически всех символов, использующихся в русской типографике для обычного текста (отсутствует только знак ударения). Она также содержит все символы для других славянских языков: украинского, белорусского, сербского, македонского и болгарского.
Ниже приведены десятичные значения символов кодировки Windows-1251.

Для отображения символов таблицы в HTML-документе воспользуйтесь следующим синтаксисом:

&&num; + код + ;

Кодировка Windows-1251 (CP1251)

 .0.1.2.3.4.5.6.7.8.9.A.B.C.D.E.F
 
8.
 		Ђ
402		Ѓ
403		‚
201A		ѓ
453		„
201E		…
2026		†
2020		‡
2021		€
20AC		‰
2030		Љ
409		‹
2039		Њ
40A		Ќ
40C		Ћ
40B		Џ
40F
 
9.
 		ђ
452		‘
2018		’
2019		“
201C		”
201D		•
2022		–
2013		—
2014		™
2122		љ
459		›
203A		њ
45A		ќ
45C		ћ
45B		џ
45F
 
A.
 		 
A0		Ў
40E		ў
45E		Ј
408		¤
A4		Ґ
490		¦
A6		§
A7		Ё
401		©
A9		Є
404		«
AB		¬
AC		­
AD		®
AE		Ї
407
 
B.
 		°
B0		±
B1		І
406		і
456		ґ
491		µ
B5
B6		·
B7		ё
451		№
2116		є
454		»
BB		ј
458		Ѕ
405		ѕ
455		ї
457
 
C.
 		А
410		Б
411		В
412		Г
413		Д
414		Е
415		Ж
416		З
417		И
418		Й
419		К
41A		Л
41B		М
41C		Н
41D		О
41E		П
41F
 
D.
 		Р
420		С
421		Т
422		У
423		Ф
424		Х
425		Ц
426		Ч
427		Ш
428		Щ
429		Ъ
42A		Ы
42B		Ь
42C		Э
42D		Ю
42E		Я
42F
 
E.
 		а
430		б
431		в
432		г
433		д
434		е
435		ж
436		з
437		и
438		й
439		к
43A		л
43B		м
43C		н
43D		о
43E		п
43F
 
F.
 		р
440		с
441		т
442		у
443		ф
444		х
445		ц
446		ч
447		ш
448		щ
449		ъ
44A		ы
44B		ь
44C		э
44D		ю
44E		я
44F

Таблица кодов символов Windows-1251

Кодировки стандарта UNICODE

Юникод (англ. Unicode) — стандарт кодирования символов, позволяющий представить знаки почти всех письменностей мира, и специальных символов. Представляемые в юникоде символы кодируются целыми числами без знака. Юникод имеет несколько форм представления символов в компьютере: UTF-8, UTF-16 (UTF-16BE, UTF-16LE) и UTF-32 (UTF-32BE, UTF-32LE). (Англ. Unicode transformation format — UTF).
UTF-8 — это в настоящее время распространённая кодировка, которая нашла широкое применение в операционных системах и веб-пространстве. Текст, состоящий из символов Unicode с номерами меньше 128 (область с кодами от U+0000 до U+007F), содержит символы набора ASCII с соответствующими кодами. Далее расположены области знаков различных письменностей, знаки пунктуации и технические символы. Под символы кириллицы выделены области знаков с кодами от U+0400 до U+052F, от U+2DE0 до U+2DFF, от U+A640 до U+A69F.

Кодировка UTF-8 является универсальной и имеет внушительный резерв на будущее. Это делает ее наиболее удобной кодировкой для использования в интернете.

Таблица кодов символов UTF-8 кирилица



Как прописать кодировку в html?

Нужно правильно раскодировать сигналы, которые наш мозг получает из окружающей среды. Проще говоря, следует правильно « настроить » свой взгляд на жизнь. Ну, вроде не полупустой кошелек, а наполовину полный. То есть, требуется использовать нужную кодировку. Для интернета чаще всего правильной является кодировка utf :

Немного о кодировках

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

Но передача текста в цифровом формате происходит совсем иначе, чем у нас на экране. Для перевода текста в машинный код используется двоичная система исчисления, состоящая лишь из 0 и 1.

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


Чаще всего нужно всего лишь поменять кодировку веб-страницы на кодировку utf8. Ведь она является наиболее распространенной во всем интернете.

Кодировка UTF-8

Наиболее распространенная среди стандартизированных и общепринятых текстовых кодировок. Расшифровывается как « восьмибитный формат преобразования Юникода » или « Unicode Transformation Format ».

Стандарт был разработан еще в 1992 году. В настоящее время он широко применяется не только во всемирной паутине, но и на прикладном уровне ( локальные машины и операционные системы ). Основным достоинством кодировки является ее совместимость с ASCII:


ASCII («American standard code for information interchange») еще одна (но более старая) кодировка представления текстовых данных. В ее таблице символов значения печатных и непечатных знаков заданы с помощью чисел в шестнадцатеричной системе исчисления.

При использовании UTF-8 для передачи данных в формате ASCII используются 7 первых битов. Последний ( восьмой ) служит для вывода « мусора » ( некорректно раскодированных данных ). Что при использовании кодировки для латинских символов существенно уменьшает объем текстовых данных.

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

Как установить кодировку в HTML и PHP

Для установки utf 8 кодировки в html используется специальный тег . Он объединяет в себе в форме атрибутов значение метатегов.

Метатеги используются для передачи и хранения информации, предназначенной для браузеров и поисковиков. Одним из атрибутов тега является charset . Он служит для установки кодировки веб-страницы. Пример использования:


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

Кроме этого можно присваивать значения непосредственно заголовкам http , которые передаются вместе с ответом на запрос от браузера к серверу. В таком случае кодировка сайта utf 8 , переданная через заголовок, будет доминирующей над значением, заданным внутри веб-страницы.

Многие из страниц ресурсов не являются статическими, а динамически создаются благодаря использованию серверных языков программирования. Чаще всего для построения сайтов применяют PHP . Поэтому важно знать о его средствах, позволяющих «на лету» поменять кодировку генерируемой веб-страницы.

Для установки и модификации значений заголовка используется функция header() . Ее синтаксис:

Чтобы корректно задать в php кодировку utf 8 , вызов функции header() в коде должен находиться выше всех тегов html .

Глобальные настройки кодировки

Описанные выше методы могут использоваться для отдельных веб-страниц или небольших сайтов. Но что делать, если вы имеете дело с ресурсом, состоящим из нескольких сотен страниц и десятка разделов? Давайте разберемся, как установить кодировку utf 8 для всего сайта.

Для этого нужно вносить изменения в дополнительный файл конфигурации ресурса. Он носит название .htaccess . Сначала его нужно открыть в любом текстовом редакторе, а затем добавить туда строку:


В качестве более глобального способа изменения кодировки стоит рассмотреть пример на основе любого локального сервера. Для большей наглядности мы возьмем Denwer , который довольно широко распространен в наших краях.

Чтобы изменить кодировку всех ресурсов, размещенных на нашем сервере Apache , нужно отредактировать содержимое конфигурационного файла httpd.conf . Он находится по пути:

Как и в предыдущем примере, в нем нужно заменить значение AddDefaultCharset на нужное. В нашем случае это utf-8 :

Изменение кодировки базы данных

Изменение кодировки рассмотрим на примере MySQL . Так как это одна из самых востребованных и распространенных СУБД, применяемых в сайтостроении. Все изменения можно произвести в файле my.ini . В Денвере он находится по пути:

Здесь нужно поменять значение нескольких полей на utf-8 :

  • default-character-set ;
  • character-set-server ;
  • init-connect = «set names» ;
  • default-character-set .

И затем добавить строку skip-character-set-client-handshake :


Подобные изменения можно внести не только для всех баз данных на сервере, но и для отдельно взятой в php базы mysql . Сделать это можно через пользовательский интерфейс оболочки PHPMyAdmin .

Сначала узнаем, какие кодировки установлены по умолчанию в нашей базе данных. Для этого вводим запрос SQL :

Вот какой ответ мы должны получить:


Если какие-либо значения нас не удовлетворяют, то нужно их изменить. Воспользуемся для этого запросом к ядру сервера СУБД:

В результате мы получим новые значения переменных character_set_connection , character_set_results и character_set_client.

К сожалению, не все так просто обстоит с изменением кодировки в таблицах Excel . Для этого придется воспользоваться сторонней программой для перекодирования файлов. Или обработать данные с помощью громоздких функций.

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

Первая серьёзная проблема, с которой сталкиваются большинство новичков при создании HTML-страниц, связана с набором символов (англ. character set). Выражается эта проблема с кодировкой в, так называемых, «кракозябриках», которые мы получаем вместо указанных в HTML-файле символов. В данной статье я хочу остановиться на проблеме с кодировкой подробнее, постараться расставить всё по полочкам и дать варианты решения.

  • Что такое кодировка?
  • Кодировка файла (редактирование в Notepad++)
  • Кодировка отображения (просмотр в браузере)
  • Как указать кодировку HTML-страницы? (метатег charset)
  • Всё ещё есть проблема с кодировкой? (header charset в php)

Что такое кодировка?

Условно говоря, каждый символ (знак) состоит из кода и картинки. Здесь код – это уникальный идентификатор символа в наборе символов, который определяется выбранной кодировкой, а картинка – это визуальное представление символа, которое содержится в файле шрифта в соответствующей коду символа ячейке.

Другими словами, кодировка (англ. charset) – это набор взаимосвязей кодов символов с их визуальными представлениями в шрифте.

Кодировка файла

HTML-страница представляет собой обычный текстовый файл, кодировка которого выбирается при его создании и/или сохранении на запоминающее устройство (жёсткий диск, флэшка и т.д.) .

В случае с Notepad++, кодировка нового документа задаётся в настройках текстового редактора. Выбираем в меню: Опции > Настройки… – и переходим на вкладку «Новый документ». Здесь нас интересует секция «Кодировка». По умолчанию, выбрана кодировка ANSI.


Настройка кодировки нового документа в Notepad++

Напомню, что это кодировка, в которой будет храниться HTML-файл.

Впрочем, Вы всегда можете преобразовать кодировку HTML-страницы, используя соответствующие функции текстового редактора. Например, в Notepad++ для этого кликните пункт меню «Кодировки» и выберите нужное преобразование.


Преобразование кодировки текущей HTML-страницы в Notepad++

В данном случае файл был в кодировке ANSI и я преобразовал его в UTF-8 (без BOM) . О том, что такое этот BOM Вы можете прочитать в моей статье: PHP: как удалить BOM в WordPress — проследовав по этой ссылке.

Кодировка отображения

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

Например, если Вы сохранили HTML-страницу в кодировке ANSI и откроете её в браузере, вместо русских символов Вы можем получить, так называемые, «кракозябрики».


Проблемы с кодировкой отображения HTML-страницы в браузере Firefox

В данном случае нам надо убедиться, что кодировка файла совпадает с кодировкой отображения файла в браузере. Для этого в Firefox кликните иконку меню, а потом пункт «Кодировка». Если такого у Вас нет, кликните пункт «�?зменить» и добавьте элемент «Кодировка» в меню.


Смена кодировки отображения HTML-страницы в браузере Firefox

Как вы видите, браузер отображает файл в кодировке «Юникод» (например, UTF-8) , в то время как файл был сохранён в кодировке ANSI (например, Windows-1251) . Выбрав нужную кодировку, мы получим нужный нам результат.


Проблема с кодировкой решена

В случае с Notepad++ также имеется возможность выбора кодировки отображения. Для этого кликните пункт меню «Кодировки», а потом нужный вариант используемой для отображения кодировки.


Смена кодировки отображения HTML-страницы в Notepad++

В данном случае я изменил кодировку отображения ANSI на UTF-8 (без BOM) .

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

�? так, мы уже разобрались с тем, что такое кодировка и в чём состоит отличие кодировки файла и кодировки отображения. Теперь нам нужно решить проблему с кодировкой, которая заключается в неправильной интерпретации браузером (или любым другим клиентом) кодировки HTML-страницы.

Почему возникают проблемы с кодировкой? Определить кодировку HTML-страницы не просто, а зачастую и не возможно, т.к. у того же браузера нет информации о ней или она указана неправильно.

Для того чтобы указать кодировку HTML-страницы используется специальный метатег. В HTML5 он имеет следующий урезанный вид:

В данном случае указана кодировка UTF-8 (Юникод) .

В более старых версиях HTML этот метатег имеет следующий вид:

Этот метатег создаёт HTTP-заголовок Content-Type , в котором указывается тип документа text/html и его кодировка Windows-1251 (ANSI) .

Лично я рекомендую использовать именно этот вариант, т.к. с ним будет меньше всего проблем. Главное чтобы такой метатег присутствовал в секции HEAD , и указанная в нём кодировка соответствовала кодировке файла. В большинстве случаев этого будет достаточно.

Всё ещё есть проблема с кодировкой?

В некоторых случаях указать метатег с кодировкой HTML-страницы будет недостаточно. Такая проблема может быть вызвана настройками самого сервера, на котором находится файл HTML-страницы. Дело в том, что сервер способен выдавать свой HTTP-заголовок Content-Type , который будет, условно говоря, иметь приоритет перед метатегом.

В данном случае эту проблему можно решить путём внесения изменений в настройки сервера. Я не буду вдаваться в детали данного вопроса и порекомендую лишь отключать всю эту перекодировку через файл .htaccess, например:

Также можно производить изменения HTTP-заголовка Content-Type и программными средствами. В том же PHP для этого используется функция header() , например:

8 декабря 2016 г., 19:56 Удалить комментарий

Я так понимаю, вот я в программе создаю html страницу. Если я в тексте напишу хотя бы один английский символ, то кодировка автоматически станет Юникод?

А в браузере по умолчанию отображаются все страницы в ANSI, поэтому мой файл в Юникоде как раз и будет с кракозябрами?

15 февраля 2017 г., 11:57 Удалить комментарий

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

По сути, действительно, если использовать только буквы на английском, то кодировка часто определяется браузерами как «Кириллица (Windows)» или тип того, просто он не может распознать кодировку не имея «нестандартных» символов.

Впрочем, даже если есть символы и прописан meta тег, не факт, что браузер поймёт в как отображать страницу, т.к. в основном ориентируется на http заголовки сервера.

15 февраля 2017 г., 18:25 Удалить комментарий

спасибо огромное за полезную статью.
но у меня остался таки вопрос. как изменить кодировку по умолчанию в браузере firefox я поняла,зашла в настройки, а там нет нужного мне юникода. файлы создаю в нотепаде++ с юникодом. посоветуйте пожалуйста, как поступить в моем случае. писать в кириллице,чтобы совпадало с фаерфоксом? либо как. а вообще хотела использовать юникод везде))

Автор статьи: Сергей Каминский

При создании сайта у начинающих веб-мастеров часто появляются вопросы: в какой кодировке делать сайт, чем отличается UTF-8 от windows-1251 и как ее прописывать в META Charset HTML-страницы сайта. Ответы на все эти вопросы в данной статье.

Что такое кодировка сайта и как она работает

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

То же самое происходит и с HTML-страницами сайта. Если документ был сохранен, например, в кодировке UTF-8, а в самом документе прописан META-тег указывающий что это кодировка windows-1251, то браузер опять же будет сопоставлять сохраненные в файле данные с таблицей указанной ему кодировки и так как символы закодированы по-разному, то браузер выведет вместо привычного текста непонятный набор символов или же часть букв может быть в нормальном виде, а другие буквы или символы могут выводиться, например, в виде знаков вопроса. Все выше сказанное относится в том числе и к отображению имен файлов.

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

Самые распространенные кодировки

Из предыдущего пункта вы уже знаете что такое кодировка и почему настолько важно правильно прописать ее в коде страниц сайта. Давайте теперь выясним какую из множества кодировок лучше выбрать для будущего сайта. Поскольку самой распространенной и наиболее понятной в освоении всегда была операционная система Windows, то большинство веб-разработчиков создавали HTML-страницы в кодировке windows-1251 (ANSI), которая использовалась по-умолчанию. Но windows-1251 поддерживает не очень большое количество букв и символов, а разработчики хотят использовать в своих текстах различные стрелочки, сердечки, квадратики и другие символы, в том числе есть необходимость совмещать слова из разных языков в одном документе, поэтому на смену ей уже давно пришла более расширенная UTF-8 и большинство разработчиков используют именно эту кодировку.

Проблемы с кодировкой не только в HTML-странице

Сайт, независимо от того является ли он просто набором статических HTML-документов или сложных динамических скриптов генерирующих страницы на лету, размещается на веб-сервере, который также работает с определенной кодировкой. И если сервер выдает информацию в одной кодировке, а ваши страницы или скрипты сохранены в другой кодировке, то опять же могут быть проблемы с отображением страниц в браузере пользователя. Многие хостинги позволяют менять настройки и выбрать кодировку в соответствии с той, которая используется в файлах сайта, через панель управления или же прописать ее в файле .htaccess, если на хостинге используется популярный веб-сервер Apache.

Практически ни один современный сайт не обходится без использования базы данных MySQL и она также может стать источником проблем с кодировкой. Если файлы сайта сохранены в одной кодировке, а информация в базе данных в другой, то на странице та часть информации, которая выводится из базы данных может отображаться в виде все тех же знаков вопросов или других непонятных символов. Чтобы избежать проблем с кодировкой она должна быть одинаковой для веб-сервера, базы данных MySQL, в скриптах, в HTML-страницах сайта и в META-теге, который прописывается в HTML-коде. Если есть проблемы с отображением текста, то проверяйте на наличие проблемы все выше перечисленное.

META Charset HTML-документа

Чтобы сообщить браузеру и поисковым системам в какой кодировке сохранены страницы сайта в их коде прописывается META Charset.

Для кодировки windows-1251:

Для кодировки UTF-8:

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

Другие записи по теме в разделе статьи по HTML и CSS

Кодировка HTML страницы и атрибуты — Знакомство с HTML — codebra

Дополнительное видео по теме

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

Вы когда-нибудь видели на странице в интернете какие-то знаки вопроса, квадратики и прочее вместо текста? Думаю, что видели. Так вот, у этого сайта проблема с кодировкой, вполне возможно разработчик ее не указал. Кодировка, простыми словами, это таблица содержащая набор символов. Для того чтобы добавить кодировку сайта, нужен многофункциональный тег <meta> , о нем написан целый урок. Итак, чтобы браузер понял, какую кодировку вы используете, применяйте эту строку:

Код HTML

<meta charset = "utf-8">

Что такое кодировка?

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

Подробнее о кодировке?

Кодировка ASCII является американской и разрабатывалась для английского языка. Так как, к примеру, французский язык имеет надстрочные знаки, а русский алфавит не похож на английский, был разработан стандарт Unicode для расширения кодировки ASCII. Но и в Unicode, со временем, стало не хватать места для размещения новых символов. Поэтому на основе Unicode создали кодировку UTF-8, которая исправила эти недостатки. UTF-8 позволяет кодировать до 2 миллиардов символов, поэтому она доминирует в интернете.

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

Что такое атрибуты?

Настало время познакомиться с атрибутами в HTML. Вы их уже встречали, просто на них не акцентировалось внимание. Атрибуты – это дополнение к тегам, расширяющее их возможности. Они всегда указываются в открывающемся теге. Атрибут состоит из имени и значения, разделенного знаком равенства.

Имя атрибута необходимо писать в нижнем регистре. Хотя HTML5 и позволяет писать в любом регистре и не использовать кавычки, все же так не рекомендуется делать.

HTML кодировка страницы. В какой кодировке сохранять web-страницу? Урок №14

» HTML кодировка страницы. В какой кодировке сохранять web-страницу? Урок №14

Бывали ли у вас ситуации, когда на web-странице вместо читабельного текста открывались кракозябры? Я уверен, что бывали или, по крайне мере, вы видели их на других сайтах. Если не видели, посмотрите на пример снизу:

Что такое HTML кодировка?
HTML кодировка – это таблицы соответствия кодов и символов алфавита. То есть, наш компьютер по кодировке поменяет код на понятные читабельные буквы.

Популярные кодировки.
На сегодняшний день существуют две самые популярные кодировки в русскоязычном интернете. Это кодировка windows-1251 и utf-8. Частенько веб-мастерам приходится выбирать, в какой кодировке делать им веб-страничку.

В какой кодировке следует сохранять HTML файл?
Большинство веб-мастеров выбирают кодировку utf-8. И это верный выбор, так как в кодировке utf-8 имеются различные знаки (→ ←↓↑ и т. д.), а также есть масса разнообразных специфических символов. Кстати, основная часть движков, как Joomla, WordPress, Drupal работает на кодировке utf-8.

Поэтому я рекомендую вам сохранять HTML файлы в кодировке utf-8.

Как задать кодировку UTF-8  для файла?
Чтобы задать кодировку для HTML файла, используют различные редакторы. Я пользуюсь текстовым редактором Notepad++.
Откройте текстовый редактор Notepad++.
Если нужно, создайте новый документ.
Перейдите в меню сверху по вкладке «Кодировки» => «Кодировать в UTF-8 (без BOM)»:

Чтобы сообщить браузеру, в  какой кодировке HTML файл, существует специальный META-тег

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

В HTML документе это будет выглядеть вот так:


<html>
<head>
<title>кодировка HTML</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
</body>
</html>

Как задать кодировку windows-1251 для файла?
Откройте текстовый редактор Notepad++.
Если нужно, создайте новый документ.
Перейдите в меню сверху по вкладке «Кодировки» => «Кодировать в ANSI»:

Чтобы сообщить браузеру, в  какой кодировке HTML файл, существует специальный META-тег

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

В HTML документе это будет выглядеть вот так:


<html>
<head>
<title>кодировка HTML</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
</body>
</html>

Пример перекодировки файла из windows-1251 в utf-8
Если в HTML документе был прописан код в кодировке windows-1251 (ANSI), а вам нужно перекодировать на utf-8 (или на оборот), тогда сделайте так:
Откройте текстовый редактор Notepad++. В текстовом редакторе перейдите в меню сверху по вкладке «Кодировки» => «Преобразовать в UTF-8 (без BOM)»:

Внимание, если бы вы нажали «Кодировать в UTF-8 (без BOM)», то в результате вы бы увидели вместо любимого русского текста, красивые караказябли .

Понравился пост? Помоги другим узнать об этой статье, кликни на кнопку социальных сетей ↓↓↓


Последние новости категории:

Похожие статьи

Популярные статьи:

Добавить комментарий

Метки: html, основы

Как указать кодировку сайта на HTML. Основы HTML для начинающих. Урок №20

Главная » Основы HTML » Как указать кодировку сайта на HTML. Основы HTML для начинающих. Урок №20

Как указать кодировку сайта на HTML. Основы HTML для начинающих. Урок №20

Всем привет!
Продолжаем изучать основы HTML. В этом уроке мы разберем, как указать HTML кодировку  для сайта (веб-страницы).
Этот урок очень важен, так как незнание того, как указать кодировку для веб-страницы может привести к тому, что вашу страницу не смогут прочитать. Вы спросите: «Это как так, не смогут?».
Давайте я покажу, как выглядит мой блог с неправильной кодировкой:

Ну как вам? Все ли смогли прочитать ? Хотя, если постараться, то смысл сможете понять по картинкам. Но разве таким сайтом удержишь посетителя?

Итак, HTML кодировка –  это таблицы соответствия кодов и символов алфавита. То есть, наш компьютер по кодировке поменяет код на понятные читабельные буквы .

Чтобы сообщить браузеру, в какой кодировке находятся символы веб-страницы, необходимо прописать между тегами <head></head> вот такой мета тег:


<meta http-equiv="Content-Type" content="text/html; charset=имя кодировки">

Обратите внимание, в коде есть слово «имя кодировки». Здесь нужно указать  HTML кодировку.
Обычно это utf-8 или windows-1251.

Кодировка для utf-8:


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

Кодировка для windows-1251:


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

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

Переходим к практике.

Как создать HTML документ с


кодировкой utf-8

Открывайте стандартный блокнот. «Все программы» => «Стандартные» => «Блокнот»:

Далее вставляете в блокнот стандартный код HTML:


<html>
<head>
<title> Моя первая HTML-страничка на StepkinBlog.ru</title>
</head>
<body>
Здравствуйте, это моя первая страница на StepkinBlog.ru.
</body>
</html>

Теперь указываем, в какой кодировке сохранена веб-страница. Для этого разместите между тегами <head></head> вот этот мета-тег:


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

Вот так должно получиться (строка №4):


<html>
<head>
<title> Моя первая HTML-страничка на StepkinBlog. ru</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</head>
<body>
Здравствуйте, это моя первая страница на StepkinBlog.ru.
</body>
</html>

Жмите в блокноте «Файл» => «Сохранит как…»:

Там, где пункт «Имя файла» напишите название веб-страницы на латинице и с расширением «.html». Я думю, вы это помните еще с первых уроков.
Там, где пункт «Кодировка:» укажите «UTF-8».
Жмите «Сохранить»:

Увеличить изображение?

Как создать HTML документ с кодировкой windows-1251

Открывайте стандартный блокнот. «Все программы» => «Стандартные» => «Блокнот».
Далее вставляете в блокнот стандартный код HTML:


<html>
<head>
<title> Моя первая HTML-страничка на StepkinBlog.ru</title>
</head>
<body>
Здравствуйте, это моя первая страница на StepkinBlog.ru.
</body>
</html>

Теперь указываем, в какой кодировке сохранена веб-страница. Для этого разместите между тегами <head></head> вот этот мета-тег:


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

Вот так должно получиться (строка №4):


<html>
<head>
<title> Моя первая HTML-страничка на StepkinBlog.ru</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
</head>
<body>
Здравствуйте, это моя первая страница на StepkinBlog.ru.
</body>
</html>

Жмите в блокноте «Файл» => «Сохранит как…»:

Там, где пункт «Имя файла» напишите название веб-страницы на латинице и с расширением «.html». Я думю, вы это помните еще с первых уроков.
Там, где пункт «Кодировка:» укажите «ANSI».
Жмите «Сохранить»:

Вот и все!

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

Для примера в блокнте установите код:


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

И укажите при сохранении «ANSI»:

Так как это неправильно, результат будет вот таким:

Сохраняйте правильно ваши веб-страници во избежание вот таких результатов 

Предыдущая запись
Как проверить HTML форму. Основы HTML для начинающих. Урок №19 Следующая запись
Как прописать мета теги. Основы HTML для начинающих. Урок №21

Настройка charset информации в .htaccess

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

Многие серверы Apache настроены, чтобы отправлять файлы с использованием кодировки ISO-8859-1 (Latin-1). В примерах в этом документе, мы будем считать, что вы хотите обслуживать ваш файл или файлы, используя другие кодировки, нежели указано в конфигурации по умолчанию. (Для получения консультации по выбору кодирования смотрите Выбор и применение кодирования.)

Ниже приведен пример HTTP заголовка, который сопровождает присланный к клиентскому приложению файл. В этом случае информация о кодировке символов содержится в заголовке Content-Type во второй строке снизу.

HTTP/1.1 200 OK
Date: Wed, 05 Nov 2003 10:46:04 GMT
Server: Apache/1.3.28 (Unix) PHP/4.2.3
Content-Location: CSS2-REC.en.html
Vary: negotiate,accept-language,accept-charset
TCN: choice
P3P: policyref=http://www.w3.org/2001/05/P3P/p3p.xml
Cache-Control: max-age=21600
Expires: Wed, 05 Nov 2003 16:46:04 GMT
Last-Modified: Tue, 12 May 1998 22:18:49 GMT
ETag: "3558cac9;36f99e2b"
Accept-Ranges: bytes
Content-Length: 10734
Connection: close
Content-Type: text/html; charset=utf-8
Content-Language: en

В примере заголовок Content-Type выражает как MIME тип файла так и кодировку символов. MIME тип описывает формат файла, что обслуживался. HTML файлы, как правило, обслуживаются, как text/html. Кодировка символов (или ‘charset’) этого файла — UTF-8.

Чтобы узнать, как просмотреть HTTP заголовок файла смотрите статью Проверка HTTP Заголовков.

Файлы на сервере Apache могут обслуживаться с кодировкой символов по умолчанию в HTTP заголовке, что конфликтует с фактическим кодированием файла. Кодировка символов, отправляемая сервером может быть новой кодировкой по умолчанию, установленной по умолчанию администратором сервера, либо результатом выполнения различных директив Apache. В других случаях никакую информацию о кодировке символов сервер не отправляет, когда она действительно необходима.

Если сервер настроен так, что позволяет пользователям или администраторам изменять информацию в .htaccess файлах, это может обеспечить способ переопределить настройки по умолчанию. Этот раздел показывает вам, как это сделать.

Имейте в виду, что есть несколько различных сценариев. В первую очередь, вы возможно захотите изменить в директории значения по умолчанию для всех файлов с одинаковым расширением. Кроме того, вы возможно захотите изменить значение по умолчанию для одного файла или небольшого числа файлов. Мы исследуем это по очереди.

В наших примерах мы будем считать, что сервер по умолчанию настроен обслуживать файлы в кодировке ISO-8859-1, но вы хотите, чтобы он обслуживал ваш файл или файлы используя кодировку UTF-8 (очень умная стратегия!).

Этот ответ вам подходит?

Эта статья написана для авторов контента, а не для системных администраторов. Настройки кодирования сервера по умолчанию выходят за рамки данной статьи.

Этот совет подходит только тогда, когда вы согласны назначить кодировку символов документа с помощью HTTP заголовка. В некоторых случаях вы можете этого не захотеть.

Заметим, что эти FAQ (часто задаваемые вопросы) также предполагают, что ваш сервер настроен на использование .htaccess файлов, и, что директивы, описанные ниже работают в .htaccess файлах на вашем сервере. Предполагается также, что не достаточно просто изменить настройки по умолчанию на сервере. Если вы не уверены, обратитесь к администратору сервера.

Вы также должны знать о конвенции, которые используются на сервере для объединения информации о кодировке символов с расширениями. В некоторых случаях сервер может быть настроен в ожидании того, что кодировки символов определены специфическими расширениями кодирования, например example.html.utf8 где .utf8 то, что должно быть связано с кодировкой символов, а не .html (о, что может быть связано с типом файла).

Если такие подходы потерпят неудачу, то вы должны пересмотреть руководства Apache (смотрите приложенные ссылки) или обратиться к администратору вашего сервера.

Спецификация по расширению

Используйте директиву AddCharset чтобы связать кодирование символов со всеми файлами, которые имеют определенное расширение в текущем каталоге и его подкаталогах. Например, чтобы обслуживать все файлы с расширением .html как UTF-8, откройте .htaccess файл в текстовом редакторе и введите следующую строку:

Расширение может быть указано с или без начальной точки. Вы можете добавить несколько расширений к одной и той же строке. Это все равно будет работать, если вы имеете такие названия файлов, как example.en.html или example.html.en.

Пример заставит все файлы с расширением .html обслуживаться как UTF-8. Заголовок HTTP Content-Type будет содержать строку, которая заканчивается ‘charset’ информацией, как показано в следующем примере.

Content-Type: text/html; charset=UTF-8

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

Примечание: Вы можете связать кодировку с любым расширением, которое прилагается к вашему файлу. Предположим, что вы сделали перевод на другой язык и вы имеете страницы на двух языках, что выглядят следующим образом example.en.html и example.ja.html. Давайте также предположим, что вам удобно обслуживать Английские страницы используя кодирование ISO-8859-1 вашего сервера по умолчанию, но вы хотите обслуживать Японские файлы в UTF-8. Чтобы это сделать, вы можете связать кодировку символов с расширением языка, как показано в следующем примере:

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

Примечание: Для достижения того же результата можно использовать директиву AddType, хотя это одновременно назначает как кодировку символов так и MIME тип. Решение о том, что является наиболее подходящим, частично будет зависеть от того, как вы используете расширение для обсуждения контента. Менее вероятно, что это будет уместно, если вы используете различные расширения для выражения типа документа и кодировки символов.

AddType 'text/html; charset=UTF-8' html

Изменение случайного файла

Давайте теперь предположим, что вы хотите обслуживать только один файл как UTF-8 в большом каталоге, где все остальные старые файлы правильно обслуживаются как ISO-8859-1. Файл, который вы хотите обслуживать как UTF-8 имеет название example.html. Откройте .htaccess файл в текстовом редакторе и введите следующее:

<Files "example.html">
AddCharset UTF-8 .html
</Files>

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

Примечание: Возможно также достичь того же результата, используя показанную выше директиву AddType, или, в данном случае, директиву ForceType , хотя она одновременно назначает, как кодировку символов так и MIME тип.

<Files "example.html">
ForceType 'text/html; charset=UTF-8'
</Files>

Примечание: Любые файлы с одинаковым названием в подкаталоге текущего местоположения будут также обслуживаться как UTF-8, разве что вы создадите противоположную директиву в соответствующем каталоге.

Более комплексные сценарии

Когда два правила расширение применяется к одному и тому же документу важным является порядок расположения расширений. Так, как в следующем примере

AddCharset UTF-8 .utf8
AddCharset windows-1252 .html

файл ‘example.utf8.html’ будет обслуживаться как «windows-1252» и ‘example.html.utf8’ как UTF-8.

Кодировка HTML

Чтобы правильно отображать HTML-страницу, веб-браузер должен знать какой набор символов использовать.

Из ASCII в UTF-8

ASCII был первым стандартом кодировки символов. ASCII определяет 128 различных символов, которые могут использоваться в Интернете: цифры (0-9), английские буквы (A-Z) и некоторые специальные персонажи нравятся! $ + — () @ <>.

ISO-8859-1 был набором символов по умолчанию для HTML 4. Этот набор символов поддерживаются 256 различных кодов символов.HTML 4 также поддерживает UTF-8.

ANSI (Windows-1252) был исходным набором символов Windows. ANSI идентичен согласно ISO-8859-1, за исключением того, что ANSI содержит 32 дополнительных символа.

Спецификация HTML5 поощряет веб-разработчиков использовать символ UTF-8. набор, который охватывает почти все персонажи и символы в мире!

Атрибут кодировки HTML

Для правильного отображения HTML-страницы веб-браузер должен знать набор символов, используемый на странице.

Это указано в теге :

Различия между наборами символов

В следующей таблице показаны различия между наборами символов, описанными выше:

9 0047 *900 47 7 900 47 Заглавная латинская буква G 90 047 W] 900 кинжал 90 045 900 47 9 0047 микро знак 900 47 226
Число ASCII ANSI 8859 UTF-8 Описание
32 пространство
33!!!! восклицательный знак
34 «» «» кавычка
35 # # # # цифровой знак
36 $ $ $ $ Знак доллара
37%%%% Знак процента
38 & & и и амперсанд
39 ‘‘ ‘‘ апостроф
40 ( ( ( ( левая скобка
41)))) правая скобка
42 * * * звездочка
43 + + + + плюс знак
44,,,, запятая
45 — — — — дефис минус
46.... полная остановка
47//// солидус
48 0 0 0 0 нулевая цифра
49 1 1 1 1 цифра один
50 2 2 2 2 цифра два
51 3 3 3 3 цифра три
52 4 4 4 4 цифра четыре
53 5 5 5 5 цифра пять
54 6 6 6 6 цифра шесть
55 7 7 7 цифра семь
56 8 8 8 8 цифра восемь
57 9 9 9 9 цифра девять
58:::: двоеточие
59;;;; точка с запятой
60 < < < < знак «меньше»
61 = = = = знак равенства
62>>>> Знак «больше»
63???? вопросительный знак
64 @ @ @ @ коммерческий в
65 A A A A Заглавная латинская буква A
66 B B B B Заглавная латинская буква B
67 C C C C Заглавная латинская буква C
68 D D D D Заглавная латинская буква D
69 E E E E Заглавная латинская буква E
70 F F F F Заглавная латинская буква F
71 G G G G
72 H H H H Заглавная латинская буква H
73 I I I I Заглавная латинская буква I
74 J J J J Заглавная латинская буква J
75 K K K K Заглавная латинская буква K
76 L L L L Заглавная латинская буква L
77 M M M M Заглавная латинская буква M
78 N N N N Заглавная латинская буква N
79 O O O O 90 048 Заглавная латинская буква O
80 P P P P Заглавная латинская буква P
81 Q Q Q Q Латинская заглавная буква буква Q
82 R R R R Заглавная латинская буква R
83 S S S S Заглавная латинская буква S
84 T T T T Заглавная латинская буква T
85 U U U U Заглавная латинская буква U
86 V V V V Заглавная латинская буква V
87 W W W Заглавная латинская буква W
88 X X X X Заглавная латинская буква X
89 Y Y Y Y Заглавная латинская буква Y
90 Z Z Z Z Заглавная латинская буква Z
91 [ [ [ [ левая квадратная скобка
92 \ \ \ \ обратный солидус
93]]]] правая квадратная скоба
94 ^ ^ ^ ^ акцент с циркумфлексом
95 _ _ _ _ 900 48 low line
96 `` `` серьезный акцент
97 a a a a Строчная латинская буква a
98 b b b b Строчная латинская буква b
99 c c c c Строчная латинская буква c
100 d d d d Строчная латинская буква d
101 e e e e Строчная латинская буква e
102 f f f f Строчная латинская буква f
103 g g g g Строчная латинская буква le tter g
104 h h h h Строчная латинская буква h
105 i i i i Строчная латинская буква i
106 j j j j Строчная латинская буква j
107 k k k k Строчная латинская буква k
108 l l l l Строчная латинская буква l
109 m m m m Строчная латинская буква m
110 n n n n Строчная латинская буква n
111 o o o o Строчная латинская буква tter o
112 p p p p Строчная латинская буква p
113 q q q q Строчная латинская буква q
114 r r r r Строчная латинская буква r
115 s s s s Строчная латинская буква s
116 t t t t Строчная латинская буква t
117 u u u u Строчная латинская буква u
118 v v v v Строчная латинская буква v
119 w w w w Строчная латинская буква tter w
120 x x x x Строчная латинская буква x
121 y y y y Строчная латинская буква y
122 z z z z Строчная латинская буква z
123 { { { { левая фигурная скобка
124 | | | | вертикальная линия
125}}}} правая фигурная скобка
126 ~ ~ ~ ~ тильда
127 DEL
128 € евро знак
129 НЕ ИСПОЛЬЗУЕТСЯ
130 ‚ одинарная кавычка с малым числом 9
131 ƒ Строчная латинская буква f с крючком
132 „ двойная кавычка low-9
133… горизонтальное многоточие
134 † кинжал
135 ‡
136 ˆ модификатор буквы с циркумфлексом акцент
137 ‰ знак промилле
138 Š Заглавная латинская буква S с кароном
139 ‹ одинарная кавычка с левым углом
140 Œ Латиница c апитальная лигатура OE
141 НЕ ИСПОЛЬЗУЕТСЯ
142 Ž Заглавная латинская буква Z с кароном
143 НЕ ИСПОЛЬЗУЕТСЯ
144 НЕ ИСПОЛЬЗУЕТСЯ
145 ‘ левая одинарная кавычка
146 ’ правая одинарная кавычка
147“ левая двойная кавычка
148 ” правый двойная кавычка
149 • пуля
150 — en тире
151 — длинное тире
152 ˜ маленькая тильда
153 ™ знак товарного знака
154 š Строчная латинская буква s с кароном
155 › одинарная кавычка, указывающая вправо
156 œ Латинская маленькая лигатура oe
157 НЕ ИСПОЛЬЗУЕТСЯ
158 ž Строчная латинская буква z с кароном
159 Ÿ Заглавная латинская буква Y с диэрезисом
160 без перерыва
161 ¡ ¡ ¡ перевернутый восклицательный знак
162 ¢ ¢ ¢ знак центов
163 £ £ £ знак фунта
164 ¤ ¤ ¤ знак валюты
165 ¥ ¥ ¥ Йен знак
166 ¦ ¦ ¦ сломанный стержень
167 § § § знак раздела
168 ¨ ¨ ¨ диэрезис
169 © © © знак авторского права
170 ª ª ª женский порядковый указатель
171 «« « левый двойной угол кавычки
172 ¬ ¬ ¬ без подписи
173 мягкий дефис
174 ® ® ® зарегистрированный знак
175 ¯ ¯ ¯ макрон
176 ° ° ° знак градуса
177 ± ± ± знак плюс-минус
178 ² ² ² верхний индекс два
179 ³ ³ ³ три верхних индекса
180 ´ ´ ´ 900 острый акцент
181 µ µ µ
182 знак пилкроу
183 · · · средняя точка
184 ¸ ¸ ¸ седилла
185 ¹ ¹ ¹ верхний индекс
186 º º º 900 мужской порядковый номер
187 »» » двойная угловая кавычка, указывающая вправо
188 ¼ ¼ ¼ вульгарная дробь одна четверть
189 ½ ½ ½ vulga r дробь одна половина
190 ¾ ¾ ¾ вульгарная фракция три четверти
191 ¿ ¿ ¿ перевернутый вопросительный знак
192 À À À Заглавная латинская буква A с тупым шрифтом
193 Á Á Á Заглавная латинская буква A с острым ударением
194 Â Â Â Заглавная латинская буква A с циркумфлексом
195 Ã Ã Ã Заглавная латинская буква A с тильдой
196 Ä Ä Ä Заглавная латинская буква A с тремой
197 Å Å Å Заглавная латинская буква A с кольцом над ним
198 Æ Æ Æ Заглавная латинская буква AE
199 Ç Ç Ç Заглавная латинская буква C с седилем
200 È È È Заглавная латинская буква E с могилой
201 É É É Заглавная латинская буква E с острым ударением
202 Ê Ê Ê Заглавная латинская буква E с циркумфлексом
203 Ë Ë Ë Заглавная латинская буква E с тремой
204 9 0048 Ì Ì Ì Заглавная латинская буква I с надстрочным знаком
205 Í Í Í Заглавная латинская буква I с острым ударением
206 Î Î Î Заглавная латинская буква I с циркумфлексом
207 Ï Ï Ï Заглавная латинская буква I с диэрезисом
208 47 ì ì Заглавная латинская буква Eth
209 Ñ Ñ Ñ Заглавная латинская буква N с тильдой
210 Ò Ò Ò Латинская заглавная буква O с тупым упором
211 Ó Ó Ó Заглавная латинская буква O с острым ударением
212 Ô Ô Ô Заглавная латинская буква O с циркумфлексом
213 Õ Õ Õ Латинская заглавная буква O с тильдой
214 Ö Ö Ö Латинская заглавная буква O с диэрезисом
215 × × × знак умножения
216 Ø Ø Ø Заглавная латинская буква O со штрихом
217 Ù Ù Ù Заглавная латинская буква U с могилой
218 Ú Ú Ú Латинская заглавная буква l etter U с острым углом
219 Û Û Û Заглавная латинская буква U с циркумфлексом
220 Ü Ü Ü Заглавная латинская буква U с диэрезисом
221 Ý Ý Ý Заглавная латинская буква Y с острым ударением
222 Þ Þ Þ Заглавная латинская буква Thorn
223 ß ß ß Строчная латинская буква s
224 à à à Строчная латинская буква a с тупым шрифтом
225 á á á Строчная латинская буква а с острым ударением
â â â Строчная латинская буква a с циркумфлексом
227 ã ã ã Строчная латинская буква a с тильдой
228 ä ä ä Строчная латинская буква a с тремой
229 å å å Строчная латинская буква a с кольцом над ним
230 æ æ æ Строчная латинская буква ae
231 ç ç ç Строчная латинская буква c с седилем
232 è è è Строчная латинская буква e с тупым ударением
233 é é é Строчная латинская буква e с острым ударением
234 ê ê ê Латинская строчная буква e с циркумфлексом
235 ë ë ë Строчная латинская буква e с тремой
236 ì ì ì Строчная латинская буква i с тупым шрифтом
237 í í í Строчная латинская буква i с острым углом
238 î î î Строчная латинская буква i с циркумфлексом
239 ï ï ï Строчная латинская буква i с тремой
240 ð ð ð Строчная латинская буква eth
241 ñ ñ ñ Строчная латинская буква n с тильдой
242 ò ò ò Строчная латинская буква o с могилой
243 — — — Строчная латинская буква o с острым углом
244 ô ô ô Строчная латинская буква o с циркумфлекс
245 x x x Строчная латинская буква o с тильдой
246 ö ö ö Строчная латинская буква o с диэрезисом
247 ÷ ÷ ÷ делительный знак
248 ø ø ø Строчная латинская буква o со штрихом
249 ù ù ù Строчная латинская буква u со штрихом
250 ú ú ú Строчная латинская буква u с острым ударением
251 û û û Строчная латинская буква с циркумфлексом
252 ü ü ü Строчная латинская буква u с тремой
253 ý ý ý Строчная латинская буква y с острым ударением
254 þ þ þ Строчная латинская шип
255 ÿ ÿ ÿ Строчная латинская буква y с тремой

Набор символов ASCII

ASCII использует значения от 0 до 31 (и 127) для управляющих символов.

ASCII использует значения от 32 до 126 для букв, цифр и символов.

ASCII не использует значения от 128 до 255.

Набор символов ANSI (Windows-1252)

ANSI идентичен ASCII для значений от 0 до 127.

ANSI имеет собственный набор символов для значений от 128 до 159.

ANSI идентичен UTF-8 для значений от 160 до 255.

Набор символов ISO-8859-1

ISO-8859-1 идентичен ASCII для значений от 0 до 127.

ISO-8859-1 не использует значения от 128 до 159.

ISO-8859-1 идентичен UTF-8 для значений от 160 до 255.

Набор символов UTF-8

UTF-8 идентичен ASCII для значений от 0 до 127.

UTF-8 не использует значения от 128 до 159.

UTF-8 идентичен ANSI и 8859-1 для значений от 160 до 255.

UTF-8 продолжает значение 256 с более чем 10 000 различных символы.

Для более детального ознакомления ознакомьтесь с нашим полным справочником по набору символов HTML.



Объявление кодировки символов в HTML

Целевая аудитория: Авторы HTML (использующие редакторы или сценарии), разработчики сценариев (PHP, JSP и т. Д.), Менеджеры веб-проектов и все, кому нужно введение в то, как объявить кодировку символов в своем файле HTML.

Как мне объявить кодировку моего файла HTML?

Вы всегда должны указывать кодировку, используемую для страницы HTML или XML.Если вы этого не сделаете, вы рискуете, что символы в вашем контенте будут неправильно интерпретированы. Это не только вопрос удобочитаемости человека, все чаще машинам также необходимо понимать ваши данные. Объявление кодировки символов также необходимо для обработки символов, отличных от ASCII, введенных пользователем в формы, в URL-адресах, сгенерированных сценариями, и т. Д. В этой статье описывается, как это сделать для файла HTML.

Если вам нужно лучше понять, что такое символы и кодировки символов, см. Статью Кодировки символов для начинающих .Для получения информации об объявлении кодировок для таблиц стилей CSS см. Объявления кодировки символов CSS .

Всегда объявляйте кодировку вашего документа с помощью элемента meta с атрибутом charset или с использованием атрибутов http-Equ и content (называемых директивой pragma). Объявление должно полностью помещаться в первые 1024 байта в начале файла, поэтому лучше всего поместить его сразу после открывающего тега head .





...





..

Неважно, какой именно вы используете, но проще набрать первый. Также не имеет значения, набираете ли вы UTF-8 или utf-8 .

Всегда следует использовать кодировку символов UTF-8. (Помните, что это означает, что вам также нужно сохранить вашего контента как UTF-8.) Посмотрите, что вам следует учитывать, если вы действительно не можете использовать UTF-8.

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

Вы можете обнаружить любые кодировки, отправленные заголовком HTTP, с помощью средства проверки интернационализации.

А как насчет отметки порядка байтов?

Если у вас есть метка порядка байтов (BOM) UTF-8 в начале вашего файла, то последние версии браузера, отличные от Internet Explorer 10 или 11, будут использовать это, чтобы определить, что кодировка вашей страницы - UTF-8. Он имеет более высокий приоритет, чем любое другое объявление, включая заголовок HTTP.

Вы можете пропустить объявление кодировки meta , если у вас есть спецификация, но мы рекомендуем вам сохранить его, поскольку это помогает людям, просматривающим исходный код, выяснить, какая кодировка страницы.

Подробнее о метке порядка байтов.

Следует ли указывать кодировку в заголовке HTTP?

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

Авторы контента должны всегда обеспечивать соответствие деклараций HTTP декларациям в документе.

Плюсы и минусы использования HTTP-заголовка

Одним из преимуществ использования HTTP-заголовка является то, что пользовательские агенты могут быстрее находить информацию о кодировке символов, когда она отправляется в HTTP-заголовке.

Информация заголовка HTTP имеет наивысший приоритет, когда она конфликтует с декларациями в документе, отличными от отметки порядка байтов.Средний серверы, которые перекодируют данные (т. е. конвертируют в другую кодировку), могут воспользоваться этим, чтобы изменить кодировку документа перед его отправкой на небольшие устройства, которые распознают только несколько кодировки. Неясно, широко ли используется эта перекодировка в настоящее время. Если это так, и он преобразует контент в кодировку, отличную от UTF-8, существует высокий риск потери данных, и это не является хорошей практикой.

С другой стороны, есть ряд потенциальных недостатков:

  • Авторам контента может быть сложно изменить информацию о кодировке для статических файлов на сервере, особенно при работе с интернет-провайдером.Авторам потребуются знания и доступ к настройкам сервера.

  • Настройки сервера

    могут по тем или иным причинам не синхронизироваться с документом. Это может произойти, например, если вы полагаться на серверное значение по умолчанию, и это значение по умолчанию будет изменено. Это очень плохая ситуация, поскольку более высокий приоритет информации HTTP по сравнению с объявление в документе может сделать документ нечитаемым.

  • Существуют потенциальные проблемы как для статических, так и для динамических документов, если они не читаются с сервера; например, если они сохранены в место, такое как компакт-диск или жесткий диск. В этих случаях информация о кодировке из заголовка HTTP недоступна.

    Точно так же, если кодировка символов объявлена ​​только в заголовке HTTP, эта информация больше не доступна для файлов во время редактирования или когда они обрабатываются такими вещами, как XSLT или скрипты, или когда они отправляются на перевод и т. д.

Так следует ли мне использовать этот метод?

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

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

(Некоторые люди утверждают, что редко бывает уместно объявлять кодировку в заголовке HTTP, если вы собираетесь повторить ее в содержание документа. В этом случае они предлагают, чтобы заголовок HTTP ничего не говорил о кодировке документа. Обратите внимание, что это обычно означает принятие мер, чтобы отключить все настройки сервера по умолчанию.)

Работа с полиглотами и форматами XML

XHTML5: Документ XHTML5 обслуживается как XML и имеет синтаксис XML.Анализаторы XML не распознают объявления кодировки в мета-элементах . Они распознают только декларацию XML. Вот пример:


Объявление XML требуется только в том случае, если страница не обслуживается как UTF-8 (или UTF-16), но может быть полезно включить его, чтобы разработчики, тестировщики или менеджеры по производству переводов могли визуально проверить кодировку документ, посмотрев на источник.

Разметка полиглота: Страница, использующая разметку полиглота, использует подмножество HTML с синтаксисом XML, которое может быть проанализировано с помощью синтаксического анализатора HTML или XML. Он описан в Polyglot Markup: надежный профиль словаря HTML5 .

Поскольку документ полиглота должен быть в кодировке UTF-8, вам не нужно и даже не следует использовать объявление XML. С другой стороны, если файл должен читаться как HTML, вам нужно будет объявить кодировку, используя мета-элемент , отметку порядка байтов или заголовок HTTP.

Поскольку объявление в мета-элементе будет распознаваться только парсером HTML, если вы используете подход с атрибутом content , его значение должно начинаться с text / html; .

Если вы используете мета-элемент с атрибутом charset , это не то, что вам нужно учитывать.

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

Работа с кодировками, отличными от UTF-8

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

Хотя обычно они называются кодировкой имен, в действительности они относятся к кодировкам, а не к наборам символов.Например, набор символов Юникода или «репертуар» может быть закодирован по трем различным схемам кодирования.

До недавнего времени реестр IANA был местом, где можно было найти имена для кодировок. Реестр IANA обычно включает несколько имен для одной и той же кодировки. В этом случае вы должны использовать имя, обозначенное как "предпочтительный".

Новая спецификация Encoding теперь предоставляет список, который был протестирован на реальных реализациях браузеров. Вы можете найти список в таблице в разделе «Кодировки».Лучше всего использовать имена из левого столбца этой таблицы.

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

Не придумывайте свои собственные имена кодировок, которым предшествует x- . Это плохая идея, так как она ограничивает совместимость.

Работа с устаревшими форматами HTML

HTML 4.01 не указывает использование атрибута charset с элементом meta , но любой недавний крупный браузер все равно обнаружит и использует его, даже если страница объявлена ​​как HTML4, а не HTML5. Этот раздел актуален только в том случае, если у вас есть другая причина, кроме обслуживания браузера для соответствия старому формату HTML. В нем описаны любые отличия от раздела ответов выше.

Информацию о страницах, обслуживаемых как XML, см. В разделе Работа с форматами многоязычных языков и XML.

HTML4: Как уже упоминалось выше, для полного соответствия HTML 4.01 вам необходимо использовать директиву pragma, а не атрибут charset .

XHTML 1.x используется как text / html: Для полного соответствия HTML 4.01 также требуется директива pragma, а не атрибут charset . Вам не нужно использовать объявление XML, поскольку файл обслуживается как HTML.

XHTML 1.x используется как XML: Используйте объявление в кодировке в объявлении XML в первой строке страницы.Убедитесь, что перед ним ничего нет, включая пробелы (хотя отметка порядка байтов в порядке).

Атрибут

charset в ссылке В

HTML5 не рекомендуется использовать атрибут charset в элементе a или link , поэтому вам следует избегать его использования. Он возник в спецификации HTML 4.01 для использования с элементами a , link и script и должен был указывать кодировку документа, на который вы ссылаетесь.

Он был предназначен для использования во встроенном элементе ссылки, например:

Плохой код. Не копируйте!

См. Наш список публикаций .

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

Всегда были проблемы с использованием этого атрибута. Во-первых, он плохо поддерживается основными браузерами.Одна из причин не поддерживать этот атрибут заключается в том, что, если браузеры будут делать это без специальных дополнительных правил, это будет вектор атаки XSS. Во-вторых, трудно гарантировать, что информация верна в любой момент времени. Автор указанного документа вполне может изменить кодировку документа без вашего ведома. Если автор все еще не указал кодировку своего документа, вы теперь попросите браузер применить неправильную кодировку. И, в-третьих, в этом нет необходимости, если люди следуют рекомендациям, изложенным в этой статье, и правильно размечают свои документы.Это гораздо лучший подход.

Этот способ указания кодировки документа имеет самый низкий приоритет (т. Е. Если кодировка объявлена ​​каким-либо другим способом, это будет проигнорировано). Это означает, что вы также не можете использовать это для исправления неверных объявлений.

Работа с UTF-16

Согласно результатам выборки Google из нескольких миллиардов страниц, менее 0,01% страниц в Интернете закодированы в UTF-16. На UTF-8 приходится более 80% всех веб-страниц, если вы включаете его подмножество, ASCII, и более 60%, если вы этого не делаете.Настоятельно не рекомендуется использовать UTF-16 в качестве кодировки страницы.

Если по какой-то причине у вас нет выбора, вот несколько правил объявления кодировки. Они отличаются от кодировок для других кодировок.

Спецификация HTML5 запрещает использование мета-элемента для объявления UTF-16, поскольку значения должны быть совместимы с ASCII. Вместо этого вы должны убедиться, что у вас всегда есть метка порядка байтов в самом начале файла в кодировке UTF-16. По сути, это декларация в документе.

Кроме того, если ваша страница закодирована как UTF-16, не объявляйте файл как «UTF-16BE» или «UTF-16LE», используйте только «UTF-16». Отметка порядка байтов в начале вашего файла укажет, является ли схема кодирования прямым или обратным порядком байтов. (Это связано с тем, что контент, явно закодированный, например, как UTF-16BE, не должен использовать метку порядка байтов; но HTML5 требует метки порядка байтов для страниц в кодировке UTF-16.)

Использовать кодировку `utf-8` | документация webhint

meta-charset-utf-8 проверяет, объявляет ли страница явно кодировка символов как utf-8 с использованием метатега в начале документа.

Почему это важно?

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

Отправка HTTP-заголовка Content-Type в целом нормально, но обычно неплохо также добавить метатег charset, потому что:

  • Конфигурации сервера могут измениться (или серверы могут не отправлять charset в заголовке HTTP-ответа Content-Type ).
  • Страница может быть сохранена локально, и в этом случае заголовок HTTP будет не присутствовать при просмотре страницы.

Всегда следует выбирать utf-8 в качестве кодировки и преобразовывать любые содержимое в устаревших кодировках до utf-8 .

Что касается метатега кодировки, всегда используйте как:

  • Он обратно совместим и работает во всех известных браузерах, поэтому его всегда следует использовать поверх старых .

  • Значение charset должно быть utf-8 , а не любые другие значения, такие как utf8 . Например, использование utf8 является распространенной ошибкой, и даже хотя в настоящее время это действительно так, как спецификации а браузеры теперь используют псевдонимы с utf8 до utf-8 , чего не было в прошлое, поэтому в некоторых старых браузерах что-то может сломаться. То же самое может быть верно и для других агентов (не браузеров), которые может сканировать / получать контент и может не иметь псевдонима.

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

    Кроме того, рекомендуется, чтобы метатег был первым делом. в . Это гарантирует, что это будет до того, как любой контент, который может контролироваться злоумышленником, например элементом </code>, таким образом избегая потенциальных проблем безопасности, связанных с кодированием (таких как один в старом IE).</p></li></ul><h3><span class="ez-toc-section" id="i-32"> Что проверяет подсказка? </span></h3><p> Подсказка проверяет, указан ли <code><meta charset = "utf-8"> </code> как первый вещь в <code><head> </code>.</p><h4><span class="ez-toc-section" id="i-33"> Примеры того, что </span></h4><strong> запускает </strong> подсказку</h4><p> Кодировка символов не указана в <code><html> </code>:</p><table><tr><td><pre> <! Doctype html> <html lang = "ru"> <head> <title> пример ... ...

    Кодировка символов указывается с помощью мета-кода http-Equiv :

     

    
        
         пример 
        ...
    
     ...

    Кодировка Значение не равно utf-8 :

     

    
        
         пример 
        ...
    
     ...

    Мета-кодировка - не первое, что есть в :

     

    
         пример 
        
        ...
    
     ...

    Примеры того, что

    передает подсказку
     

    
        
         пример 
        ...
    
     ...

    Как пользоваться этой подсказкой?

    Этот пакет устанавливается автоматически с помощью webhint:

     npm install hint --save-dev

    Чтобы использовать его, активируйте его через файл конфигурации .hintrc :

     {
    "коннектор": {...},
    "форматировщики": [...],
    "подсказки": {
        "meta-charset-utf-8": "ошибка"
    },
    "парсеры": [...],
    ...
}

    Примечание : Рекомендуемый способ запуска webhint - как devDependency из ваш проект.

    Дополнительная информация

    Кодирование и декодирование Html

    Кодирование HTML

    Кодировка

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

    Кодировка

    HTML гарантирует, что текст отображается в браузере правильно и не интерпретируется браузером как HTML. Например, если текстовая строка содержит знак «меньше» 9 (<) или знак «больше» (>), браузер будет интерпретировать эти символы как открывающую или закрывающую скобку тега HTML. Когда символы закодированы в HTML, они преобразуются в строку <и>, что заставляет браузер правильно отображать знак «меньше» и «больше».С момента рождения компьютеров используются различные кодировки. Даже обычные пользователи, вероятно, сталкивались с различными проблемами кодирования кодовых страниц, из-за которых контент веб-сайта или сообщение электронной почты становилось нечитабельным, особенно если они написаны не на английском языке. Существуют и другие кодировки, позволяющие передавать двоичные данные через текстовые протоколы, в которых используется только ограниченный набор символов.

    HTML Encode преобразует различные символы, которые могут быть неверно интерпретированы как форматирование HTML, в их представление сущности HTML.

    Online HTML Encode: HTML Encode будет кодировать HTML и является способом скрыть текст HTML от посторонних глаз. Countwordsfree HTML Encoder - это онлайн-инструмент, который преобразует HTML-код в строку JavaScript Unicode, что означает, что текст выглядит зашифрованным при просмотре исходного кода, но при выполнении в виде веб-страницы кажется нормальным.

    Когда вы кодируете текст, вы не защищаете свой HTML-код, но он отлично справляется с задачей отпугивания тех, кто в противном случае попытался бы просмотреть ваш код мимоходом.Скорее всего, они просто пойдут дальше.

    HTML DECODE: Декодирование HTML - это противоположность процессу кодирования. в процессе декодирования специально закодированные символы преобразуются обратно в исходную форму. он декодирует строку, содержащую ссылки на числовые символы HTML, и возвращает декодированную строку. HTML Decoders состоит из нескольких инструментов, которые позволяют декодировать данные с помощью различных методов. Реализация Countwordsfree поддерживает как ввод текстовой строки, так и ввод файла.Если данные, которые вы хотите декодировать, представлены в виде короткой строки, рекомендуется использовать файл в качестве входных данных. С другой стороны, для больших входных данных мы рекомендуем вам использовать файл в качестве входных данных. На выходе вам предоставляется результат в виде текста или шестнадцатеричного дампа, в зависимости от содержимого вывода, а также в виде файла, который вы можете скачать. В случае большого объема вывода простой текстовый вывод или вывод шестнадцатеричного дампа может быть усечен, вывод файла всегда завершается.

    Кодировка тегов: При создании веб-сайта рекомендуется объявить кодировку.Правильно закодированные веб-страницы объявляют кодировку браузеру через тег в заголовке. Без этого тега браузер может не знать, как переключиться на правильную кодировку, и символы могут отображаться как тарабарщина.

    Кодирование тегов

    - это процесс преобразования информации, хранящейся в теге, из определенной кодировки в другую, например из двоичного формата в GID-96. Этот процесс очень важен, особенно для разомкнутых систем.

    Узнайте, как использовать кодировку Meta Charset

    TL; DR - указание правильной кодировки HTML предотвратит невозможность отображения в браузере специальных символов.

    Общие сведения о кодировке символов HTML

    Необходимость в кодировке символов возникает из-за огромного выбора доступных символов. Помимо обычных латинских букв и арабских цифр, есть также иностранные алфавиты, математические символы и другие специальные символы. Однако документы, в которых определены разные кодировки HTML, могут отображать их по-разному.

    неверно интерпретированный текст приводит к множеству проблем:

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

    Все доступные символы сгруппированы в определенные наборы (также для краткости называемые наборами символов).Определяя кодировку HTML, вы позволяете браузеру получить доступ к конкретному набору и правильно отображать его символы.

    Примечание: у японцев даже есть специальный термин для плохо интерпретируемого набора символов - mojibake (文字 化 け).

    ASCII: самая простая кодировка

    Первая и самая простая кодировка символов HTML называется ASCII . Большинство современных кодировок используют его как стандартную основу.

    ASCII означает Американский стандартный код для обмена информацией.Он был разработан на основе телеграфного кода в начале 1960-х годов и содержит 128 символов , 95 из которых для печати :

    • Строчные латинские буквы
    • Прописные латинские буквы
    • Знаки препинания
    • Цифры от 0 до 9

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

    Однако популярность ASCII падала по мере роста Интернета международных .Одних только вспомогательных латинских символов быстро стало недостаточно.

    Ваш лучший вариант: UTF-8

    Unicode - это отраслевой стандарт, используемый для согласованности кодировки символов. Он был опубликован в начале 1990-х годов и имеет несколько кодировок, таких как UTF-8, UTF-16 и UTF-32.

    UTF-8 означает 8-битный формат преобразования Unicode и с 2008 года является самой популярной кодировкой символов HTML. К 2019 году более 90 процентов всех веб-сайтов используют UTF-8.Консорциумом World Web Consortium также рекомендует использовать в качестве кодировки символов HTML по умолчанию.

    Есть несколько веских причин использовать UTF-8:

    • Он поддерживает многих языков .
    • Он полностью совместим с ASCII.
    • Он изначально используется XML .
    • Он использует на меньше места на , чем другие кодировки Unicode.

    Чтобы объявить UTF-8 в качестве предпочтительной кодировки символов HTML, вам нужно будет использовать тег с атрибутом charset и UTF-8 в качестве его значения:

    Альтернативные кодировки HTML

    Вы можете найти массу альтернативных кодировок в стандарте Encoding Living Standard, созданном Рабочей группой по технологиям веб-гипертекстовых приложений (WHATWG).Однако мы настоятельно рекомендуем вам оставаться с UTF-8, поскольку другие кодировки содержат меньший набор символов, и это может вызвать проблемы при отображении вашего веб-сайта.

    Кодировка HTML: полезные советы

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

    Кодировка символов типа содержимого в электронной почте HTML

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

    Короче говоря, все почтовые клиенты игнорируют тип содержимого, определенный в вашем метатеге. Вместо этого они читают его из значения типа содержимого, которое находится в заголовке вашего электронного письма.

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

    Попробуйте преобразователь символов

    Что такое Content-Type?

    Content-type сообщает веб-браузеру или почтовому приложению, как интерпретировать текстовые символы в вашем HTML или теле письма. Самые популярные наборы символов - UTF-8 и ISO-8859-1.

    Для иллюстрации возьмем следующий код:

      
     Символы UTF-8: ö ü ä 
    

     UTF-8 китайский: 激 光 這 
    

     Символы сущности HTML: & # 28450; & # 23383;

    Вот как это отображается с использованием каждого набора символов:

    Как видно выше, китайские символы не представлены в наборе символов ISO-8859-1.Это связано с тем, что ISO-8859-1 включает только символы языка на основе латиницы. В результате получается набор беспорядочного текста, который является интерпретацией символов ISO-8859-1.

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

    В рабочем процессе специальной проверки Campaign Precheck вы можете установить тип содержимого электронной почты одним нажатием кнопки.Мы позаботимся о том, чтобы в ваш HTML был добавлен правильный код.

    Инструмент проверки типа содержания Campaign Precheck.

    Как это вписывается в электронные письма в формате HTML?

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

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

    Как установить Content-Type в заголовке электронной почты

    Сервер, отправляющий электронное письмо, устанавливает содержимое заголовка. Заголовок содержит информацию о том, кто получает электронное письмо («кому»), кто отправляет электронное письмо («от»), дату и время. Пользователи могут видеть часть этой информации вверху каждого сообщения при просмотре его в почтовом клиенте.

    Вот фрагмент заголовка электронного письма (обратите внимание на значение типа содержимого):

      Дата: среда, 15 декабря 2010 г. 12:45:55 -0700
Кому: test @ test.ком
От: [email protected]
Тема: UTF-8
Идентификатор сообщения: 
X-приоритет: 3
X-Mailer: EOAMailer 5.0.0
MIME-версия: 1.0
Кодирование передачи содержимого: 8 бит
Тип содержимого: текст / html; charset = "UTF-8"

    Результаты тестирования почтового клиента

    Мы отправили приведенный выше пример кода в тестовую электронную почту всем почтовым клиентам, которые поддерживает Email on Acid. Почти каждый клиент отображает текст на основе значения типа содержимого, установленного в заголовке электронной почты. Gmail - единственный клиент, который автоматически преобразует ваш текст в UTF-8, независимо от того, что вы указали в заголовке.

    Вот результаты тестов:

    Клиенты Content-Type
    AOL
    Outlook 2003, 2007 и 2010
    Lotus Notes 8 и 8.5
    Yahoo
    Thunderbird
    iPad
    iPhone Mail
    Android Mail    		 Берет тип содержимого из заголовка вашего электронного письма
    Gmail
    Android Gmail
    iPhone Gmail
    iPad Gmail    		 Преобразует тип содержимого в UTF-8

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

    Решение

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

    Вариант 1:
    Обратитесь к своему поставщику услуг электронной почты (ESP) и спросите их, какой тип содержимого они задают в заголовке при отправке электронных писем.Как только вы узнаете тип содержимого, используйте это значение в своем метатеге HTML при создании электронного письма.

    Вариант 2:
    Преобразуйте все специальные символы в их HTML-объекты, и вам не придется беспокоиться о заголовке Content-Type. Например, следующий символ «漢» имеет значение объекта HTML «& # 28450;». Чтобы помочь вам с преобразованием, мы создали бесплатный онлайн-инструмент, который преобразует все ваши специальные символы за вас. Просто воспользуйтесь этим инструментом преобразования, прежде чем отправлять электронное письмо.

    Заключительные слова о типе содержимого

    Всегда важно проверять наборы символов, используя как Internet Explorer, так и Firefox, особенно если вы используете нелатинские символы или копируете и вставляете контент из текстового редактора, такого как Microsoft Word.

    Когда вы отправляете тестовую электронную почту через Email on Acid, наши серверы настроены на отправку вашей электронной почты с использованием Content-Type UTF-8 каждому из наших поддерживаемых почтовых клиентов.

    Вне зависимости от того, вносите ли вы изменения в дизайн электронной почты, меняете тип содержимого или настраиваете способ кодирования символов HTML, все это может иметь большое влияние на то, как отображается ваше письмо.Вот почему так важно проверять и предварительно просматривать свое электронное письмо перед каждой отправкой. Хотите убедиться в этом сами? Попробуйте нашу бесплатную пробную версию и узнайте, как мы можем помочь вам оптимизировать процесс контроля качества электронной почты.

    Попробуйте сегодня

    Этот пост был обновлен 25 января 2019 года. Последний раз он обновлялся в феврале 2017 года и впервые был опубликован в 2011 году.

    Автор: Джон Тис

    Джон Тис (John Thies) - генеральный директор и соучредитель Email on Acid, платформы проверки качества электронной почты перед развертыванием, которая стремится устранить врожденный страх перед нажатием кнопки «Отправить».Он страстный и увлеченный лидер отрасли, который живет, дышит и мечтает об электронной почте (серьезно). Джон также является генеральным директором Cause for Awareness, недавно созданной некоммерческой организации, которая предоставляет другим некоммерческим организациям ресурсы цифрового маркетинга. Он проживает в Денвере, штат Колорадо, с женой и сыном.

    Автор: Джон Тис

    Джон Тис (John Thies) - генеральный директор и соучредитель Email on Acid, платформы проверки качества электронной почты перед развертыванием, которая стремится устранить врожденный страх перед нажатием кнопки «Отправить».Он страстный и увлеченный лидер отрасли, который живет, дышит и мечтает об электронной почте (серьезно). Джон также является генеральным директором Cause for Awareness, недавно созданной некоммерческой организации, которая предоставляет другим некоммерческим организациям ресурсы цифрового маркетинга. Он проживает в Денвере, штат Колорадо, с женой и сыном.

    HTML | charset Атрибут

    HTML | Атрибут кодировки

    Атрибут кодировки HTML используется для указания кодировки символов для документа HTML .Атрибут charset можно переопределить с помощью атрибута lang любого элемента.

    Синтаксис:

    Значения атрибутов: Он содержит значение, то есть character_set , которые определяют кодировку символов для документа HTML.
    Значения:

    • UTF-8: Указывает кодировку символов для Unicode.
    • ISO-8859-1: Указывает кодировку символов для латинского алфавита.

    Пример: Этот пример иллюстрирует использование атрибута charset в метаэлементе.

    < html >

    < глава >

    >

    Атрибут кодировки HTML

    title >

    < meta name = "ключевые слова"

    Кодировка = "UTF-8"

    контент = "Мета-теги, метаданные" />

    head >

    < body style = "text-align: center " >

    < h2 > Здравствуйте, GeeksforGeeks! h2 >

    < h3 >

    Атрибут кодировки в мета-элементе

    h3 >

    body >

    html >

    Вывод:

    Поддерживаемые браузеры: Браузеры, поддерживаемые HTML атрибутом кодировки , перечислены ниже:

    • Google Chrome
    • Internet Explorer
    • Firefox
    • Opera

      • Safari.

      No related posts.