Разберемся с таким важным вопросом, как кодировка. При создании первых сайтов, веб-разработчики часто сталкиваются с этой проблемой.
Кодировка –это некоторая таблица соответствий символов и их числовых кодов. Каждый символ имеет свой числовой код. Например, восклицательный знак(!) имеет код33, цифра нуль(0) - 48, буква d - 100. Каждый символ имеет свой уникальный код! Таких таблиц соответствия существует большое количество.
Английские буквы(маленькие и заглавные), цифры: 0,1,2,3,4,5,6,7,8,9и стандартные символы, такие как: !@#$%^&*()_-=+\| имеют в любой кодировке одинаковый код. Например,цифра нуль (0) в любой кодировке имеет код: 48.
По-другому дело обстоит с национальными символами –русскими буквами!В разных кодировках одна и та же русская буква может иметь разный числовой код. И если русский текст сохранен в одной кодировке, а браузер его отображает в другой, то вместо ожидаемого русского текста появится набор непонятных символов.На рис. 7 показан пример вывода текстовой надписи: Проект "Винни-Пух и компания" в другой кодировке:
Рис. 5.7
Внимание!!!Если вместо русских букв отображаются другие символы – возникла проблема с кодировкой!
Существуют две основные кодировки, которые используются при создании сайтов: WINDOWS-1251и UTF-8. Мы будем использовать кодировку UTF-8.
С кодировкой необходимо определиться сразу, перед созданием сайта!!! Неправильный подход к этому вопросу может доставить множество неприятных моментов и отнять много времени.
Для настройки нужной кодировки необходимо выполнить несколько условий:
Все файлы проекта должны сохраняться в нужной кодировке.
Кодировка должна быть указана для PHP,HTML,CSS.
Операции с данными из базы данных должны выполняться с учетом выбранной кодировки.
Выполним пункт первый –укажем кодировку UTF-8для всех файлов проекта. Для этого нажимаем левой клавишей мыши на заголовок проекта puh (см. рис. 5.8):
Рис. 5.8
Нажимаем правую клавишу мыши и в открывшемся меню, выбираем командуСвойства (см. рис. 5.9):
Рис. 5.9
Откроется окно свойств проекта. Для установки нужной кодировки переключатель Кодировка текстовых файлов следует поместить в положение Другаяи справа от переключателя выбрать кодировку UTF-8 (см.рис. 5.10):
Рис. 5.10
После выполнения настроек –нажимаем кнопку OK. Теперь все файлы проекта будут сохраняться в кодировке UTF-8.
Важно!!!При изменении и сохранении файлов проекта не из Eclipse для PHP,кодировка может измениться. В этом случае русские буквы станут отображаться неверно! Во избежание этой проблемы, файлы проекта необходимо редактировать и сохранять строго в Eclipse для PHP!
Выполним второй пункт условий (установим нужную кодировку для PHP,HTML,CSS)-начнем с HTML.Перейдем в файл index.php. Здесь уже записаны некоторые теги. Внутри тегов head добавим тег указания кодировки дляHTML:
<html>
<head>
<title>Project Winnie the Pooh and Company</title>
Мы добавили новый тегmeta. В этом виде он указывает, что в HTMLбудет использоваться кодировкаUTF-8 (кодировка указана в атрибуте charset).
Теперь добавим к нашему проекту файл puh.css –это файл для CSS. Для этого нажимаем левой клавишей мыши на заголовок проекта puh в списке проектов,открываем контекстное меню ивыбираем команду New, CSS File. В появившемся окне, вводим имя файлаpuh.css, и нажимаем кнопку Готово.
В результате к проекту добавится новый файл: puh.css (см. рис. 5.11):
Рис. 5.11
В файле puh.cssмы будем добавлять все свойства CSSдля нашего проекта.
При создании файлаpuh.css, как правило, автоматически добавляется следующая строка (см. рис.5.12):
Рис. 5.12
Эта строка указывает кодировку в CSS. Если у вас не добавилась эта строка или добавилась с другой кодировкой–необходимо добавить/изменить на указанный вариант!
Осталось добавить настройку кодировки для PHP. Эту операцию мы сделаем в специальном служебном файле.htaccess. Обратите внимание, что название файла начинается с символа точка (.). Для этого, нажимаем левой клавишей мыши на заголовок проекта puh в списке проектов.Нажимаем правую клавишу мыши для открытия меню, выбираем New, Файл. В появившемся окне,вводим имя файла .htaccess и нажимаем кнопку Готово.
В результате, сверху появится новая закладка с открытым файлом: .htaccess (см. рис. 5.13):
Рис. 5.13
В файле .htaccess необходимо записать следующие две строки:
AddDefaultCharSet utf-8
php_value default_charset utf-8
Строки указывают настройку кодировки UTF-8для всех PHPфайлов нашего проекта. Пока у нас имеется только одинPHP файл - index.php
Внимание!!!Не стоит пугаться множества новых тегов и настроек. У нас нет задачи специально запоминать их. Главное понимать их предназначение. После создания одного сайта – необходимые теги копируются, немного корректируются и вставляются в новый проект!
Третий пункт по настройке кодировки при работе с базой данных мы выполним, когда начнем работать с базой данных. Первые два пункта для настройки кодировки UTF-8мы выполнили.
Перейдем в файл index.php и внутри теговhead подключимCSSк файлуindex.php:
<html>
<head>
<title>Project Winnie the Pooh and Company</title>
Добавлен тег link, в атрибуте href указано имя нашегоCSS-файла. С подключением внешнего файла к HTML мы уже знакомились на третьем занятии. К нашему проекту необходимо добавить еще два файла PHP, с наименованиями:lib.phpи tovar.php.
Выполните это задание самостоятельно! Добавление этих файлов происходит также как и добавление файла index.php1.
Содержимое файловlib.php и tovar.php пока удалим.
После добавления должно получиться следующее (см.рис. 5.14)
Рис. 5.14
Файл tovar.php–это и есть та страница, которая отвечает за обмен данными с клиентской частью на Java. На этом занятии мы начнем писать ее программный код. Файл lib.phpбудет использоваться для создания основной части программного кода на PHP.Получается, что наш проект будет содержать три файла PHP.
Вспомним: после добавления новых файлов к проекту –необходимо перезапустить Денвер!Выполним перезапуск Денвера2.