Общая схема разработки веб-сайтов с помощью высокоуровневых средств вроде Dreamweaver сводится к получению необходимых данных, например из таблиц MySQL, и дальнейшему их «заковыванию» в дизайн. Как правило, веб-страница, созданная с применением такого механизма разработки, нуждается не просто в изменении дизайна (чего часто хочет ваш клиент), но и в коренной переделке самой структурной схемы ее работы. Это может выражаться как в простейшем вынесении функций и обращений к базам данных в классы, так и в более сложной процедуре рефакторинга всего вашего приложения. Попытаемся опустить все меркантильные составляющие этой проблемы (соотношение стоимости разработки решения с нуля и его переделки в божеский вид) и представим, что вы получили достаточно времени и стимулов для переработки веб-сайта в технически грамотное программное решение.
С чего следует начать
Основа большинства современных веб-решений — это PHP-скрипт, который использует библиотеки функций и позволяет подключать разнообразные виды внешнего оформления.
Для быстрой смены дизайна используется так называемый механизм шаблонов, который представляет собой способ разделения оформления веб-сайта и его содержимого. В простейшем случае решение такого типа позволяет абстрагироваться от полета мысли дизайнера. Также это дает возможность достаточно просто сменить внешний вид веб-сайта, не вдаваясь в реальные проблемы программирования. Конечно, PHP, являющийся одним из самых массовых веб-интерпретаторов, достаточно гибок, и под него наработано уже настолько много разнообразных решений, что создание очередного веб-проекта часто упирается в вопрос выбора готового «движка».
Как правило, такая схема коренным образом отличается от чисто линейного вывода данных со вставками PHP-кода. Во-первых, для качественного решения задачи «шаблонирования» веб-сайта необходимо подготовить все данные перед началом вывода информации. Во-вторых, часто бывает нужно применять многоуровневое «шаблонирование». Одно из наиболее выдающихся решений такого типа — это популярный форум PHPBB, который позволяет отлично настраивать свой внешний вид на уровне как строк данных, так и в целом всей страницы. При этом дизайн составляющих частей как бы вкладывается, постепенно переходя с уровня «боксов» с информацией к общему виду веб-страницы. В итоге любой пользователь этого программного решения получает отличную возможность настройки форума под внешний вид своего сайта.
Для создания же простейших веб-решений вроде веб-магазина или веб-прайса часто нет необходимости использовать готовые решения вроде приведенного выше. Вопросы безопасности готового решения, как правило, при этом стоят не на самом последнем месте. Поэтому есть смысл использовать собственные разработки, а значит, и собственные шаблонные механизмы. Представим простейший случай двухуровневого веб-дизайна. Этим примером может служить веб-страница, которая в качестве опоры использует основную (каркасную) таблицу. Меню такой страницы может быть оформлено в виде «бокса». Именно такой участок кода ("бокс" меню) и можно вынести в шаблон второго уровня. Итак, попытаемся представить, как выглядел бы вывод простейшей HTML-страницы без оптимизации:
...
<table>
<tr>
<td>
Меню системы
<a href="./login.php">Войти в систему</a>
<? if (isUser()) { ?>
<a href="./logout.php">Выход</a>
<? }; ?>
</td>
</tr>
<tr>
<td>Информационное наполнение сайта</td>
</tr>
</table>
...
В этом примере пункт меню «Выход» появляется только в случае успешного входа пользователя в систему. С помощью вставок кода
Попытаемся теперь представить себе ситуацию, когда отлаженный скрипт приходится подгонять под совершенно другой стиль оформления. В этом случае простой квалификации веб-дизайнера может быть недостаточно. Конечно, вы заметите, что приведенный пример чрезвычайно прост. Но в реальной обстановке можно столкнуться с достаточно изощренным решением, которое мало того что не комментировано на уровне кода, но еще и не имеет встроенного шаблонного механизма. Характерный стиль оформления кода часто встречается в разовых веб-решениях, которые не планируется использовать серийно. Дело здесь не столько в квалификации разработчика, сколько в поджимающих сроках, что часто приводит к получению уникального решения, которое совершенно нежизнеспособно при переходе на другую платформу или при изменении способа хранения данных. Такие вопросы, как безопасность информации, разработчиками обычно парируются уникальностью решения и сложностью получения их исходных кодов.
Постепенный переход
Если вы приняли решение о возможности переделки такого скрипта, стоит выполнять такую переработку постепенно, хотя бы для сравнения внешнего вида и функциональности получающегося решения на разных стадиях рефакторинга. В таком случае представляется возможным поэтапный перевод указанного веб-скрипта в нормальный шаблонный вид с помощью методики, которую я постараюсь описать далее. Сначала следует приготовиться к тому, что весь вывод вашего скрипта должен выполняться с помощью одной-единственной процедуры вывода. Эта же процедура в дальнейшем в качестве бонуса может выполнять функции оптимизатора HTML-кода. Оптимальный вариант — это разбить логически ваш скрипт на три части:
- top.php — скрипт, в котором подключаются все возможности вашего интерпретатора и необходимые для его работы внешние библиотеки. Обратите внимание — в этом скрипте информация подготавливается, но не выводится в клиентский браузер. Весь вывод пройдет в самой последней части описываемой структуры. Файл (или набор скриптов) top.php может быть как уникальным для вашей веб-системы, так и состоящим из нескольких составляющих частей. Конечно, оптимален вариант унитарного файла. При этом вы получаете опять же очередной плюсик в виде возможности включения или выключения отладочных Notice и Warnings, а также ваших личных сообщений;
- xxxxx.php — веб-программа, уникальная для каждого из разделов вашего сайта. Как минимум, необходимо создать index.php, который будет генерировать данные для стартовой страницы;
- bot.php — формирование данных для основного шаблона. Именно в этой части структуры и будет происходить вызов функции слияния шаблона и исходных данных.
Трехуровневая структура
Для того чтобы представить, каким образом будет выглядеть вывод простейшей страницы (приведенной выше) в контексте этого метода, попытаемся разбить всю функциональность этого приложения на три части.
Скрипт top.php — подготовка и включение внешних библиотек функций:
...
require_once("./functions.php");
...
Основной (управляющий) скрипт подготавливает меню и включает определения функций в top.php и парсер данных в bot.php:
require_once("./top.php");
$arr_menu = array();
$i = 1;
$arr_menu["name".$i] = "Главная";
$arr_menu["href".$i++] = "index.php";
$arr_menu["name".$i] = "Войти в систему";
$arr_menu["href".$i++] = "login.php";
if (isUser())
{
$arr_menu["name".$i] = "Логин";
$arr_menu["href".$i++] = "logout.php";
}
$arr_main_template["menu"] = parse_template("./menu.html", $arr_menu);
require_once("./bot.php");
Вывод данных в bot.php будет выглядеть следующим образом:
$site_str_ = parse_template("./main_template.html", $arr_main_template);
$site_str = enchance($site_str);
echo $site_str;
С помощью функции enchance() проводится оптимизация получаемого HTML-кода. Таким образом, для большого веб-проекта можно значительно сократить объем передаваемого трафика при сохранении его смыслового содержимого.
Шаблонная функция
К приведенному тексту требуются небольшие пояснения. В качестве функции, которая подготавливает вывод в браузер, используется parse_template(). Основное назначение этой функции — подставить значения из переданного ей массива (второй параметр) в шаблонный файл (первый параметр). Таким образом, в index.php можно создать подходящее вам меню (а лучше всего вынести его создание или формирование в menu.php, после чего включить код в скрипт раздела).
В заключение
В приведенном примере продемонстрировано применение двухуровневой модели макетирования данных веб-сайта в готовый дизайн. Как правило, переход от произвольной структуры скрипта к более упорядоченной требует коренной его переделки. Чтобы избежать этого (когда поджимают сроки), можно воспользоваться функциями буферизированного вывода ob_start() и ob_get_contents() для формирования данных с помощью старого кода, чтобы затем обрамлять эти данные в новый дизайн с помощью функции вроде parse_template() из приведенного выше примера. Реальное исполнение задачи требует применения более продвинутых шаблонных механизмов. Но, как правило, набор функций, которые могут понадобиться при внедрении вашего дизайна, четко ограничен. И зачастую бывает необходимо только выполнять подстановку строки и вывод файла в указанных позициях шаблона. А такая задача решается просто и красиво с применением PHP-функций для работы с регулярными выражениями preg*().
Ссылки по теме
Статья получена: hostinfo.ru