Основные понятия Web-дизайна

Размещено на http://www.allbest.ru/

Основные понятия Web-дизайна

Термин Web-дизайн состоит из двух частей. Первая часть - Web - это сокращенное написание слов World Wide Web - Всемирная паутина. Вторая часть термина - слово "дизайн" - происходит от английского слова design, что означает проектировать, конструировать, планировать, чертить, создавать рисунок. Таким образом, предварительный перевод слова Web-дизайн с английского языка на русский язык может быть таким - "проектирование для Интернета".

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

Изобразительными средствами дизайна являются точка, линия, фактура, текстура, цвет, форма, пропорция. Понятия точки и линии знакомы еще со школы. Кратко рассмотрим остальные термины.

Текстура - это характер поверхности какого-либо объекта, обусловленный его внутренним строением, структурой, объективными физическими свойствами (дерево, металл, стекло, ткань).

Фактура - это внешние свойства поверхности объекта (гладкая, шероховатая). Фактура характеризует качество обработки поверхности объекта.

Форма - это внешнее очертание, наружный вид, форма объекта.

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

Пропорция - это связь составляющих внутри сложного целого. Различают следующие виды пропорций: арифметическую, геометрическую, гармоническую. Самой известной в дизайне пропорцией является золотое сечение. Эту пропорцию характеризует прямоугольника со сторонами a и b, между которыми используется следующее соотношение: b/a = a/ (a+b), то есть b = 0,618a.

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

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

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

Асимметрии - произвольное расположение изображаемых объектов, при котором правая и левая половины художественного произведения становятся неуравновешенными.

Равновесие - состояние, при котором все элементы сбалансированы между собой. Равновесие вызывает ощущение покоя и уверенности.

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

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

Кроме перечисленных терминов в web-дизайне используются еще следующие понятия.

Гармония - соразмерность всех частей целого.

Контраст - резкое различие элементов композиции.

Колорит - гармоничное сочетание, взаимосвязь, объединение различных цветов.

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

Теперь перейдем к понятию web-дизайн.

Web-дизайн - это новый жанр изобразительного искусства, основанный на применении специфических инструментов (HTML, JavaScript, Java, Perl, C++, PHP, etc) и сетевых технологий (CGI, CSS, SSI).

Целью web-дизайна является проектирование объектов (web-страниц, баннеров, апплетов, скриптов, отдельных элементов web-страниц).

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

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

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

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

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

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

Проектирование страниц или сайтов осложняется еще и тем обстоятельством, что одна и та же страница отображается по-разному разными браузерами (Internet Explorer, Netscape Navigator, Opera) и в окнах разного размера. Во многих случаях браузер самостоятельно "решает" как будет выглядеть загружаемая страница. Изменить внешний вид страницы может и пользователь, например, путем отключения опции загрузки рисунков, анимации.

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

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

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

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

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

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

Перечислим некоторые важные рекомендации по созданию Web-сайта. Целесообразно не перегружать страницу большим числом деталей. Это связано с тем, что человек за короткое время способен воспринять и запомнить не более 7-8 объектов.

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

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

На последней стадии проектирования сайта целесообразно проверить работоспособность всех сделанных гиперссылок. Завершая проектирование сайта, желательно просмотреть его с помощью различных браузеров (MS Internet Explorer, Netscape Navigator, Opera).

Кратко рассмотрим вопрос оценки допустимого объема Web-страницы. В современном динамичном мире каждому человеку нужно успеть многое сделать. Поэтому люди экономят каждое мгновение дарованной им жизни. Пользователи, путешествующие по сети, "проскакивают" мимо тех Web-страниц, которые недопустимо долго загружаются на их компьютеры. По этой причине при проектировании сайта дизайнеру необходимо уметь заранее оценить примерное время загрузки и допустимый объем создаваемой ими страницы. Считая, что предельно допустимое время ожидания загрузки Web-страницы составляет 30-40 секунд, а средняя скорость поступления информации по коммутируемому каналу - 10-20 Кбит/с, получаем желательный объем проектируемой Web-страницы - 300-800 Кбит, т. е. 37,5-100 Кбайт. Естественно, что при использовании выделенного канала скорость загрузки, как правило, возрастает в 3-4 раза, и поэтому допустимый объем страницы в перспективе может быть увеличен.

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

Web-дизайн - новый жанр изобразительного искусства, использующий собственные средства, закономерности и приемы.

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

Структура Web-страницы

Документы, составленные с помощью языка HTML, имеют определенную стандартизированную структуру (см. следующий рисунок).

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

