Как сделать русский язык html
Добавил пользователь Алексей Ф. Обновлено: 05.10.2024
У некоторых людей случаются проблемы с кодировкой на сайте/сервере из-за чего вместо русского текста появляются иероглифы вида:
Почему это происходит?
Одной из причин происхождения является тот факт, что у вас установлены разные кодировки вывода данных (текста) в PHP / MySQL / Html / Файлах. По правде. Это единственная причина по которой у вас иероглифы.. Осталось разобраться только откуда именно поступает неправильная кодировка. Например, может быть что в PHP, Html, Файлах кодировка UTF-8, а в MySQL win-1251 и из-за этого у вас проблемы.
Как решить проблему с иероглифами возникающими вместо русского текста?
Что ж для того что бы решить проблему не мороча себе голову выставьте везде кодировку UTF-8.
1. Файл сайта должен быть сохранён в UTF-8.
2. В HTML между тэгами и добавьте строку:
http-equiv webkit-html-attribute-value">content-type " content webkit-html-attribute-value">text/html; charset=utf-8 " />
3. В PHP файле перед вывод каких-либо HTML частей, вставьте строку:
header("Content-Type: text/html; charset=utf-8");
Можно сию строку поставить и в начале файла.
4. И конечно MySQL. Тут дело затяжней.
Нередко бывают случаи когда все данные отображаются правильно, по русски короме тех которые хранятся и выводятся на страницу из базы данных MySQL, в этом случае это естественно проблемы только БД и предыдущие 3 шага выполнять необязательно.
Т.к я не знаю вашей ситуации то предположу:
4.1. У вас в MySQL все данные записываются в неверной кодировке.
Для того что бы убедиться в этом или обратном воспользуйтесь PhpMyAdmin и собственноручно проверьте базу. Если в ней записи в отличном "русском" состоянии, значит с кодировкой данных в базе всё нормально и остаётся только неправильная кодировка вывода данных из MySQL. Если же действительно в базе билиберда и полно иероглифов, то сделайте следующее:
В PhpMyAdmin выберите используемую БД, затем справа выберите вкладку "Операции", и в самом низу "Сравнение" Поставьте utf8_general_ci.
4.2. У вас неправильная кодировка вывода данных из MySQL.
В том случае если у вас в базе всё по русски а вот выводит данные она иероглифани, значит проблемы именно с выводом. Для решения этой проблемы, убедитесь что перед выводом чего-либо из базы в PHP файле присутствуют такие строки:
mysql_query('SET NAMES utf8');
mysql_query('SET CHARACTER SET utf8' );
mysql_query('SET COLLATION_CONNECTION="utf8_general_ci"' );
Где искать основные шаблоны ?
ПА > Оформление > Шаблоны > Общие настройки
Dana Domirani Админист ратор
Нет, это не несовместимость с браузером,
вам надо добавить в код вашей страницы после тега Код: , указание кодировки :
Где находится CSS ?
Па > Оформление > Цвета > Каскадная таблица стилей CSS
Где искать основные шаблоны ?
ПА > Оформление > Шаблоны > Общие настройки
Luz Админист ратор
Каждый вебмастер сталкивался с проблемой неправильного отображения текста на странице:
Это случается по одной из следующих причин: текст имеет кодировку, которая не соответствует указанной в документе или передаваемой сервером; кодировка документа указано неверно; сервер отдаёт документ, указывая неправильную кодировку.
Далее везде будет применяться кодировка UTF-8, так как она наиболее универсальная и её рекомендуется использовать повсеместно.
Текст
Первым делом нужно проверить кодировку текста в документе. Рассмотрим как это делается в Блокноте и Notepad++.
Блокнот
- Открываем Блокнот: Win+R → notepad ; и копируем в него код страницы.
- Кликаем Файл → Сохранить как. или нажимаем Ctrl+S .
- В поле Имя файла вводим название документа с расширением.
- В поле Тип файла выбираем Все файлы , так как иначе не учтётся введённое расширение и файл сохраниться в формате txt (это зависит от настроек операционной системы).
- Ставим кодировку UTF-8 и сохраняем документ.
Notepad++
Нужно выбрать именно Преобразовать в UTF-8 без BOM , а не Кодировать в UTF-8 (без BOM) .
За представление кодировки HTML-документа отвечает элемент с атрибутом charset , который располагается между и : HTML 5: HTML 4.01:
Сервер
На реальном хостинге никто не предоставит возможность изменять конфигурацию сервера своим клиентам, поэтому этот момент пропускаем.
Чтобы указать кодировку, с которой сервер должен отдавать HTML-документы, нужно сделать следующее (на примере использования Блокнота): открыть Блокнот: Win+R → notepad ; и написать в нём следующую строку: AddDefaultCharset UTF-8 кликнуть Файл → Сохранить как. или нажать Ctrl+S ; в поле Имя файла ввести .htaccess ; в поле Тип файла выбрать Все файлы и сохранить файл в корень сайта.
Файлы без имени с расширением .htaccess позволяют конфигурировать некоторые опции сервера Apache.
Если всё сделано правильно, то текст на странице должен отобразиться правильно, то есть так, как он представлен в текстовом редакторе.
Рассмотрим один из простейших документов HTML5. Он начинается с указания типа документа с помощью специального кода описания типа документа (значение этого кода объясняется в следующем разделе), после чего задается кодировка и название документа, а потом идет его содержимое. В данном случае содержимое состоит из одного абзаца текста:
Этот простой документ можно упростить еще больше. Например, конечный тег вообще-то не является обязательным в стандарте HTML5, т. к. браузеры знают, как закрывать все открытые элементы в конце документа (а стандарт HTML5 узаконивает это поведение). Но подобное срезание углов вместо упрощения делает разметку более сложной для понимания и может вызвать неожиданные ошибки.
Большинство веб-разработчиков придерживается мнения, что использование традиционных разделов и полезно для облегчения восприятия документа, т.к. они четко разделяют информацию о странице (заголовок страницы) и само содержимое (основная часть страницы). Такая структура особенно полезна, когда к странице добавляются сценарии, таблицы стилей и метаэлементы:
Наконец, весь документ (за исключением строки doctype) можно облачить в традиционный элемент , как показано в следующем листинге:
Вплоть до HTML5 в каждой версии официальной спецификации HTML требовалось использование элемента , несмотря на то, что наличие этого элемента никаким образом не влияет на обработку браузером остального кода страницы. В HTML5 использование этого элемента оставлено полностью на личное усмотрение разработчика.
На данном этапе этот пример страницы является чем-то средним между самым простым HTML5-документом и расширенной отправной точкой практической веб-страницы HTML5. В последующих разделах мы добавим к нему остальные необходимые элементы и копнем глубже в разметку.
Описание типа документа HTML5
В первой строке каждого HTML5-документа всегда дается описание типа документа. Это описание ясно указывает, что далее следует HTML5-содержимое, и выглядит следующим образом:
Первое, что бросается в глаза в описании типа документа HTML5 — это его поразительная простота. Сравните его, например, с неуклюжим описанием типа документа, который требуется использовать веб-разработчикам при работе со строгим XHTML 1.0:
Даже профессиональные веб-разработчики были вынуждены вставлять описание типа документа XHTML методом копирования и вставки из другого документа. А описание типа документа HTML5 короткое, четкое и легко вводится вручную.
Описание типа документа HTML5 также примечательно тем, что оно не содержит номера официальной версии HTML (5 для HTML5). В нем просто указывается, что страница является HTML-страницей. Это соответствует новой концепции HTML5 как живого языка. Добавленные в HTML новые возможности автоматически доступны для размещения на странице, не требуя для этого изменений в описании типа документа.
Все это порождает непростой вопрос: если HTML5 — живой язык, то зачем тогда для страницы вообще нужно описание типа документа?
Ответ на этот вопрос таков: описание типа документа продолжает использоваться по историческим причинам. При обработке страницы с отсутствующим описанием типа документа большинство браузеров (включая Internet Explorer и Firefox) переходят в режим совместимости (quirks mode). В этом режиме они пытаются отобразить страницу с учетом ошибок в правилах, которые использовались в более ранних версиях. Проблема с этим состоит в том, что режим совместимости одного браузера может отличаться от режима совместимости другого браузера, вследствие чего страницы, разработанные для одного браузера, на другом браузере будут, скорее всего, отображаться с ошибками, такими как неправильный размер шрифта, нарушенная структура оформления и т.п.
А обнаружив на странице описание типа документа, браузер знает, что обработку этой страницы требуется выполнять, следуя более строгим правилам режима стандартов (standards mode), который обеспечивает единообразное форматирование и структуру страницы при ее отображении любым современным браузером. За некоторыми исключениями, браузеру совершенно безразлично, какой именно тип документа указан в описании. Он просто проверяет, что страница имеет какое-либо описание типа документа. Описание типа документа HTML5 просто самое короткое действительное описание типа документа, которое задействует режим стандартов браузера.
Кодировка символов
— это стандарт, указывающий компьютеру, каким образом преобразовывать текст в последовательность байтов при записи текста в файл (а также, как выполнять обратное преобразование при открытии файла). По историческим причинам в мире существует множество разных кодировок. В настоящее время практически на всех веб-сайтах используется компактная и быстрая кодировка UTF-8, поддерживающая все символы других алфавитов, которые вам когда-либо могут потребоваться.
Веб-серверы часто настраивают, чтобы сообщать посещающим их браузерам, что предлагаемые сервером страницы имеют определенную кодировку. Но нельзя быть уверенным, что веб-сервер, на котором вы планируете разместить свой веб-сайт, будет настроен таким образом (если только это не ваш собственный сервер). Кроме этого, попытка браузера в таком случае предположить наиболее вероятную используемую кодировку может претерпеть неудачу по причине какого-либо малоизвестного вопроса безопасности. По этим причинам всегда следует вставлять информацию об используемой кодировке в разметку страницы.
HTML5 делает эту задачу легкой. Для этого нужно лишь вставить элемент в самом начале блока (или, если элемент не используется, сразу же после кода описания типа документа):
Инструменты для веб-разработки, такие как Dreamweaver или Expression Web, вставляют этот элемент автоматически при создании страницы. Эти инструменты также обеспечивают сохранение файлов в кодировке UTF. Но при создании веб-страницы с помощью обычного текстового редактора, чтобы обеспечить сохранение файлов в правильной кодировке, может потребоваться выполнить дополнительные шаги.
Считается хорошим тоном указывать естественный язык веб-страницы. Эта информация может быть иногда полезной для других, например, поисковые движки могут использовать ее для фильтрации результатов поиска, чтобы возвратить только страницы на указанном языке.
Вставить в веб-страницу информацию о языке легче всего через элемент :
Информация о языке также может быть полезной, если страница содержит текст на разных языках, который нужно прочитать с помощью программы чтения экранного текста. В таком случае атрибут lang с кодом соответствующего языка вставляется в нужном месте документа, например, в элементы
, охватывающие текст на разных языках. Таким образом, программа чтения экранного текста способна определить, какой текст она может читать.
Добавление таблицы стилей
Практически в каждой странице должным образом разработанного профессионального веб-сайта используются таблицы стилей. Для указания требуемой таблицы стилей используется элемент в блоке документа HTML5:
Этот способ похож на указание таблиц стилей в традиционных HTML-документах, но немного проще. Так как существует единственный язык каскадных таблиц стилей — CSS, то в добавлении атрибута type="text/css", который требовался ранее, больше нет надобности.
Добавление JavaScript-кода
Язык сценариев JavaScript изначально создавался как средство для трудоемкого способа придания блеска и обаяния скучным веб-страницам. В настоящее время основная область применения JavaScript сместилась с разработки прибамбасов интерфейса на разработку нестандартных веб-приложений, включая сверхэффективных клиентов электронной почты, текстовых редакторов и картографических движков, которые исполняются непосредственно в браузере.
Код JavaScript вставляется в документ HTML5 по большому счету таким же способом, как и в традиционную HTML-страницу. В следующем листинге приводится пример вставки в веб-документ кода JavaScript по ссылке на внешний файл:
Атрибут language="JavaScript" не является обязательным, т. к. если не указан какой-либо другой язык сценариев (а поскольку JavaScript — единственный широко-поддерживаемый язык сценариев для HTML, то вероятность такого развития ничтожно мала), браузеры автоматически предполагают, что используется JavaScript. Но даже ссылаясь на внешний файл с кодом JavaScript, все равно нужно помнить о закрывающем теге . Если упустить этот тег по недосмотру или при попытке укоротить код, используя синтаксис пустых элементов, то страница не будет работать должным образом.
Если вы уделяете много времени тестированию своих страниц с JavaScript в Internet Explorer, может быть полезным добавление метки MOTW (Mark of the Web - метка особенности сети) в блок сразу же после строки кодировки. Делается это таким образом:
Все другие браузеры не обращают внимания на метку MOTW и используют одни и те же настройки безопасности как для страниц, загружаемых с удаленных веб-сайтов, так и для локальных файлов HTML.
Читайте также: