Сайты статические и динамические. Основные положения

Статические сайты  /  Динамические сайты

1. Общие сведения  о видах сайтов, статических и динамических страницах

Человек, далекий от web-разработки, за сайт принимает ту единственную страницу в Интернете, которую в данный момент просматривает. Более продвинутый пользователь уверен, что сайтом являются несколько страниц, объединенных некоторым образом.

Веб-мастер знает, что сайт образуют несколько файлов, одна часть из которых ― рабочие файлы (авт.) , другая ― служебные. Рабочие файлы содержат в себе контент, который в конечном итоге, и видит пользователь у себя на дисплее. Служебные файлы выполняют задачи, обеспечивающие работоспособность сайта. И рабочие, и служебные файлы создает Вебмастер.

Страница, которую видит у себя на дисплее конечный пользователь, является HTML-документом. Эта страница формируется браузером пользователя в результате обработки входящего HTML-кода документа. На сегодняшний день такую страницу можно создать двумя способами:

  • чистой HTML- разметкой (говорят: «Страница создана (написана, сверстана и т.п.) на HTML-коде») ;
  • при помощи какого-либо языка программирования, например, PHP (говорят: «Страница создана на PHP-коде»).

HTML- разметка не есть язык программирования. HTML- разметка своего рода стандарт, по которому браузер определяет что и как выводить на страницу.

Программирование применяют когда нужно создать сайт, у которого необходимые свойства только одним HTML-кодом не обеспечиваются.

Так, например, если веб-мастеру требуется показать конечному пользователю только некоторую информацию, то для этих целей достаточно рабочий файл написать HTML-кодом. Но если вебмастер задумал свой ресурс сделать форумом, то тут уже без программирования не обойтись.

Способ создания веб-страниц: при помощи HTML-кода или с применением языков программирования служит основанием для разделения сайтов на статические и динамические.

Независимо от того каким способом была создана страница, браузер для обработки должен получить HTML-код.

Страницы, HTML-код которых пишет веб-мастер, являются статичными. Такие страницы, находящиеся на сервере, по запросу браузера направляются к нему сервером без изменений. Далее идет стандартная процедура обработки HTML-кода браузером и вывод страницы на монитор пользователя в удобной для восприятия человеком форме.

Особенностью статичной страницы является возможность встраивания в ее HTML-кода клиентских скриптов. Пример языка для создания клиентского скрипта ― JavaScript. В браузере клиентские скрипты подключаются напрямую к HTML и как только загружается страничка — тут же выполняются. Все приложения (программы), исполняемые браузером, называются клиентскими. Клиентский скрипт представляет собой код, написанный на языке программирования, и предназначенный для выполнения определенного сценария поведения страницы по запросу пользователя.

Страница, написанная кодом HTML-разметки, является HTML-документом: файлом с расширением .html.

Страницы, HTML-код которых генерируется на стороне сервера, являются динамическими. Важно! Страница генерируется по запросу браузера. Сформированный HTML-код направляется сервером браузеру и далее идет стандартная процедура обработки HTML-кода браузером и вывод страницы на монитор пользователя в удобной для восприятия человеком форме.

Процесс генерации можно упрощенно описать следующим образом.

Веб-мастер создает базу данных, фактически представляющую собой файл, содержащий обычные таблицы из строк и столбцов. В эти таблицы веб-мастер заносит контент. Кроме базы данных веб-мастер пишет электронные документы сайта на каком-либо серверном языке программирования, например, РНР. Применительно к нашему примеру такие файлы будут именоваться с расширением .рhр. Эти файлы предназначены для управления контентом. На практике, если веб-мастер не программист, то он использует готовые решения для управления контентом, так называемый движок (CMS) (пример: известная платформа WordPress). CMS всегда работает в связке с базой данных, управляемой, например, СУБД (система управления базой данных) MySQL.

Веб-мастер создает шаблоны страницы ― .рhр-документы, которые будут заполняться контентом из базы данных по мере поступления запросов браузера.

Базу данных, шаблоны и движок веб-мастер размещает на сервере. Когда браузер посылает запрос серверу относительно какой-либо страницы и если найденная страница (документ) имеет расширение отличное от .html, то на сервере включается в работу интерпретатор рhр-кода. В результате на выходе из шаблона, заполненного контентом из базы данных, формируется html-страница, которая отправляется браузеру для дальнейшей обработки. Важно! В том виде, в котором ее получит клиент, веб-страница на сервере не хранится.

При этом способе формирования страниц достигается моментальное обновление содержания веб-сайта при наличии каких-либо изменений в базе данных.

Для конечного пользователя не имеет значения, какую именно страницу статичную или динамическую он просматривает. Для веб-разработчика разделение сайтов на статические и динамические имеет критически важное значение: еще до начала создания своего проекта веб-мастер может определиться какой функциональностью будет обладать его веб-сайт.

2. Статические сайты

Напомним, что к статическим сайтам следует относить сайты, у которых каждая веб-страница является статичной. Другими словами: сколько веб-страниц, столько и файлов с расширением .html веб-мастер должен создать.

