Збірка сайту по цеглинці
Сьогодні ми поговоримо про те, як мінімальними зусиллями створити сайт з динамічним контентом. Зазвичай створення сучасного динамічного веб-сайту - це результат роботи серйозної професійної команди. Дизайнер розробляє зовнішній вигляд сторінок, програміст організовує базу даних і пише керуючі контентом скрипти, верстальник створює ергономічний код, контент-менеджер підтримує сайт наповненням, веб-майстер налаштовує веб-сервер і стежить за правильною роботою всього сайту в цілому.
Звичайно, серйозну роботу не зробити без хорошої команди. Але багато початківці веб-майстри, вперше взялися за створення невеликого динамічного сайту, хотіли б мати для цього завдання простий інструмент, не надто далеко пішов від добре знайомого статичного HTML. У цій статті я постараюся продемонструвати, як один чоловік без особливого досвіду в програмуванні може побудувати динамічний сайт буквально за один день. У цьому нам допоможе технологія темплейтов, що реалізується за допомогою нескладних скриптів на мові PHP.
Якщо за створення кожного інформаційного блоку відповідає PHP-скрипт, «вбудований» в HTML-код сторінки, то нічого, крім головного болю, обслуговування такого сайту вам не принесе. Будь-яка зміна структури сайту або способу обробки інформації в одному з блоків призведе до необхідності вносити значні корективи відразу в безліч сторінок. Тому веб-програмісти прагнуть якомога сильніше відокремити код сайту від його верстки та дизайну.
Коли веб-сервер зустрічає цей скрипт, він перенаправляє його інтерпретатора PHP, який на місце кожної команди include вставляє текст з відповідного файлу. Сторінку, отриману в результаті складання, сервер передає користувачеві.
Рекомендуємо прочитати Блоки з відповідями Google пошуку (Answer Boxes)
Звичайно, генерувати подібним чином окрему сторінку немає ніякого сенсу. Але при великому числі сторінок з подібною компонуванням деякі блоки (в нашому випадку, наприклад, header.txt і menu.txt) будуть використовуватися багаторазово. Виграш від цього виходить двоякий. По-перше, при необхідності змінити, припустимо, меню, редагувати доведеться тільки один файл, а по-друге, основний текст сторінки в файлі main.txt НЕ буде перевантажений абсолютно не відносяться до справи тегами і скриптами, значить, менше буде ризик помилки при редагуванні.
Даний приклад добре ілюструє ідею «збирання» HTML-коду сторінки зі шматочків шляхом вкладення їх у основний блок сторінки. Кожен з підключаються файлів відповідає тільки за одну певну функцію. Але основний сенс полягає в тому, що вдалося повністю позбутися від приміщення HTML-коду всередину PHP-коду, так як тут кожна частинка HTML зберігається в окремому файлі.
Простота прикладу вражає, але годиться такий спосіб тільки для дуже нескладних сторінок. Головний мінус цього варіанта полягає в тому, що зв'язки розбитих по окремих файлів блоків HTML-коду жорстко задані всередині самого PHP-скрипта. Для динамічного сайту це не годиться.
Варіант 2. Динамічна структура
Задача зробити сайт з функціями динамічної структури даних.
У цьому прикладі ми ближче підійдемо до основного завдання - створити сайт на основі темплейта.
Вид основної сторінки (index.php) змінився незначно:
Справа в тому, що все найцікавіше заховано в файлі func.php (див. Лістинг), який підключається в першому рядку скрипта. Файл func.php складається з двох частин. У першій визначаються значення змінних, які знадобляться в подальшому, а в другій міститься опис функції text, яка виконує вставку змінюваного тексту. В даному простому прикладі нам знадобилася єдина змінна $ text_path. задає шлях до каталогу, з якого функція text буде брати файли.
Може виникнути природне запитання: а як же функція text визначить, який файл слід вставити? Адже ми створюємо багатосторінковий сайт. Для доступу до всіх сторінок використовується файл index.php. а для вказівки, якою інформацією наповнити сторінку, служить параметр page, який передається в форматі CGI-запиту, наприклад, index.php? page = news - для посилання на сторінку з новинами або index.php? page = photo - для сторінки з фотоальбомом і т. д. Якщо ім'я розділу не було задано, або зазначеної сторінки не існує, виводиться текст з файлу index.txt.
Таким чином ми позбулися необхідності створювати для кожної сторінки нашого сайту окремий файл, як це було в першому прикладі. Але поки структурі нашого сайту не вистачає гнучкості. HTML-код, який визначає, як буде виглядати сторінка, розкиданий по окремих файлів-фрагментів, і зміна дизайну сайту може стати великою проблемою.
Рекомендуємо прочитати Бізнес в Китаї: особливості просування в місцевих пошукових системах
Варіант 3. Єдиний темплейт для всього сайту
Те, що залишиться, якщо всю змінну інформацію викинути, - це і є темплейт сторінки. Для створення темплейтного сайту треба просто навчитися вставляти інформаційні блоки всередину темплейта. На практиці темплейти бувають досить складними, в них використовуються нетривіальні прийоми верстки та дизайну, проте врешті-решт залишається просто додати в темплейт текст. Ми не будемо захаращувати статтю складними прикладами і розглянемо гранично спрощений темплейт:
Помістимо код темплейта в файл index.php. Він повністю описує структуру нашої сторінки, якщо не брати до уваги того, що замість основного тексту в ньому міститься виклик функції text. замість меню - виклик функції menu, а замість блоку коротких новин - виклик функції news. Код цих функцій розміщений у файлі func.php. який підключається директивою require на початку темплейта.
Як бачите, наш сайт вже знаходить динаміку. Додаткові можливості дає додавання в початок файлу func.php різних змінних - параметрів, значення яких використовуються в коді, що формує інформаційні блоки. Ви можете додати і нові функції, які в подальшому будуть активно застосовуватися при формуванні сторінок.
Рекомендуємо прочитати не небезпечно створювати сайт на конструкторі?
Єдиний мінус полягає в тому, що коли буде написано безліч функцій, ви почнете в них плутатися. Якщо це сталося, значить, сайт вже не можна назвати невеликим і нескладним. Пора подумати про повноцінний багатофункціональному движку.
Лістинг. файл func.php
Кіса, ви вмієте малювати?
Мабуть, самий незамінний чоловік в команді веб-студії - це веб-дизайнер. Ви або вмієте малювати, чи ні. Як же бути, якщо сайт треба робити поодинці, а з малювання з кресленням в школі у вас була натягнута трійка? В такому випадку, швидше за все, вам підійдуть безкоштовні HTML-темплейти, яких в мережі досить багато.
Наwww.icehousedesigns.com / downloads все виглядає досить просто, але при бажанні можна знайти досить цікаву інформацію про створення сайтів і різні графічні заготовки. На інших сайтах все приблизно так само - десь краще, десь гірше.
Де взяти темплейти?
- www.freelayouts.com/templates/templates.php - понад 800 темплейтов не тільки HTML, але і Flash, Swish, багато описів і, звичайно, можливість додати свій темплейт і брати участь в конкурсах на кращий темплейт.
- www.templateclub.com - вимагає реєстрації.
- www.snakeyewebtemplates.com/web-templates/templates-free.html - є і безкоштовний, і платний розділи.
- www.oswd.org - трохи похмурий сайт, однак темплейти можна переглядати не у вигляді картинок, а в уже закінченому HTML-вигляді.
- winstart.com/template - безкоштовно, перед скачуванням можна подивитися превью.