rss vk ok facebook twitter

Тема 2. Статический или динамический сайт?

Предлагаю вашему вниманию вторую статью из серии о создании сайтов для начинающих. Моя первая статья из этой серии была посвящена основам сайтостроения, а в этом посте речь пойдет о разнице между статическим и динамическим сайтом. Надеюсь, статья поможет вам определиться, какой проект (возможно самый первый) интереснее создавать с целью отработки навыков — статический или динамический сайт?

Когда у вас на сайте всего 10-20 страниц, объединенных одной index.html страницей с меню в шапке, то проблема не стоит так, как если бы вы хотели управлять более содержательным сайтом. Например, сайт с относительно большим количеством страниц рано или поздно нужно будет редактировать: создать/модифицировать/удалить страницу или пункт меню, заполнить уникальные для каждой страницы метатеги, что будет достаточно сложно если ваш сайт – не динамический! Далее разберемся в понятиях, что такое статический, а что такое динамический сайт?

Особенности статического сайта

статический или динамический сайт

Статический сайт, это когда контент не генерируется управляющим скриптом, а изменения как в программном коде, так и в контентном содержимом — придется вносить на каждую страницу. То-есть каждая страница вашего сайта — это полная копия всей разметки дизайна, в которой изменяется только блок с контентом или метатегами. Есть варианты, как упростить редактирование такого сайта: использовать разметку через фреймы или серверные вставки SSI, но это полумера и попросту устаревший прием. Теперь дизайн (графическое оформление всего сайта). Предположим вы решили изменить один элемент дизайна сайта, изменения опять придется вносить на каждую страницу. Первое, что приходит в голову начинающему сайтостроителю — это побыстрее создать «готовый сайт» на тех технологиях, которые ему доступны в данный момент. Но практика показывает, что вам постоянно будет требоваться вносить изменения, как в дизайн, так и в содержимое вашего веб-ресурса. Поэтому не стоит останавливаться на не гибких решениях при создании сайта, не стоит превращать работу с сайтом в рутинную переделку кода на всех страницах поочередно.


resume penguin

Тут следует пояснить процесс генерации сайта исполненного на подобной технологии. Дело в том, что HTML – это просто разметка страницы посредством расстановки тегов, CSS – это надстройка, позволяющая разнообразить внешний облик страницы, сюда включено все то, чего нет в HTML, или есть, но правильнее реализовать это через каскадные таблицы стилей (CSS). Когда вы создадите подобную страницу и откроете ее в веб-браузере, сам браузер сгенерирует ваш сайт. Отмечу, что ни HTML, ни CSS — не являются языками программирования!


Для реализации динамических элементов страниц или элементарной шаблонизации — потребуется PHP (как вариант), или готовая система управления контентом на базе PHP.

Что такое динамический сайт?

динамический или статический сайт

Вы наверняка встречали в Интернете утверждения о необходимости отделять логику от представления в программном коде. Это целая методика при проектировании и создании сайта, но суть ее в том, чтобы отображаемый в браузере сайт незаметно для пользователя генерировался управляющим скриптом (его еще называют «движок сайта»). Цель — проста: «вилки с вилками», «ложки с ложками», «ножи с ножами», «тарелки с тарелками», все это потом собирается в одно целое и мы получаем в браузере «блюдо» под названием — динамически сгенерированный сайт.

Приведу условный пример с условной последовательностью действий: дизайн сайта создается в графических редакторах, потом верстается HTML страница, в которую добавляется вызов каких-либо функций (создается шаблон для движка сайта), которые в свою очередь вынесены в отдельный файл и все это выводится в браузере — мы видим сайт! В данном примере функции могут быть стандартными, например, include() в языке PHP, или специфическими, часто уникальными для конкретного движка (CMS, фреймворк). Чтобы понять эти процессы вам не помешает немного теории программирования.

Немного из основ программирования

Предположим, что у нас есть программа написанная на определенном компилируемом языке программирования (например Си). Программный код, написанный в соответствии с синтаксисом языка, хранится в файле xxx.c, но результат работы программы мы получаем только после компиляции данного исходника и запуска получившегося в результате файла (этот файл исполняется операционной системой). Сам это процесс трансляции и компиляции – достаточно сложный и описывать его как процедуру я не буду. Но помимо компилируемых языков программирования, которые не могут показать результат работы приложения без установленного в системе компилятора (специальной программы), есть – интерпретируемые языки программирования (есть и гибридные варианты, но сейчас не об этом). Этим языкам, а вернее программам составленным на их основе, для выполнения результата требуется интерпретатор. Например программа (под этим словом можно и подразумевать пару строчек в коде сайта) составленная на языке программирования JavaScript в качестве интерпретатора использует ваш браузер! То-есть то, что хотел получить программист на выходе – исполняет сам браузер. Страница с кодом –> открываем в браузере –> получаем результат. Да, именно так, как и HTML с CSS, но в отличии от них JavaScript – это язык программирования со всеми вытекающими. JavaScript – это не компилируемый (скриптовый) язык программирования исполняемый на стороне клиента. При создании динамических сайтов часто используют язык PHP – тоже интерпретируемый и не смотря на то, что вывод результата мы получим в браузере, сама программа обрабатывается на стороне сервера.


resume professor

Теперь вы, наверное, догадываетесь почему многие программисты в своем общении на форумах в понятие дизайн включают: графику, HTML, CSS и даже JavaScript, то-есть не только графику как таковую но и верстку. Потому что все эти технологии могут функционировать только за счет браузера пользователя, который загрузил ваш сайт, и служат в основном для построения «каркаса» сайта (шаблона, дизайна, темы оформления).


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

К этой статье добавлено 4 комментариев

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

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