Заметим, что некотрые HTML-редакторы самой первой строкой страницы автоматически вставляют идентификатор (указатель) используемой версии языка HTML. Например, виртуальный поисковый сайт

<!DOCTYPE HTML PUBLIC "'-//W3C//DTD HTML 4.01 Transitional//EN">

Такую строку порой называют прологом.

Между тегами <head > и </head> помещаются сведения о названии данной страницы и служебная информация (используемая кодировка, ключевые слова, название редактора, с помощью которого сделана страничка). Для примера название этой Web-страницы выбрано "Пробная страница". Название страницы окаймлено тегами <title> и </title>. Следует иметь в виду то, что текст, размещенный между этими тегами, не отображается в окне браузера. Название страницы появляется в строке заголовка браузера при просмотре данной страницы, а также в названиях избранных закладок Между тeгами <head> и </head> размещается служебная информация. Для этого используются метатеги.

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

Содержимое страницы, воссоздаваемое на экране монитора (основная часть, тело), располагается между тегами <body> и </body>. В данном случае (см. рисунок) пользователи на экранах своих мониторов увидят всего два слова: "Проба", причем второе слово будет изображено полужирным шрифтом. Кроме того, на рисунке видны теги <р> и </р>, каждая пара которых выделяет новый абзац в документе.

Заметим, что исключением из этого правила является порядок создания фреймов. В этих случаях вместо тега body используется тег frameset.

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

Увидеть, как выглядит HTML-код конкретной Web-страницы, довольно просто. Для этого достаточно в браузере MS Internet Explorer 6 0 последовательно выполнить команды: Вид -> Просмотр HTML-кода.

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

В структуре HTML-страницы нужно выделять три крупных блока: один блок с помощью тегов <html> и </html> показывает границы всего документа.

Теги <head > и </head> выделяют второй блок со служебной информацией.

В контейнере, созданном тегами <body> и </body> (третий блок), содержится информация, отображаемая в окне браузера.

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

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

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

Специальные добавки к HTML позволяют оживить неподвижные страницы (ввести мерцание, движущийся текст, обеспечить интерактивность - возможность передачи информации не только с сервера, но и на сервер и т. д.). Такими дополнениями к языку разметки HTML являются каскадные таблицы стилей CSS, скрипты, написанные на языке JavaScript или VBScript, апплеты, составленные на языке Java, CGI-скрипты - программы, для создания которых применяют языки Perl, C++, скриплеты, написанные на языке DHTML. Для создания движущихся надписей и рисунков используют GIF-и Flash-анимацию. Технологии AVI и MPEG позволяют вставлять видеоклипы. Имеются средства для озвучивания Web-страниц с помощью аудио-клипов, созданных в форматах WAV, MP3 и MIDI.

Каждое дополнение решает свою определенную задачу, расширяя возможности стандартного языка 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. В качестве языков программирования используют JavaScript, VBScript. Java. Perl, C++ и др. Сценарии позволяют обрабатывать (peaгировать на) различные события (например, щелчок мышью, размещение курсора мыши на некотором объекте, нажатие клавиши). Ответной реакцией на произошедшие события становится изменение внешнего вида Web-страницы, пересылка данных от клиента на сервер и др. Слово Script в переиоле с английского языка означает "сценарий". Термины "скрипт" и "сценарий", которые используются в публикациях по Web-дизайну, являются синонимами.

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

Следует выделить две принципиально различные группы сценариев (скриптов): JavaScript (VBSript) и CGI-скрипты.

Скрипты первой группы размещаются прямо в тексте программы, написанной на языке HTML. Для их составления используют два языка программирования: JavaScript и VBScript. Язык JavaScript поддерживается всеми современными браузерами. Скрипты, написанные на языке VBScript, работают только на браузерах MS Internet Explorer. Скрипты обрабатываются (интерпретируются) браузером одновременно с кодом HTML. В HTML-программах скрипты размещаются внутри контейнеров, которые обрамлены тегами <script> и </script>.

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

Вторая группа скриптов - 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, которые созданы этой же фирмой.

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

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

Событие - это сигнал, по которому выполняется программа, заранее подготовленная программистом.

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

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

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

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

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

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

Технология создания и использования Java-апплетов следующая. Программист составляет программу на языке Java

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

Рассмотрим еще одну полезную сетевую технологию 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, JavaScript, VBScript, ActiveX. На стороне сервера работают технологии: CGI, ASP, SSI, ColdFusion, PHP, Perl, Java.

Размещено на Allbest.ru