HTML кодировки-W3Docs
❮ Назад Вперед ❯
Для того, чтобы браузер смог правильно отобразить текст на веб-странице, необходимо указать ее кодировку. В противном случае вместо текста на веб-странице будут отображаться непонятные символы.
Кодировку указывают в теге <meta> который находится в блоке <head>.
Пример
<head> <meta charset="utf-8"> </head>
В HTML 5 для указания кодировки используется атрибут charset: <meta charset=»utf-8″>
Рассмотрим основные виды кодировок
ASCII (American Standard Code for Information Interchange), американский стандартный кодекс для обмена информацией между компьютерными и аппаратными устройствами был придуман в 60 годах прошлого века. ASCII — 7-битная кодовая таблица, которая содержит 128 символов (цифры от 1 до 9, прописные и строчные латинские буквы, специальные символы). Современные системы кодировки, такие как ISO-8859 и UTF-8, разработаны на основе ASCII.
Печатные символы ASCII
Со временем стандарт кодировки ASCII расширялся, появилась возможность использовать не 128, а 256 символов, которые можно закодировать в одном байте информации. Одной из расширенных версий ASCII является ANSI (American National Standards Institute). Примером ANSI-кодировки является Windows-1251, которая включает типографические символы, а также буквы алфавитов славянских народов.
Организация Международных стандартов (International Standards Organization) ввела диапазон кодировок для разных языков, от ISO 8859-1 до ISO 8859-16.
В большинстве браузеров по умолчанию используется кодировка ISO-8859-1. Кодировка символов от 0 до 127 в ISO-8859-1 соответствует кодировке ASCII (цифры от 1 до 9, заглавные и строчные буквы английского алфавита и несколько спецсимволов).
В HTML 4 любая кодировка, отличная от стандарта ISO-8859-1, должна быть указана в теге <meta> .
Таблица кодов символов ISO-8859-1
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-8">
В 1991 году был разработан универсальный стандарт кодирования Unicode Transformation Format (UTF), благодаря которому стало возможным представить знаки практически всех известных письменных языков.
Разработчиками стандарта была некоммерческая организация Unicode Consortium.
Первой была разработана кодировка UTF-32, затем UTF-16, и наконец появился стандарт UTF-8.
В UTF-32 для кодирования одного символа использовалось 32 бита (4 байта), что увеличивало вес конечного файла в 4 раза. В UTF-16 вес снизился вдвое, так как для кодирования использовалось уже 16 бит, но и это было далеко не оптимальным решением. Разработанный впоследствии стандарт UTF-8 на сегодняшний день считается самым оптимальным. Для кодирования одного символа в UTF-8 используется от 1 до 4 байт. Он идеально совмещается с системами, которые используют 8-битные символы.
UTF-8 унаследовал базовую часть кодировки ASCII (128 символов), то есть для кодировки латинских символов используется 8 бит (1 байт). Все последующие символы кодируются двумя байтами и более.
HTML4 поддерживает только кодировку UTF-8. В HTML5 поддерживаются как UTF-8, так и UTF-16.
Таблица кодов символов UTF-8
Знаки с кодами от U+0400 до U+052F, от U+2DE0 до U+2DFF, от U+A640 до U+A69F кодируют символы кириллицы.
Краткий курс HTML 5. HTML-документ — Exlab
Когда вы набираете в редакторе обычный текст, то не задумываясь начинаете с первого слова. В нашем случае все несколько сложнее, поскольку сначала необходимо сообщить браузеру некоторую служебную информацию, сформировав каркас HTML-документа, а лишь затем приступать к его наполнению. Наш первый документ выглядит вот так:
<!DOCTYPE html> <html> <head> <title>Заголовок документа</title> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> </head> <body> Мой первый HTML-документ </body> </html>
Сохраните это в файл с расширением .html, после чего откройте его в браузере. Вы должны увидеть страницу с единственной надписью «Мой первый HTML-документ», да еще в заголовке браузера написано «Заголовок документа». Если вместо русских букв отображаются квадраты, то сохраните файл, выбрав в вашем редакторе кодировку UTF-8 (команда «Сохранить как…»).
Но давайте по порядку…
Определение типа документа
Структура документа
Ниже находится корневой элемент <html>, охватывающий весь документ от DTD до самого конца. Внутри него один за другим расположены <head> и <body>. Как и следует из названия, <head> — это «голова» документа, в которой размещается заголовок <title> (его содержимое отображается в заголовке браузера) и прочая служебная информация (сейчас это единственный элемент <meta />).
<body> — это «тело» документа, в котором и находится основной текст.
Элементы <html>, <head> и <title>, наряду с DTD являются обязательными и должны быть размещены в описанном выше порядке. В противном случае документ не будет соответствовать стандартам W3C (проверьте одним из способов, описанных во введении). Это еще не значит, что он не будет отображаться в каких-либо браузерах, но нет гарантий, что отображение будет верным.
Кодировка документа
Элемент <meta /> предназначен для передачи служебной информации браузеру. Атрибут http-equiv определяет «о чем сообщить», а content — «что сообщить».
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
В этой строчке браузеру сообщается, что содержимое документа (text/html в кодировке UTF-8.
Более подробно возможности этого элемента будут рассмотрены позже. Тег <meta /> непарный, поэтому завершается косой чертой «/».
Если нет причин использовать другую кодировку, то сохраняйте HTML-документы в UTF-8 (в большинстве редакторов есть соответствующая опция). К ее недостаткам можно отнести, пожалуй, лишь больший размер файлов. Это связано с тем, что символы, не входящие в ASCII (латиница, цифры, знаки препинания и др.), занимают два байта, вместо одного. Преимущество же в том, что она позволяет использовать любые символы Unicode (включая большинство алфавитов мира). UTF-8 — рекомендуемая кодировка для HTML-документов, и давно является стандартом «де-факто» в интернете.
Как объявить кодировку символов HTML
Проблемы, связанные с объявлениями кодировки, довольно распространены. Важно вовремя их обнаружить и устранить; однако процесс указания набора символов, который использует ваш веб-сайт, не сложен.
Что означает «Кодировка символов не была объявлена»?
Ошибка JavaScript о том, что «кодировка символов HTML-документа не была объявлена», указывает на то, что ваша страница может отображать искаженный текст. Эта ошибка чаще всего возникает при использовании браузеров Firefox или Google Chrome, когда не указан набор символов веб-сайта. Следовательно, браузер неправильно интерпретирует содержимое.
Кодировка символов помогает определить соответствие между байтами и текстом. Существуют различные типы, но стандартным и наиболее распространенным Unicode является набор символов UTF-8. В отличие от ASCII, этот охватывает почти все известные символы. UTF-8 также является кодировкой по умолчанию для документов HTML5.
Что вызывает эту проблему?
Вот основные причины, по которым экран может предложить вам объявить кодировку символов:
- Недавно вы обновили базу данных или сменили хостинг вашего сайта. Иногда это может привести к повреждению символов или страниц.
- Вы не добавили правильные метатеги после тега заголовка, чтобы указать, какой набор символов используется на вашей странице.
- Вы сделали это, но метатег размещен не в том месте. Имейте в виду, что веб-браузеры проверяют первые 1024 байта на наличие формата кодировки.
- Вы забыли сохранить изменения и обновить страницу.
Как проверить проблему
Чтобы проверить, используете ли вы правильную кодировку, вы можете использовать специальные инструменты, такие как валидаторы, которые находят кодировку из заголовков HTTP. Однако этот метод не работает в 100% случаев; валидатор может запутаться, так как многие кодировки похожи. Существуют и другие программы и веб-сервисы, которые отображают заголовки HTTP, например Delorie HTTP Header Viewer. Там вы должны ввести URL-адрес документа и найти параметр charset.
Обнаружьте не только отсутствие кодировки символов на страницах, но и другие технические проблемы на вашем сайте!
Просканируйте свой сайт и выясните всевозможные проблемы, которые могут повредить вашим пользователям или SEO вашего сайта.
Почему это важно?
Для правильного отображения страницы HTML или XML необходимо указать кодировку символов. Указав кодировку, вы помогаете поисковым системам понять данные, чтобы они могли правильно их интерпретировать. Без этого веб-браузер не будет знать, какой набор символов использовать. Также рекомендуется использовать объявления кодировок в заголовках HTTP вместе с объявлениями внутри документа. Это помогает тестировщику или разработчику проверить кодировку.
Если вы хотите узнать больше о кодировании символов и посмотреть, как это работает на примерах, вам может быть интересно посмотреть это видео Скотта Хансельмана.
Как решить проблему
Чтобы объявить кодировку вашего HTML-документа, вам нужно использовать метаэлемент с атрибутом charset. В случае использования WordPress вы найдете нужную строку, зайдя в «Панель управления»>
Там вам нужно найти файл header.php. Сразу после тега head вы увидите строку набора символов, в которую вам нужно добавить метаэлемент. Используйте Unicode UTF-8 и убедитесь, что ваш контент также сохранен как UTF-8. На практике строка будет выглядеть так: . После этого следует сохранить изменения и обновить страницу.Иван Палий
Эксперт по маркетингу
Иван работает специалистом по продуктовому маркетингу в Sitechecker.
Увлекается аналитикой и созданием бизнес-стратегии для продуктов SaaS.
Фейсбук Линкедин
кодировка символов — `doctype` и `charset` в HTML 5
спросил
Изменено 4 года, 1 месяц назад
Просмотрено 1к раз
Мне любопытна связь между DOCTYPE и кодировкой в файле HTML 5.
При использовании шаблона HTML по умолчанию в VSCode создается следующая разметка:
<голова>
<метакодировка="utf-8" />
Название страницы
css" />
<скрипт src="main.js">
<тело>
Мой вопрос: нужны ли нам как DOCTYPE , так и кодировка ?
Если для doctype установлено значение html (что относится к HTML 5), и мы знаем, что utf-8 является кодировкой по умолчанию для HTML 5, нужно ли указывать кодировку используя метатег или браузер знает?
- html
- кодировка символов
- тип документа
Мой вопрос: нужны ли нам и DOCTYPE, и кодировка?
Да
Если тип документа установлен на html (что относится к HTML 5), и мы знаем, что utf-8 является кодировкой по умолчанию для этого типа документа
Это не так. Браузеры выполняют сложный анализ, чтобы определить кодировку символов. Явное указание более надежно.
1
Рекомендуется подготовить свой веб-сайт для большинства браузеров и платформ.