Geum.ru

Сетевые технологии Web-дизайна

Вид материалаДокументы
Подобный материал:

Сетевые технологии Web-дизайна


Основным средством создания Web-страниц в настоящее время является язык гипертекстовой разметки HTML.

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

Специальные добавки к HTML позволяют оживить неподвижные страницы (ввести мерцание, движущийся текст, обеспечить интерактивность - возможность передачи информации не только с сервера, но и на сервер и т. д.). Такими дополнениями к языку разметки HTML являются каскадные таблицы стилей CSS, скрипты, написанные на языке " onclick="return false">
Каждое дополнение решает свою определенную задачу, расширяя возможности стандартного языка HTML. Так, таблицы стилей CSS упрощают процедуру форматирования текста, придания сайту единообразного вида.

CSS (Cascading Style Sheets - каскадные таблицы стилей) - сетевая технология, расширяющая возможности языка HTML. Каскадные таблицы стилей упрощают и ускоряют процедуру форматирования Web-страницы, позволяют представить страницы одного сайта в едином стиле. С помощью CSS несложно быстро изменить сразу на всех страницах сайта цвет шрифта, его размер, начертание, гарнитуру, величину отступа в красной строке, вид выравнивания текста и т. д. Это реализуется за счет заранее подготовленных шаблонов, которые удобно разместить в отдельном файле. Загрузка нового файла приводит к изменению внешнего вида (стиля) сразу всех страниц данного сайта.

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

Каскадные таблицы стилей позволяют без затруднений создавать любопытные эффекты, например, проплывание (парение) текста над неподвижным фоном, формирование разнообразных рамок (box), эффект объемного текста.

Для браузера MS Internet Explorer (в рамках языка DHTML) разработаны специальные программы, которые позволяют просто создать разнообразные эффекты: свечение текста, создание тени, смазывание, горизонтальное и вертикальное отражение текста, создание рельефного и гравированного изображений, инверсия цветов (цветной негатив) и др. Благодаря DHTML Web-страницы могут динамически изменяться при наступлении какого-либо события.

Программы, написанные на языке DHTML, называются DHTML-скриптами или скриплетами.

DHTML (Dinamic Hypertext Markup Language) - динамической язык разметки гипертекста. Конкурирующие фирмы Microsoft и Netscape вкладывают разный смысл в понятие "динамический HTML". Это часто приводит к тому, что одна и та же Web-страница по-разному выглядит при ее просмотре разными браузерами. По этой же причине существует некоторая путаница с определением самого понятия DHTML.

Сценарии (или скрипты) - программы, которые составляются на специальных языках программирования с целью расширения возможностей HTML. В качестве языков программирования используют " onclick="return false">
Традиционное значение слова "сценарий", которое используется в театре, кино, телевидении, - сюжетная схема событий. В Web-дизайне значение термина "сценарий" отличается от традиционного значения этого слова.

Следует выделить две принципиально различные группы сценариев (скриптов): " onclick="return false">
Скрипты первой группы размещаются прямо в тексте программы, написанной на языке HTML. Для их составления используют два языка программирования: " onclick="return false"> и .

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

Вторая группа скриптов - CGI-скрипты - организована значительно сложнее, чем первая группа скриптов. CGI-скрипты могут быть написаны на различных языках программирования (чаще всего PHP, Perl, C++). Для их работы необходимо, чтобы на сервере был установлен интерпретатор соответствующего языка программирования. Эти скрипты являются программами, исполняемыми на стороне сервера. Они должны располагаться на сервере отдельно от основного текста HTML-программы. Не все серверы допускают работу CGI-скриптов, так как существует потенциальная опасность "взлома" сервера с их помощью. Скрипты могут выполнять различные команды (в том числе и системные). Поэтому квалифицированный злоумышленник (кракер) может нарушить нормальную работу сервера. Кроме того, существует опасность неумышленного нарушения нормальной работы сервера из-за неправильно спроектированного CGI-скрипта.

Работу этой группы скриптов должен поддерживать особый интерфейс. CGI (Common Gateway Interface) - специальный интерфейс (способ взаимодействия сервера и клиента), с помощью которого происходит запуск программ, расположенных на сервере.



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

Все CGI-скрипты хранятся на сервере в специальной папке, как правило, с названием cgi-bin.

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

Альтернативой для технологии CGI является язык ASP (Active Server Pages - активные страницы на сервере). Язык ASP разработан фирмой Microsoft и предполагает использование языка VBScript и элементов ActivX, которые созданы этой же фирмой.

Еще один язык - РНР (Personal Home Page tools) по назначению аналогичен языку ASP и также является альтернативой для CGI. Разработчиком языка РНР является Rasmus Lerdorf. Программы, написанные на языке PHP, выполняются на сервере, а результаты пересылаются клиенту в виде HTML-документа. Сами программы на PHP пишутся прямо внутри HTML-документа. После обработки страницы с помощью интерпретатора PHP вид страницы существенно меняется по сравнению с документом, хранящимся на сервере. Файлы, содержащие программы на PHP, должны иметь расширение .phtml или .php3.

