Как сделать кодировку utf 8 в html
Добавил пользователь Владимир З. Обновлено: 05.10.2024
Для правильного отображения HTML-страницы веб-обозреватель должен знать, какой набор символов (кодировка) следует использовать.
Что такое кодировка символов?
ASCII был первым стандартом кодировки символов (также называемым набором символов). ASCII определены 128 различных буквенно-цифровых символов, которые могут быть использованы в Интернете: цифры (0-9), английские буквы (a-Z), и некоторые специальные символы, как! $ +-() @ .
ANSI (Windows-1252) был оригинальный набор символов Windows, с поддержкой 256 различных кодов символов.
ISO-8859-1 был стандартным набором символов для HTML 4. Этот набор символов также поддерживает 256 различные коды символов.
Так как ANSI и ISO-8859-1 были настолько ограничены, HTML 4 также поддерживал UTF-8.
UTF-8 (Юникод) охватывает почти все символы и символы в мире.
Кодировка символов по умолчанию для HTML5 — UTF-8.
Атрибут HTML-кодировки
Для правильного отображения HTML-страницы веб-обозреватель должен знать кодировку, используемую на странице.
Это указано в теге :
Для HTML4:
Для HTML5:
Если браузер обнаруживает ISO-8859-1 на веб-странице, по умолчанию используется ANSI, так как ANSI идентичен ISO-8859-1 за исключением того, что ANSI имеет 32 дополнительных символов.
Различия между наборами символов
В следующей таблице показаны различия между наборами символов, описанными выше:
Набор символов 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
8859-1 идентичен ASCII для значений от 0 до 127.
8859-1 не использует значения от 128 до 159.
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 различных символов.
Вы когда-нибудь видели на странице в интернете какие-то знаки вопроса, квадратики и прочее вместо текста? Думаю, что видели. Так вот, у этого сайта проблема с кодировкой, вполне возможно разработчик ее не указал. Кодировка, простыми словами, это таблица содержащая набор символов. Для того чтобы добавить кодировку сайта, нужен многофункциональный тег , о нем написан целый урок. Итак, чтобы браузер понял, какую кодировку вы используете, применяйте эту строку:
Что такое кодировка?
Подробнее о кодировке?
Кодировка ASCII является американской и разрабатывалась для английского языка. Так как, к примеру, французский язык имеет надстрочные знаки, а русский алфавит не похож на английский, был разработан стандарт Unicode для расширения кодировки ASCII. Но и в Unicode, со временем, стало не хватать места для размещения новых символов. Поэтому на основе Unicode создали кодировку UTF-8, которая исправила эти недостатки. UTF-8 позволяет кодировать до 2 миллиардов символов, поэтому она доминирует в интернете.
В UTF-8 коды от 0 до 127 используются для представления символов ASCII. Если символ не входит в набор ASCII, то старший бит первого байта устанавливается в 1, что свидетельствует о дополнительном использовании байтов. То есть если в документе используются только символы из ASCII, то каждый символ в UTF-8 будет кодироваться восьмью битами.
Что такое атрибуты?
Настало время познакомиться с атрибутами в HTML. Вы их уже встречали, просто на них не акцентировалось внимание. Атрибуты – это дополнение к тегам, расширяющее их возможности. Они всегда указываются в открывающемся теге. Атрибут состоит из имени и значения, разделенного знаком равенства.
Имя атрибута необходимо писать в нижнем регистре. Хотя HTML5 и позволяет писать в любом регистре и не использовать кавычки, все же так не рекомендуется делать.
Меня несколько раз просили написать, как поменять кодировку на сайте. Дело это состоит из нескольких частей, поэтому в двух словах не объяснить. И я принял решение написать эту статью, в которой чётко расписать, что требуется для смены кодировки на сайте.
Давайте с Вами будем переводить сайт в кодировку UTF-8. Если Вы хотите перевести в любую другую кодировку, то всё будет аналогично. Итак, вот порядок действий для этого:
- Все текстовые файлы (html, php, js, txt, в общем, в которых есть текст) перекодируйте в UTF-8. Сделать это очень просто через Notepad++ в пункте "Преобразовать в UTF-8 без BOM" из меню "Кодировки". Причём именно все файлы, которые даже ничего не выводят на страницу.
- Поместите в корень сайта файл .htaccess с текстом AddDefaultCharset UTF-8.
- Поменяйте кодировку в мета-теге
Если Ваш сайт не использует базу данных, то на этом этапе можно закончить менять кодировку. Но если база данных есть, то нужно сделать ещё и следующие шаги:
- Сразу после подключения к БД выполните запрос: SET NAMES UTF-8
- В phpMyAdmin поменяйте кодировку базы данных на utf8_general_ci в её настройках.
- Поставьте у всех таблиц кодировку utf8_general_ci.
- У всех текстовых типов полей так же поставьте кодировку utf8_general_ci.
Всё, теперь Ваша кодировка на сайте изменена. Добавлю лишь, что если где-то в коде Вы занимались преобразованием из одной кодировки в другую (например, через функцию iconv()), то тщательно проверьте это место, возможно, там появится проблема.
Если после смены кодировки у Вас что-то отображается не так, то почитайте эту статью: проблемы с кодировкой.
Если Вы не хотите пропустить новые материалы на сайте,
то Вы можете подписаться на обновления: Подписаться на обновления
Если у Вас остались какие-либо вопросы, либо у Вас есть желание высказаться по поводу этой статьи, то Вы можете оставить свой комментарий внизу страницы.
Порекомендуйте эту статью друзьям:
Если Вам понравился сайт, то разместите ссылку на него (у себя на сайте, на форуме, в контакте):
Она выглядит вот так:
Комментарии ( 11 ):
Молодец Михаил урок очень полезный.Люблю когда коротко и ясно а не наоборот. Спасибо!
просто класно понятно и ещлково спасибо
Здравствуйте Михаил, вот я опробовал, то что вы написали, только с кодировкой windows-1251. Прямо все способы разом применил, вот только все равно вылетали кракозябры. Но вдруг я случайно в файле .htaccess указал кодировку utf-8 и все заработало, нет кракозябр (притом в базе данных и в скрипте у меня кодировка windows-1251). Не могли бы вы мне ответить, почему? (если, конечно этому есть объяснение)
Значит, файлы всё-таки в UTF-8 были. И из базы данных данные тоже поступали с кодировкой UTF-8 (по умолчанию, она и стоит на denwer).
Здравствуйте.Срочно нужна ваша помощь. Выходили крокозябры. решил перекодировать под UTF-8 по вашим указаниями. На 2 или 3 пункте я что-то не так сделал(скорее всего на 3) и у меня сайт перестал работать. Вводя ссылку, у меня пишет текст из index.php
Добрый день. Такая проблема. У меня база данных изначально в кодировке cp1251. База для скрипта почтовой рассылки. Сайт, где внедрен скрипт - в кодировке utf8. Все, что написано в данной статье (по изменению кодировки в базе данных) я сделал. И, все равно, происходит следующее: пользователь, желающий оформить подписку на сайте, после того, как ввел в форму свои имя и e-mail, получает письмо (чтоб подтвердить рассылку), где его имя написано кракозябрами, и далее (после подтверждения) в таком виде и остается в базе данных. Если же меняю кодировку сайта на windows1251 - все хорошо, имя человеческое. Но я не хочу менять кодировку сайта. Как быть? Может быть, есть возможность как-то поменять кодировку отдельно взятого элемента, в данном случае, кодировку формы отправки данных? Спасибо.
Убедитесь, что в письме есть заголовок Content-type с кодировкой utf-8.
Уважаемый Дмитрий,проверьте,пожалуйста,вот эту строчку с параметрами windows-1251 и utf-8. $headers .= "Content-type: text/plain; charset=windows-1251\r\n"; если не поможет,то будем разбираться
Иногда возникают случаи, когда при открытии сайта отображается не привычный нам контент, а сплошной набор нечитаемых символов. Это связано с тем, что кодировка ресурса не совпадает с той кодировкой, которая устанавливается сервером. Например, для чтения файлов используется Windows-1251, а требуется UTF-8.
Что такое кодировка сайта и как ее можно изменить – об этом и поговорим в сегодняшней статье.
Что такое кодировка
Кодировка – специальный метод, позволяющий отображать текст на экране таким образом, чтобы он был понятен каждому пользователю. Все символы, которые мы видим в интернете, – это буквы и цифры только для нас, компьютер их не понимает. Он воспринимает информацию в байтах, весь текст на экране монитора – это совокупность байтов. У каждого символа есть свое кодовое значение, которое компьютер использует при выводе слов и чисел на экран.
Вот наглядный пример того, как воспринимается компьютером латинский алфавит и прочие символы:
Если никакая кодировка не установлена, вместо символов мы увидим такие значения. Чтобы понять компьютер, необходимо установить нужную кодировку для расшифровки символов из этой таблицы.
Типы кодировок
Существует несколько типов кодировок:
Существуют и другие типы кодировок, но они используются в меньшей степени либо не используются вообще.
Как определить кодировку на сайте
Узнать кодировку своего или чужого сайта довольно просто, достаточно просмотреть исходный код страницы. Сделать это можно следующим образом:
Где и как изменить кодировку
Все зависит от сайта. Способ установки кодировки может различаться: если используется одностаничник, то достаточно в HTML-файле прописать мета-тег в блоке :
В противном случае нам потребуется отредактировать файл .htaccess. Рассмотрим на примере хостинга Timeweb, как это можно сделать.
Как видите, сменить кодировку на своем сайте легко. Аналогичным образом мы можем изменить кодировку и на всем сервере – для этого необходимо выполнить следующее (актуально для веб-сервера Apache):
Если вы поменяете кодировку по умолчанию, то она будет изменена для всех ресурсов, находящихся на данном сервере.
Смена кодировки базы данных
На этом статья подходит к концу. Теперь вы знаете больше о кодировке сайта и можете легко ее изменить в случае необходимости. Спасибо за внимание!
Читайте также: