Підходи до організації сайтів
Існує два принципово різних підходи до організації сайтів - статичний і динамічний.
Статичним вважається сайт, що складається з незмінних, тобто статичних, web-сторінок.
Статичною прийнято називати web-сторінку, яка формується розробником і в готовому вигляді зберігається у файловій системі сервера. Кожен раз при звертанні до неї браузер представляє її користувачеві у незмінному вигляді. Сервер при цьому просто пересилає таку сторінку браузеру, который выводит ее на экран монитора (этот процесс называют "рендерингом").
Схематично роботу із статичним сайтом можна представити так:
Особливості статичних web-сторінок:
створюються заздалегідь;
мають незмінне інформаційне наповнення (контент, content - содержимое).
Статичні сайти не здатні реагувати на введену користувачем інформацію, тому є пасивними. Як правило, статичні сайти складаються із HTML-сторінок.
Якщо назва веб-сторінки, яку ви переглядаєте в браузері, закінчується на .html, то дана сторінка, скоріш за все, статична.
Статичні сайти мають як свої переваги, так і недоліки. Переваги статичних сайтів:
Створюють мінімальне навантаження на сервер, а тому невимогливі до ресурсів хостинга. Сайт буде працювати на будь-якому сервері хостинга, навіть з самими обмеженими можливостями.
Швидко завантажуються;
Їх розробка обходиться дешевше;
Дешевші в технічній підтримці (хостингу); практично всі провайдери можуть забезпечити хостинг статичного сайта;
Простота переносу на інший сервер або локальний комп’ютер;
Людині, що займається підтримкою сайту, не потрібно знати мови програмуваннявання, для створення сторінки, достатньо знати лише мову HTML
Сайт можна переглядати локально, не встановлюючи додаткове програмне забезпечення. Веб-майстру зручно налагоджувати сторінки, не виходячи в Інтернет
Мале число використовуваних програмних компонентів робить складним злом такої системи.
Недоліки статичних сайтів:
Складність оновлення сайту (при додаванні нових матеріалів або документу, зміни меню сайта, логотипа і т.ін необхідно правити багато (якщо не всі) сторінки сайту, щоб забезпечити зміни в системі навігації).
Неможливо (дуже складно) забезпечувати зворотній зв'язок з користувачем та надавати їм можливість спілкування шляхом підтримки на сайті чатів, форумів, гостьових книг, підписок та новин і т.ін.;
Керування сайтом (внесення будь-яких змін в контент або дизайн сторінки) потребує знань і вмінь в області веб-програмування, що може викликати додаткові витрати при необхідності редагування сайту (або на утримання в штаті високооплачуваного веб-дизайнера, або для звернення за допомогою до спеціалістів веб-студії).
При розвитку сайту й збільшенні кількості сторінок важко підтримувати його цілісність, стежити за правильністю програмних кодів, тощо.
Неможливо або достатньо важко забезпечити поділ прав доступу до вмісту сайта.
Таким чином, статичний сайт дешевше в розробці та технічній підтримці, але ці переваги нівелюються серйозними недоліками в оперативності публікації інформації і витратами на керування сайтом.
В основному статичні сайти застосовуються для створення невеликих і середніх сайтів з постійною структурою і зовнішнім виглядом сторінок (але кожна сторінка може мати свій шаблон оформлення), які можна розміщувати на будь-яких хостингах, у тому числі на безкоштовних. Прикладом статичного сайту може бути сайт-візитка.
Динамічним називають сайт, хоча б одна сторінка якого є динамічною.
Динамічною називають web-сторінку, вміст якої може змінюватися в залежності від певних умов та/або дій. Такі web-сторінки генеруються (або формуються) програмно із заздалегідь визначених даних в процесі виконання запиту користувача. Тобто, динамічної web-сторінки, в тому вигляді, в якому людина її бачить на моніторі, на сервері не існує. Існують тільки дані, із яких вона формується.
Основна властивість динамічних сайтів - гнучкість, рухливість в підборі та поданні інформації, що відповідає "запиту" відвідувачів сайту.
Необхідність побудови динамічних web-сторінок виникає, наприклад, у випадку, коли web-сервер повинен повертати різну інформацію для різних людей (в залежності від того, хто саме зайшов на сторінку), а також інформацію, яка змінюється з плином часу (найбільш актуальний приклад — форум).
Динамічні сайти здатні реагувати на введену користувачем інформацію, тому, як правило, є інтерактивними.
Формування динамічних web-сторінок здійснюється декількома способами:
об'єднанням декількох окремих частин в одну сторінку (це найпростіший спосіб генерації);
заповненням готової шаблонної сторінки інформацією, що зберігається окремо або одержуваної в результаті роботи алгоритму (наприклад, в результаті обчислень);
поєднанням перших двох варіантів у всіляких варіаціях, тобто сторінка збирається з декількох частин, в які при цьому вносяться різні зміни (найпоширеніший варіант).
У більшості випадків побудова динамічних сторінок базується на використанні заздалегідь розробленого шаблону сторінки, який визначає відображення сторінки у вікні браузера. У нього вставляється контент - змінне інформаційне наповнення сторінки, яке, зазвичай, зберігається в БД, яка часто фізично розташована на іншому сервері. Коли користувач запитує сторінку, відповідна інформація витягується з БД, вставляється в шаблон, утворюючи web-сторінку, і пересилається web-сервером в браузер, який і відображає її належним чином. Схематично це можна представити наступним чином:
У динамічних сайтах реалізований поділ змісту (змінного контенту) і оформлення веб-сторінок (незмінних html-конструкцій, які повторюються на всіх сторінках і описують їх структуру і дизайн) - це дозволяє оперативно змінювати інформацію на сайтах без необхідності змінювати програмні коди сторінок. Подібний підхід до формування веб-сторінок - одна з найголовніших переваг динамічних сайтів.
Поділ контента й дизайну сайту дає можливість управляти сайтом будь-якому користувачеві, навіть без знання веб-програмування.
Динамічні сайти можуть «підлаштовуватися» під своїх відвідувачів, реагуючи на їхні дії. Для цього використовуються технології серверних, клієнтських скриптів, за допомогою яких і створюються сценарії поводження сайту при певних діях користувачів.
Окрім контенту, динамічно можуть створюватися також і елементи навігації по сайту. Та-ким чином, при оновленні вмісту сайту, необхідно просто додати текст для нової сторінки, який потім вставляється в БД за допомогою певного механізму. В результаті виходить, що сайт як би сам себе оновлює.
Переваги динамічних сайтів:
Використання шаблонів дозволяє легко змінювати інформацію на багатосторінкових сайтах;
За рахунок того, що сайт складається з різних частин, його легше обробляти. Наприклад одна людина може займатися тільки графікою, інший тільки контентом, третій форумом і чатом і т.д.
В залежності від дій відвідувача можна змінювати модифікації сайту, його контент. Наприклад додати чат, прибрати форум, додати інтернет ігри, інтернет магазин і т.д.
Можна заощадити багато грошей один раз заплативши веб-дизайнеру за створення сайту, а потім самостійно змінюючи контент на ньому і не залучаючи до цього сторонніх людей.
У дінамічніх сайтах реалізованій поділ контенту й оформлення веб-сторінок, що дозволяє оперативно змінюваті інформацію на сайтах без зміни програмних кодів сторінок.
Недоліки:
Необхідність застосування різних програм для побудови динамічного сайту, застосування різних скриптів, розробка деяких із яких може коштувати чимало. Можуть знадобитися послуги програмістів по з'єднанню всього цього калейдоскопу в одне ціле.
Підвищені вимоги до технічних характеристик потужності сервера і відповідно здорожчання вмісту таких сайтів.
У порівнянні зі статичними сайтами, динамічні більш «важкі», дають більше навантаження на сервер - отже, вони більше вимогливі до хостингу, ресурсів сервера.
Щоб динамічні сайти «працювали», потрібно додаткове програмне забезпечення, тоді як для відображення статичних сайтів досить одного лише браузера. Це робить розробку і підтримку динамічних сайтів більше дорогою у порівнянні зі статичними сайтами.
Таким чином, якщо сайт складається з багатьох сторінок або повинен часто оновлюватися, перевага динамічної організації стає очевидною. При зміні інформаційного наповнення сторінки або дизайну розробникам сайту не потрібно переписувати всю сторінку, оскільки сторінки не зберігаються повністю, а формуються при зверненні до них.
Тому залежно від поставлених завдань можуть використовуватися як статичні, так і динамічні сайти. Наприклад, для реалізації сайтів-візиток не потрібне оновлення контента, не потрібна наявність інтерактивних функцій - тому сайт може бути статичним. У свою чергу, неможливо створити інтернет-магазин, використовуючи лише статичні HTML-сторінки, - він просто не буде працювати. Форуми, чати, інтернет магазини, системи електронних платежів створюються саме динамічно.
Web-технології
Існують різні технології (веб-технології) створення веб-сторінок. Їх класифікацію можна представити наступним чином:
Технології створення статичних сайтів передбачають використання мови розмітки гіпертексту HTML та каскадних таблиць стилів CSS (Cascading Style Sheets).
Мова HTML (або XHTML) дозволяє форматувати текст, розрізняти в ньому функціональні елементи, створювати гіперпосилання і вставляти в сторінку зображення, звук та інші мультимедійні елементи.
Натепер, окрім HTML застосовуються і інші мови розмітки, такі як WML, XML.
CSS використовуються для оформлення та форматування різних елементів веб-сторінок, в результаті чого значно знижують розміри веб-сторінок.
Створення веб-сторінок статичних сайтів - це трудомісткий процес. Такі сторінки створюються вручну у файловій системі комп'ютера, потім зберігаються і завантажуються на сайт.
При створенні статичних сторінок можна використовувати два основних підходи:
ручне їх створення за допомогою невізуальних редакторів тексту типу Блокнот. Це дозволяє використовувати багато зручних додаткових функцій, таких як підсвітка коду, перевірка валідності створеного коду, підбір кольору, швидке створення таблиць, вставку основних й найрозповсюджених елементів гіпертекстової розмітки, тощо.
використання візуальних редакторів типу Microsoft FrontPage, Macromedia Dreamweaver. Однак вони практично завжди мають один дуже значний недолік - генерують надлишковий програмний код, за рахунок чого сильно збільшується вага сторінки і швидкість її завантаження. З цієї причини професіонали віддають перевагу використанню невізуальних редакторів.
Будь-які зміни на сайті здійснюються через виправлення HTML-коду. Всякий раз, коли потрібно змінити вміст такої сторінки, користувач модифікує її на своєму робочому комп'ютері, зберігає, а потім заново завантажує на сайт. Ці дії можуть бути виконані тільки адміністратором сайту.
Сучасні технології створення динамічних сайтів передбачають використання програмного коду, що забезпечує інтерактивність Web-сторінок, і називається сценарієм (скриптом).
Скрипт (сценарій) - це програма, яка автоматизує деяку задачу.
Скри́птова мова (scripting language, мова сценаріїв) — мова програмування, розроблена для запису «сценаріїв», послідовностей операцій, які користувач може виконувати на комп'ютері. Сценарії, зазвичай, інтерпретуються, а не компілюються.
Даний термін був обраний, очевидно виходячи із специфіки таких програм. Основне їхнє призначення, цей опис «реакції» Web-сторінки на дії користувача. В деяких випадках текст скрипта вбудований в HTML-документ, в інших випадках завантажується з окремого файлу.
Розрізняють сценарії, що виконуються на стороні клієнта і такі, що виконуються на стороні сервера. Сценарії на стороні клієнта (клієнтські скрипти) виконуються під керуванням браузера, на стороні сервера (серверні скрипти) - під керуванням Web-сервера.
Клієнтські скрипти використовуються, наприклад, коли при введенні інформації перед посилкою її на сервер відбувається перевірка її коректності на стороні клієнта (за допомогою скрипта). Такий прийом серйозно знижує навантаження на сервер і підвищує зручність для користувача.
Наприклад, потрібно перевірити чи правильно користувач ввів e-mail. Щоб це зробити користувачеві, треба було б відправити форму із заповненими даними, потім дочекатися, поки вона обробиться, і лише після цього отримати повідомлення про помилку (якщо вона, зрозуміло, присутня). Це неприпустимо з точки зору зручності для користувача і витрат ресурсів. З клієнтським же скриптом програма відразу перевірить правильність заповнення форми перед відправленням, і, якщо необхідно виведе помилку.
Перевага сценаріїв на стороні клієнта полягає в тому, що вони можуть перевіряти коректність інформації, введеної користувачами, і обробляти її, не звертаючись до сервера.
Недоліки клієнтських скриптів:
• За допомогою клієнтського скрипта ніщо не може бути записано на сервер. За його допомогою не можна зробити, наприклад, гостьову книгу.
• Обробка скрипта залежить від браузера користувача. Користувач має повноваження настроїти свій браузер так, щоб він взагалі ігнорував написані скрипти.
• Код клієнтського скрипта може подивитися кожен, хто відкриє сторінку зі скриптом (вибравши в меню свого браузера команду "Вихідний код сторінки").
Скрипти на стороні клієнта пишуться, зазвичай, на мовах JavaScript, Java. Можуть використовуватися VBScript, ActionScript (Flash) і взагалі будь-які мови програмування. В деяких випадках текст скрипта вбудований в html-документ, в інших випадках завантажується з окремого файлу.
За допомогою JavaScript, зазвичай, реалізуються такі ефекти, як, поява вікон з повідомленнями, відображення анімації. Крім того, JavaScript-сценарії часто використовуються для визначення типу браузера і платформи, на якій він виконується. JavaScript-сценарії також успішно застосовуються для перевірки коректності даних, введених користувачем.
VBScript має багато спільного з мовою JavaScript, однак працює лише з Microsoft Internet Explorer, що обмежує сферу її застосування.
У документ HTML можна також вставляти флеш-фрагменти або Flаsh-ролики (swf-файли). Флеш забезпечує інтерактивність за рахунок інтерактивної векторної анімації для Web. Для створення Флеш використовується мова сценаріїв ActionScript.
Окрім цього, в останній час набрали популярності такі технології як AJAX, Adobe Flash, Microsoft Silverlight і ін. Також можуть застосовуватися Java-аплети і технологія ActiveX.
У зв'язку з тим, що скрипти, що виконуються на стороні клієнта, збільшують обсяг веб-сторінок, їх кількість і розмір на сторінці повинні бути обмеженими. Створення статичних сайтів з інтерактивними веб-сторінками доцільно виконувати в редакторі Macromedia Dreamweaver.
Серверні скрипти виконуються на стороні сервера під керуванням веб-сервера.
Коли користувач дає запит на яку-небудь сторінку (переходить на неї по посиланню або вводить адресу в адресному рядку свого браузера), то викликана сторінка спочатку обробляється на сервері, тобто виконуються всі скрипти, пов'язані із формуванням даної сторінки, і тільки потім вона повертається до відвідувача у вигляді HTML-документа (відвідувач ніяк не зможе побачити код серверного скрипта).
Серверні скрипти потрібні, наприклад, у випадку, коли web-сервер повинен повертати різну інформацію для різних людей, а також інформацію, яка змінюється з плином часу (найбільш актуальний приклад — форум).
Сценарії, призначені для виконання на стороні сервера, зазвичай, розташовуються в спеціальному каталозі усередині папки сайта. Приймаючи запит користувача, у якому зазначена програма, сервер запускає цю програму на виконання. У результаті виконання програми вихідні дані передаються web-серверу, а потім клієнту:
Серверні скрипти, як правило, взаємодіють з БД. У цьому випадку скрипти виконують запити до СУБД, остання повертає результати (запити-дані), а скрипт формує документ, який передається браузеру. Найбільш часто використовуються СУБД Mysql, PostreSQL, MS SQL Server, Oracle.
Робота серверних скриптів залежить від сервера, на якому розташований сайт, і від того, які технології підтримуються сервером.
Залежно від розв'язуваних задач для створення сайту вибирають ту чи іншу мову серверних скриптів. Для створення малих і середніх інтерактивних сайтів доцільно застосовувати мову сценаріїв PHP. Перевагою мови PHP є те, що вона є безкоштовною, має відкриті вихідні коди і працює майже на всіх платформах. Також використовують мови Perl, Python, тощо. Конкурентами PHP є технології ASP.NET, JSP, Cold Fusion, Perl.
Сучасні сайти найчастіше являють собою складні програмно-інформаційні системи, які вирішують значну кількість задач бізнес-логіки і теоретично можуть дублювати функції більшості бізнес-застосувань.
Для підтримки роботи динамічних сайтів необхідно, щоб сервер мав спеціалізоване програмне забезпечення, що працює з БД і створює сторінки динамічно. Це програмне забезпечення називається веб-застосуваннями.
Веб-застосування — це програмний комплекс для вирішення задач веб-сайту, який міститься у складі сайту і працює разом з ним.
Зазвичай, веб-застосування створюються як додатки в архітектурі "клієнт-сервер": клієнтська частина реалізує користувальницький інтерфейс, формує запити до сервера і обробляє відповіді від нього; серверна частина отримує запит від клієнта, виконує обчислення, після цього формує веб-сторінку і відправляє її клієнтові по мережі з використанням протоколу HTTP.
Клієнтом веб-застосування виступає браузер, який, зазвичай, містить деяку частину логіки застосування (перевірка коректності даних, що вводяться), а сервером — веб-сервер. При цьому серверна частина має різні архітектурні рішення.
Розділ програмування, орієнтований на розробку динамічних Інтернет- застосувань, - веб-програмування (веб-розробка).