Важными для объяснения принципа действия скриптов являются понятия: событие, объекты и методы.

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

Объект - некоторый элемент с набором собственных свойств и методов (например, открытое окно).

Свойство - параметр объекта, который может быть изменен или считан (например, ширина окна).

Метод - функция, показывающая, какие действия производятся над объектом (например, закрыть окно).

Апплеты (applets) - программы, которые составляются на языке Java и хранятся на сервере отдельно от основного документа, написанного на языке HTML. В переводе с английского языка слово applet означает небольшое приложение. Таким образом, апплет (иногда пишут аплет) - это маленькое приложение (программа на языке Java), служащее для создания разнообразных визуальных эффектов на основной Web-странице. Можно заметить некоторое сходство Java-апплетов с CGI-скриптами (и те, и другие хранятся отдельно от основного HTML-документа). Самое существенное их различие состоит в том, что Java-апплеты не позволяют сохранять на сервере информацию, подготовленную пользователем-клиентом. По своему внешнему проявлению Java-апплеты похожи на сценарии, написанные на языке " onclick="return false">
Вызываются апплеты из основного документа, написанного на языке HTML. В результате вызова апплеты считываются (скачиваются) с сервера и после проверки на корректность исполняются на компьютере-клиенте. При этом в браузере должны быть установлены соответствующие опции, разрешающие обработку Java-апплетов. В противном случае апплеты будут проигнорированы.

Достоинством языка Java является его независимость от используемой операционной системы и платформы (аппаратной части), на которой реализована ЭВМ. На этом языке можно создавать приложения, способные работать на компьютерах самых разных типов: Pentium, Macintosh, рабочих станциях Sun. Это достигается установкой на каждую ЭВМ виртуальной Java-машины (Java Virtual Machine - программный эмулятор). Эмулятор - это специальная программа, преобразующая инструкции для виртуальной машины (или байт-коды) в инструкции для конкретного процессора. Независимость языка Java от платформы (типа процессора и операционной системы) является одним из основных достоинств этого языка.

Технология создания и использования Java-апплетов следующая. Программист составляет программу на языке Java. Затем компилирует ее, превращая текст программы в байт-коды. Откомпилированная программа размещается на сервере в виде файлов Java-классов (с расширением .class). Вызываются апплеты из HTML-документа с помощью опций, которые обрамляются дескрипторами codebase=. codebase=. codebase=. и . Между этими тегами указываются параметры, с которыми осуществляется запуск апплета.

Рассмотрим еще одну полезную сетевую технологию Web-дизайна - SSI.

SSI (Server Side Include) с английского языка переводится так: включаемый на стороне сервера. Здесь имеется ввиду, что технология SSI позволяет добавлять в текст страницы дополнительные фрагменты, которые хранятся на сервере в отдельных файлах. При рассмотрении технологии SSI слышны "знакомые мотивы", которые звучали при рассмотрении предыдущих технологий (CGI-скриты и Java-апплеты). Отличительной особенностью технологии SSI является то, что и основной текст Web-страницы, и добавляемый блок написаны на одном языке программирования - HTML. Технологию SSI можно образно сравнить с конструированием игрушечных зданий из кубиков. Только здесь речь идет о проектировании сайта из заранее подготовленных фрагментов Web-страниц. Причем одни и те же кубики (блоки, файлы) можно вставлять на различные страницы сайта. Легко изменить внешний вид одинаковых элементов сразу на всех страницах сайта (скажем, вид элементов навигации или текст электронного адреса). Включение (добавление) дополнительных блоков происходит непосредственно при передаче текста Web-страницы от сервера к клиенту. По этой причине коды добавляемых блоков нельзя увидеть при просмотре страниц в виде HTML. Изменив всего лишь один файл, дизайнер меняет внешний вид сразу всех страниц сайта. Таким образом, технология SSI позволяет легко "собирать", "конструировать" сайт, используя заранее созданные заготовки (блоки).

Web-страница, на которую производится вставка дополнительного блока, должна иметь расширение shtml (или shtm). Добавляемый файл в принципе может иметь любое расширение. Синтаксис вызова присоединяемого блока таков:

Здесь navig.htm - имя добавляемого файла.

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

Краткие итоги

  • Большинство Web-страниц построено на основе языка разметки HTML. Возможности этого языка расширяют за счет использования технологий, работающих как на стороне клиента, так и на стороне сервера.
  • На стороне клиента реализуются технологии: CSS, DHTML, Flash, AVI, MPEG, " onclick="return false">
  • На стороне сервера работают технологии: CGI, ASP, SSI, ColdFusion, PHP, Perl, Java