Каталог статей
Поиск по базе статей  
Статья на тему Интернет » Интересное в сети » Переход на&nb p;шаблонный дизайн

 

Переход на&nb p;шаблонный дизайн

 

 

Общая схема разработки веб-сайтов с помощью высокоуровневых средств вроде 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>
...

В этом примере пункт меню «Выход» появляется только в случае успешного входа пользователя в систему. С помощью вставок кода if (isUser()) ... программист веб-страницы выполнил простейшее переключение режима отображения части меню в зависимости от факта входа конкретного пользователя в систему.

Попытаемся теперь представить себе ситуацию, когда отлаженный скрипт приходится подгонять под совершенно другой стиль оформления. В этом случае простой квалификации веб-дизайнера может быть недостаточно. Конечно, вы заметите, что приведенный пример чрезвычайно прост. Но в реальной обстановке можно столкнуться с достаточно изощренным решением, которое мало того что не комментировано на уровне кода, но еще и не имеет встроенного шаблонного механизма. Характерный стиль оформления кода часто встречается в разовых веб-решениях, которые не планируется использовать серийно. Дело здесь не столько в квалификации разработчика, сколько в поджимающих сроках, что часто приводит к получению уникального решения, которое совершенно нежизнеспособно при переходе на другую платформу или при изменении способа хранения данных. Такие вопросы, как безопасность информации, разработчиками обычно парируются уникальностью решения и сложностью получения их исходных кодов.

Постепенный переход

Если вы приняли решение о возможности переделки такого скрипта, стоит выполнять такую переработку постепенно, хотя бы для сравнения внешнего вида и функциональности получающегося решения на разных стадиях рефакторинга. В таком случае представляется возможным поэтапный перевод указанного веб-скрипта в нормальный шаблонный вид с помощью методики, которую я постараюсь описать далее. Сначала следует приготовиться к тому, что весь вывод вашего скрипта должен выполняться с помощью одной-единственной процедуры вывода. Эта же процедура в дальнейшем в качестве бонуса может выполнять функции оптимизатора 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
загрузка...

 

 

Наверх


Постоянная ссылка на статью "Переход на&nb p;шаблонный дизайн":


Рассказать другу

Оценка: 4.0 (голосов: 16)

Ваша оценка:

Ваш комментарий

Имя:
Сообщение:
Защитный код: включите графику
 
 



Поиск по базе статей:





Темы статей






Новые статьи

Противовирусные препараты: за и против Добро пожаловать в Армению. Знакомство с Арменией Крыша из сэндвич панелей для индивидуального строительства Возможно ли отменить договор купли-продажи квартиры, если он был уже подписан Как выбрать блеск для губ Чего боятся мужчины Как побороть страх перед неизвестностью Газон на участке своими руками Как правильно стирать шторы Как просто бросить курить

Вместе с этой статьей обычно читают:

Mitsubishi Pajero, Toyota Land Cruiser Prado: Переходим к снежным процедурам

В тесте участвуют автомобили: Mitsubishi Pajero, Toyota Land Cruiser Prado Посмотреть другие фото (12) Дорогие, престижные, комфортабельные и очень популярные – обе эти машины по-настоящему универсальные вседорожники. Новый царь?

» Японские автомобили - 6498 - читать


Hyundai Elantra: Дизайн говорит о продукте все

В тесте участвуют автомобили: Hyundai Elantra Так что же говорит дизайн новой «Элантры»? Характер стал тверже.

» Корейские автомобили - 2329 - читать


Ford Fusion: Переходный возраст

В тесте участвуют автомобили: Ford Fusion Его трудно не заметить. Еще бы, на целую голову выше обычных легковушек, он чем-то напоминает второгодника за последней партой.

» Немецкие автомобили - 1955 - читать


Mercedes A-Class: Прелести переходного возраста

В тесте участвуют автомобили: Mercedes A-Class Внутри больше, чем снаружи. Именно так можно описать удлиненный "Мерседес" А-класса.

» Немецкие автомобили - 2178 - читать


ГАЗ переходит на дизель

Когда «Газель» только-только появилась на рынке, всем было понятно, что для этой модели явно не хватает дизельного двигателя. Знали это и на «ГАЗе», однако собственных достойных разработок малолитражного дизеля не было, поэтому в 1995 году Горьковский завод закупил лицензию на производство новейшего австрийского дизельного мотора фирмы Steyr (сейчас он называется «ГАЗ-560»). Его основными особенностями является наличие вместо раздельных блока цилиндра и его головки цельного ...

» Разное - 9290 - читать



Статья на тему Интернет » Интересное в сети » Переход на&nb p;шаблонный дизайн

Все статьи | Разделы | Поиск | Добавить статью | Контакты

© Art.Thelib.Ru, 2006-2024, при копировании материалов, прямая индексируемая ссылка на сайт обязательна.

Энциклопедия Art.Thelib.Ru