Статический сайт содержит в себе компоненты: HTML-размеченные тексты (HTML-документы), изображения, мультимедиа содержимое (аудио, видео). Компоненты в пределах сайта связаны между собой перекрестными ссылками (гиперссылками), так же HTML-документы сайта имеют ссылки на внешние ресурсы. HTML-документ (файл с расширением .html) может включать в своем составе клиентский скрипт.

Для создания статического сайта вебмастеру понадобятся:

  • браузер;
  • текстовый редактор типа «блокнот» WINDOWS;
  • знания языка разметки HTML;
  • знание правил стилевого оформления CSS.

Для придания страницам сайта свойств интерактивности полезно изучить язык JavaScript.

«Блокнотом» на самом деле пользоваться не удобно. Для целей создания и редактирования web-документов используют специальные редакторы, такие как, например, Macromedia Dreamweaver и ему подобные.

Отличительные функциональные особенности статического сайта

Содержание контента неизменно до тех пор пока его не изменит разработчик (или лицо, имеющее на это право). Изменения вносятся в HTML-код страницы.
Доступно свойство интерактивности при взаимодействии человека со страницей. Оно ограничивается возможностями используемого встроенного в HTML-код страницы клиентского скрипта.

3. Динамические сайты

Здесь сложнее.

Для создания динамического сайта от веб-мастера требуется создать базу данных и обеспечить взаимодействие этих данных с применением средств программирования.

Процесс верстки сайта включает, как уже говорилось выше, создание базы данных, создание (редактирование) шаблонов, написание, (или редактирование готового) движка.

Вебмастеру придется изучать серверный язык программирования, на котором планируется создавать сайт.

Для начинающих веб-мастеров (не программистов) можно порекомендовать такой примерный порядок создания и отладки своего сайта.

В начале на своем локальном компьютере надо установить локальный сервер. Такой сервер не будет (не должен в целях безопасности) иметь выхода в интернет, но будет имитировать работу браузера как при включенном интернете (комплекс Денвер «Джентльменский набор Web-разработчика»). Затем установить движок (CMS, например платформа WORDPRESS). CMS представляет собой программный комплекс управления сайтом. Точнее, CMS служит для управления страницами, при этом под управлением страницами подразумевается добавление, редактирование и удаление страниц.

База данных должна быть создана на сервере и подключена к движку. Инструкции о том, как это делается, размещены в Интернете относительно выбранного движка. Далее начинается собственно процесс верстки сайта с применением выбранных средств программирования.

На этом этапе надо подчеркнуть такой нюанс. Если работать с WORDPRESS, то следует учесть, что каждая отдельная веб-страница создается в том виде как если бы она была написана html-кодом. Это не значит, что WORDPRESS создает html-документ. Все остается как и положено: есть шаблон, есть записи в базе данных, есть программы (php-файлы), обеспечивающие взаимодействие записей с шаблоном для формирования страницы. Просто локальный сервер обрабатывает php–код, и затем возвращает локальному браузеру html-код. Все, веб-страница сформирована.

Далее, когда сайт готов и отлажен, файлы сайта следует перенести на удаленный сервер.

Подводя итог описанию динамического сайта, можно сказать, что такой сайт это своего рода программа — один или несколько файлов, написанных на одном из серверных языков программирования. К серверным языкам относятся: ASP.NET, ColdFusion, JSP, PHP, Perl и т.п. PHP — самый популярный язык для создания веб-сайтов. Большинство хостингов поддерживают PHP.

Отличительные функциональные особенности динамического сайта

Любые задумки автора сайта, невыполнимые средствами html или клиентского скрипта, выполняются с использованием серверных скриптов (приложений).
Контент сайта изменяется пользователем посредством интерактивной связи с текущей веб-страницей. В зависимости от направленности сайта пользователь может менять контент путем размещения на сайте текстов, изображений, видео, аудио. Возможности внесения изменений ограничиваются правилами, установленными разработчиком сайта. Эти правила «зашиты» в программные файлы сайта и могут быть изменены только веб-мастером.
Html-документы могут входить в состав динамического сайта как отдельный самостоятельный компонент.

4. Общие свойства динамических и статических сайтов

Исходным кодом для браузера является html-код страницы. Гиперссылки работают одинаково как на страницах статических, так и на страницах динамических сайтов.
Внешний вид (дизайн) текущей страницы создается при помощи правил, описывающих стилевое описание каждого элемента страницы (CSS). На практике это означает, что вместе с файлами с расширением .html или .php (или другого серверного языка программирования) должен находиться файл с расширением .css. Как правило, такой файл называют style.css. Есть разные способы задания стилевого описания элементов странице, здесь указан один из возможных вариантов как наиболее применяемый.
Рекомендации автора

Первым плюсом статических страниц является меньшее по сравнению с динамическими страницами потребление ресурсов хостинга.

Вторым плюсом статических страниц относительно динамических является меньшая уязвимость.

Плюсом динамических страниц относительно статических является большая функциональность сайта.

Минусом статических страниц является возможность отключения в браузере пользователем клиентских скриптов.

По мнению автора статьи делать сайт динамическим следует в том случае, если средствами статических страниц сайт не обеспечивает всех своих необходимых функций.

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

  1. Спасибо за познавательную статью, которая рассказывает просто о том, что раньше представлялось туманным .

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *