Что такое статическая страница. Статические и динамические веб страницы

30.10.2019 Разное

Теперь, после подробного рассмотрения запроса/ответа HTTP , обратим внимание на различные типы контента (любое содержательно-значимое наполнение информационного ресурса), который вы ожидаете увидеть в Интернет . Я разделил его на четыре типа - простой текст, стандарты Web , динамические Web -страницы, и форматы, требующие других приложений или подключаемых модулей (плагинов).

Простой текст

В самом начале, до появления каких-либо стандартов Web или плагинов, Интернет состоял в основном из изображений и простого текста - файлов с расширением .txt или похожим на него. Когда файл с простым текстом встречается в Интернет, браузер просто выводит его как есть, без какой-либо дополнительной обработки. Файлы с простым текстом все еще можно часто встретить на сайтах университетов.

Стандарты Web

Базовыми строительными блоками Всемирной паутины WWW являются три основных стандарта Web - HTML (или XHTML, эти два понятия будут использоваться здесь взаимозаменяемо для наших целей), CSS и JavaScript.

Язык разметки гипертекста (HTML) является в действительности довольно удачным названием, так как хорошо передает его назначение. HTML используется для разбиения документа, определения его содержания и структуры, и определения значения каждой части (того, что содержит весь текст и т.д., что мы видим на страницах Web ). Он использует специальные элементы для определения на странице различных компонентов.

Каскадные таблицы стилей (CSS) предоставляют полный контроль над тем, как выводится элемент. Очень легко, используя объявления стилей, вывести все параграфы через две строки (line-height: 2em; ), или сделать все заголовки второго уровня зеленого цвета (color: green; ). Существует множество преимуществ разделения структуры и форматирования, и мы рассмотрим это более подробно в следующей лекции. Чтобы продемонстрировать мощь совместного использования HTML и CSS, рисунок 3.2 показывает простой код HTML слева, вообще без дополнительного форматирования, а справа можно видеть тот же самый код HTML с добавленными к нему стилями CSS.

Наконец, язык JavaScript предоставляет Web -сайту динамические функции. Можно писать небольшие программы на JavaScript, которые будут выполняться на клиентском компьютере, не требуя установки на сервере какого-либо специального программного обеспечения. JavaScript позволяет добавить на Web -сайт некоторые базовые функции и интерактивность, но он имеет свои ограничения, что ведет нас к серверным языкам программирования и динамическим Web страницам.

Динамические страницы Web

Иногда при просмотре Интернет можно встретить страницы Web , которые не используют расширение .html - они могут иметь расширение .php , .asp , .aspx , .jsp , или какое-нибудь другое странное расширение. Все это примеры динамических технологий Web , которые могут использоваться для создания страниц Web , имеющих динамические разделы - код, который выводит различные результаты из базы данных или другого источника данных в зависимости от определяемых для него значений. Мы рассмотрим страницы Web этого типа ниже в разделе "Сравнение статических и динамических Web -сайтов".

Форматы других приложений или подключаемых модулей (плагинов)

Так как браузеры Web могут только интерпретировать и выводить определенные технологии, такие как стандарты Web , то при запросе адреса URL, который указывает либо на сложный формат файла, либо на страницу Web , содержащую технологию, которая требует подключаемого модуля (плагина), файл будет либо загружен на компьютер, либо открыт с помощью требуемого плагина, если он установлен в браузере. Например:

  1. Если вы встретите документ Word, файл Excel, PDF, сжатый файл (ZIP, или SIT, например), сложный файл изображения, такой как Photoshop PSD, или другой сложный файл, который браузер не понимает, браузер обычно спрашивает, хотите ли вы загрузить или открыть этот файл. Оба действия обычно имеют аналогичные результаты, за исключением того, что во втором случае файл будет загружен в компьютер и затем открыт приложением, которое его понимает, если такое приложение установлено на компьютере.
  2. Если вы встретите страницу, содержащую фильм Flash, MP3 или другой музыкальный формат, MPEG или другой формат видео, то браузер будет воспроизводить его с помощью установленного плагина, если такой плагин был установлен. Если плагина нет, то либо будет выведена ссылка для установки требуемого плагина, либо файл будет загружен и будет сделана попытка найти на компьютере приложения для его выполнения.

Конечно, имеется некоторая серая область - например формат SVG (Масштабируемая векторная графика) является стандартом Web , который реализован в некоторых браузерах, таких как Opera, но не реализован в других, таких как Internet Explorer - IE требуется плагин для понимания SVG. Ряд браузеров поставляется с некоторыми предустановленными плагинами, поэтому вы можете не знать, что некоторый контент выводится через плагин, а не естественным образом в браузере.

Сравнение статических и динамических Web-сайтов

Итак, что же такое статические и динамические Web -сайты, и в чем между ними различие? Очевидно, что все зависит от начинки.

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

На динамическом Web -сайте, с другой стороны, контент сервера будет таким же, но кроме обычного кода HTML он содержит также динамический код, который может выводить различные данные, в зависимости от информации, которая передается на Web - сайт . Давайте посмотрим на пример - перейдите в своем браузере на сайт http://www.amazon.com , и выберите 5 различных продуктов. Сайт Amazon не посылает вам просто 5 различных страниц, он пришлет одну и ту же страницу 5 раз, но с различной динамически заполняемой каждый раз информацией. Эта различная информация хранится в базе данных, которая извлекает при запросе требуемую информацию и предоставляет ее серверу Web для включения в динамическую страницу.

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

Существует множество динамических языков программирования - уже был упомянут PHP , а другими примерами являются Python , Ruby on Rails, ASP . NET и Coldfusion. В конечном счете, все эти языки имеют по большей части одинаковые возможности, такие как общение с базами данных, проверка вводимой в формы информации и т.д., но они делают все это немного по разному, и имеют некоторые достоинства и недостатки. Все сводится к тому, что вам лучше всего подходит.

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

  • Rails: Fernandez, Obie. (2007), The Rails Way. Addison-Wesley Professional Ruby Series.
  • Демонстрационные ролики для Rails (http://www.rubyonrails.org/screencasts)
  • PHP: Powers, David (2006), PHP Solutions: Dynamic web development made easy, friends of ED.
  • Сетевая документация по PHP (http://www.php.net/docs.php)
  • ASP.NET: Lorenz, Patrick. (2003). ASP.NET 2.0 Revealed. Apress.
  • ASP.NET: сетевая документация и руководства по ASP.NET (

Дата: 2012-03-16

Статический и Динамический сайты, в чем разница?

В этой статье мы поговорим о принципиальных различиях двух видов сайтов: Статическом и Динамическом . Чем вызвана эта тема? Довольно часто, получая письма от посетителей своего сайта и от читателей почтовых рассылок я вижу, что у многих особенно начинающих «сайтостроителей» бытует мнение, что Динамический сайт – это когда все на сайте мелькает, бегает, движется и т.д.

Например, совсем недавно с одним товарищем довольно долгое время вел переписку на эту тему. Опуская подробности вкратце обозначу позицию своего собеседника. Цитирую: «... у меня на сайте (опускаю URL сайта) 14 движущихся картинок и баннеров и 11 скриптов, обеспечивающих различные визуальные эффекты. Поэтому считаю свой сайт динамическим ».

Конечно же я сильно сократил и немного утрировал диалог со своим собеседником, оставив самую суть дискуссии, но увы многие считают, что достаточно «повесить» на сайте несколько анимированных баннеров и любой сайт тут же превращается в Динамический. Т.е. когда все, мелькает и движется на сайте – это и есть ДИНАМИКА, ДВИЖЕНИЕ.

Если Вы тоже так считает, то сейчас я Вас огорчу и растрою. На самом деле это не так. Динамическим сайт становится совсем не по этим признакам. Чтобы лучше понять принципиальные отличия, давайте вспомним немного теории.

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

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

Как правило все Статические сайты имеют не очень большое количество страниц (примерно до 50 отдельных web-страниц). Это могут быть сайты небольших компаний или частных лиц не очень часто обновляемые, как правило это так называемые Сайты-Визитки. Почему?

Если у Вас уже есть свой сайт, то Вы наверняка уже знаете, что управлять сайтом с большим количеством страниц, разделов и рубрик довольно проблематично и долго. Представьте себе сколько уйдет времени, чтобы обновить всего одну ссылку в меню сайта например на 20 – 30 страницах... А если больше? Ведь нужно отредактировать каждую из web-страниц сайта, затем все это обновить на сервере, а это ВРЕМЯ. Очень много времени!

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

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

Но человеческая мысль не стоит на месте, и для того, чтобы избежать рутины по обслуживанию и обновлению сайтов были написаны различные CMS (системы управления контентом) на различных языках программирования. Одним из самых удачных языков программирования для «сайтостроения» оказался .

При написании кода web-страниц, в HTML код с помощью специальных операторов, подгружаются вставки кода PHP. Поэтому HTML всегда является основой, на которую как бы наращивают элементы программирования. Любая HTML-страничка с легкостью может стать PHP страницей, достаточно просто переименовать файл, при этом изменив расширение с . html на . php .

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

С появлением PHP стало возможным разбивать web-страницу на отдельные блоки и элементы. Например, однотипные блоки сайта, такие как: Шапка сайта (Header ), Подвал сайта (Footer ), Меню (а иногда и несколько меню) и другие блоки можно вынести в отдельные файлы.

Действительно, если на сайте есть однотипные и постоянные блоки (Шапка, Подвал, Меню и т.д.), которые очень редко изменяются, есть смысл вынести в отдельный файл и просто подгружать ко всем страницам сайта. При необходимости что-то исправить, изменения вносятся в один единственный файл. А затем этот файл подгружается ко всем страницам сайта.

Управление сайтом очень сильно упростилось, и теперь стало неважно сколько страниц на сайте (10 или 1000), добавил в Меню новую ссылку, и эта ссылка появилась в Меню всех страниц сайта.

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

Большинство CMS предоставляют администратору сайта визуальный графический редактор, с помощью которого можно как в WORDe редактировать свои материалы на сайте. Так появилась разновидность сайта: блоги.

Хотя на мой взгляд этого такого сильного упрощения не нужно было делать. Чтобы научиться читать, для начала нужно выучить буквы.... Ну да ладно, будем исходить из того, что есть....

Теперь сайт стало возможным собирать как бы по кусочкам из отдельных файлов. Типовые названия таких файлов: header . php (шапка), footer . php (подвал), menu.php (меню), content.php (основное содержание web-страницы). Название это условные, и файлам Вы можете даль любые имена. Схематически это выглядит примерно так:

Скелетная схема php-страницы.

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

Кроме того, сайты написанные на PHP получили множество дополнительных возможностей: полезную информацию выносят в отдельный файл, например content.php (статьи, уроки, заметки, описания товаров и услуг), эту часть информации стало возможным хранить в базе данных, что дает нам множество дополнительных возможностей: уменьшается общий вес страницы, появилась возможность вести подсчет загрузок страницы, добавлять комментарии, персонализация страниц, авторизация, доступ к закрытым разделам и т.д. и т.п. Появилась возможность использовать множество готовых PHP Скриптов.

Но главное помните, что вся обработка php-кода происходит на сервере, иногда говорят: «страница обрабатывается на лету». Каждая web-страница собирается как конструктор, из отдельных кусочков (файликов). Причем этот кусочек может и еще дополнительно отдельно обрабатываться. Вот это и есть основные признаки всех Динамических сайтов.

В тоже время никто не запрещает Вам использовать на Динамических сайтах анимированные баннеры и традиционные скрипты.

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

Всего Вам доброго.

Читайте так же другие наши материалы:


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

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

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

Книга:

Понятие статической и динамической веб-страницы

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

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

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

ПРИМЕЧАНИЕ

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

Принципиальное отличие динамической веб-страницы от статической состоит в том, что ее содержимое является не постоянным, а может изменяться. Оно формируется в зависимости от пожеланий пользователя, а точнее – на основании запросов, созданных посетителям и отправленным на веб-сервер. Как мы уже отмечали ранее, наиболее типичный пример динамической веб-страницы – это страница с результатами поиска, выданными поисковой системой (тем же www.google.ru) на основании отправленного пользователем поискового запроса. Еще один характерный пример использования веб-страниц – интернет-магазины: посетитель с помощью опций указывает, какой товар и с какими свойствами его интересует, отправляет запрос (для этого обычно предназначена соответствующая кнопка – , и т.п.), и через пару секунд получает на экран перечень товаров, соответствующих установленным критериям. Помимо этого, динамические страницы имеют широчайшее применение и в других сайтах, самого разного назначения и направленности.

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

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

Смешение дизайна (оформления содержимого) и контента (смысловое содержимое)

Язык HTML (HyperText Markup Language) на сегодняшний день, являющийся общепринятым стандартом разметки гипертекста, предназначен именно для представления внешнего вида страницы. В то время как страницы статических сайтов существуют непосредственно в виде HTML-страниц, и почти всегда кроме информационной части, ради которой пользователь и посещает сайт, содержат некое «служебное обрамление» - шапку и подвал, навигационное меню, какие-то дополнительные текстовые блоки, баннеры, ссылки быстрого доступа к основным разделам сайта и т.п. Поэтому на таких страницах, которые отображают конкретные документы, очень часто контент и дизайн (как страницы в целом, так и отдельных его элементов) идут вперемешку. Отсюда имеем массу негативных последствий, возникающих при публикации новых документов или редактировании уже существующих, - они все должны оформляться единообразно. И если возникает необходимость поменять местами какие-то функциональные блоки сайта, или добавить новый пункт в общее меню – то редактировать придётся все существующие страницы.

Теперь, после подробного рассмотрения запроса/ответа HTTP , обратим внимание на различные типы контента (любое содержательно-значимое наполнение информационного ресурса), который вы ожидаете увидеть в Интернет. Я разделил его на четыре типа - простой текст, стандарты Web , динамические Web -страницы, и форматы, требующие других приложений или подключаемых модулей (плагинов).

Простой текст

В самом начале, до появления каких-либо стандартов Web или плагинов, Интернет состоял в основном из изображений и простого текста - файлов с расширением.txt или похожим на него. Когда файл с простым текстом встречается в Интернет, браузер просто выводит его как есть, без какой-либо дополнительной обработки. Файлы с простым текстом все еще можно часто встретить на сайтах университетов.

Стандарты Web

Базовыми строительными блоками Всемирной паутины WWW являются три основных стандарта Web - HTML (или XHTML, эти два понятия будут использоваться здесь взаимозаменяемо для наших целей), CSS и JavaScript.

Язык разметки гипертекста (HTML) является в действительности довольно удачным названием, так как хорошо передает его назначение. HTML используется для разбиения документа, определения его содержания и структуры, и определения значения каждой части (того, что содержит весь текст и т.д., что мы видим на страницах Web ). Он использует специальные элементы для определения на странице различных компонентов.

Каскадные таблицы стилей (CSS) предоставляют полный контроль над тем, как выводится элемент. Очень легко, используя объявления стилей, вывести все параграфы через две строки (line-height: 2em;), или сделать все заголовки второго уровня зеленого цвета (color: green;). Существует множество преимуществ разделения структуры и форматирования, и мы рассмотрим это более подробно в следующей лекции. Чтобы продемонстрировать мощь совместного использования HTML и CSS, рисунок 3.2 показывает простой код HTML слева, вообще без дополнительного форматирования, а справа можно видеть тот же самый код HTML с добавленными к нему стилями CSS.

Рис. 3.2. Простой HTML слева, HTML с использованием CSS справа

Наконец, язык JavaScript предоставляет Web -сайту динамические функции. Можно писать небольшие программы на JavaScript, которые будут выполняться на клиентском компьютере, не требуя установки на сервере какого-либо специального программного обеспечения. JavaScript позволяет добавить на Web -сайт некоторые базовые функции и интерактивность, но он имеет свои ограничения, что ведет нас к серверным языкам программирования и динамическим Web страницам.

Динамические страницы Web

Иногда при просмотре Интернет можно встретить страницы Web , которые не используют расширение.html - они могут иметь расширение.php, .asp, .aspx, .jsp, или какое-нибудь другое странное расширение. Все это примеры динамических технологий Web , которые могут использоваться для создания страниц Web , имеющих динамические разделы - код, который выводит различные результаты из базы данных или другого источника данных в зависимости от определяемых для него значений. Мы рассмотрим страницы Web этого типа ниже в разделе "Сравнение статических и динамических Web -сайтов".