Средства разработки Web-документов

8.3. СРЕДСТВА РАЗРАБОТКИ WEB-ДОКУМЕНТОВ

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

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

Для Web-узлов первого поколения была характерна однотипная структура -обычный сайт состоял из одной линейной страницы, представлявшей собой последовательность текста и «картинок». При этом графические элементы создавались с помощью обычных графических редакторов, ориентированных на жесткие требо­вания издательского дела; вследствие этого изображения получались очень высо­кого качества, но были весьма требовательны к имеющимся вычислительным ре­сурсам. Странички писали на «чистом» HTML с использованием простейших редакторов, так как текстовые процессоры с их внутренними форматами докумен­тов не годились для Интернета, главными требованиями которого были и остаются компактность и переносимость на другие платформы. Вот когда был пик популяр­ности редактора Notepad (Блокнот), входящего в набор стандартных приложений MS Windows. Некоторые «спецы» и сейчас нет-нет, да и заявят, что профессионалы должны работать только в нем. Такое пуританство, конечно, может вызвать уваже­ние (как храм, построенный без единого гвоздя, да еще и одним только топором), но с точки зрения производительности труда и доступности для широких масс не вы­держивает никакой критики.

Страницы узлов второго поколения уже содержали интерактивные элементы, обеспечивавшие более активное участие пользователя в формировании облика про­сматриваемого Web-документа. Простейшими из таких элементов были ссылки с контактными почтовыми адресами, обеспечивавшими вызов программы электрон­ной почты. Чуть позже появились страницы, которые генерировались сценариями, выполнявшимися по запросам пользователей. Такие изменения стали возможны благодаря расширениям HTML и его совместного использования с другими техно­логиями (PERL, CGI и т.п.). Тем не менее основными инструментами создания страниц по-прежнему оставались текстовые редакторы. В результате сайты второго поколения были так же трудно управляемы, как и их предшественники, и так же ненадежны. Заслугой этого поколения узлов явилось то, что они продемонстриро­вали практически безграничные возможности языков разметки — HML и XML (extensible Marcup Language) - в формировании облика Web-страниц. Нужны были инструменты, которые позволили бы свести к минимуму ручной труд и тем самым превратить Web-дизайн в разновидность народного творчества.

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

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

2. Степень автоматизации процесса разработки и использования технологии WYSIWYG.

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

Рекомендуемые материалы

Первый вариант классификации подразумевает разделение средств разработ­ки по признаку целевой направленности. Основными группами в этой классифи­кации являются:

• Узко специализированные программы (утилиты), ориентированные на реализа­цию отдельных элементов web-документов. Предназначены для генерации специфич­ных частей страниц (списков, таблиц, фреймов, форм и т.п.) или механизмов (счетчи­ков, гостевых книг). Многие утилиты обеспечивают реализацию интерфейсных элементов, которые затем легко встраиваются в HTML-страницы. Часто так реализу­ют кнопки, сенсорные карты, анимационную графику Достаточно большая группа ути­лит предназначена для конвертирования файлов различных типов в HTML-текст.

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

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

По уровню наглядности средства разработки можно разделить на три категории:

• не обеспечивающие никаких средств визуализации результатов разработки и требующие просмотра разрабатываемых страниц во внешнем броузере (Notepad);

• обеспечивающие автоматическое форматирование и «подсветку» синтаксиса HTML-текста, а также предоставляющие возможность просмотра результата разработки (в ходе ее выполнения) собственными средствами (HotDog, Arachnofilia, HomeSite);

• визуальные редакторы, обеспечивающие работу в режиме WYSIWYG, которые не требуют просмотра во внешнем броузере, а иногда даже не предусматривают работу с «чистым» HTML-текстом (Netscape Composer, MS Frontpage, Macromedia Dreaniweaver).

Широта охвата Интернет-технологий — характеристика достаточно условная. Самые сложные и продвинутые технологии теоретически могут быть реализованы и в Notepad. Благо, в основе даже такой экзотики, как виртуальная реальность, лежит все тот же текст (правда, на специальном языке VRML - Virtual Reality Modeling Language). Все определяется трудоемкостью реализации этих техноло­гий. Например, трудно представить, что, работая в простом редакторе, кто-то вруч­ную станет считать пикселы картинки для создания сенсорной карты. Скорее, автор просто откажется от использования подобной возможности на своей странице. Если же ему удастся найти инструмент, поддерживающий создание сенсорных карт, и при этом обеспечивающий сочетание простоты реализации с высоким качеством формируемого изображения, то вопрос о включении в страницу сенсорной карты отпадет сам собой. Автору и посетителям его сайта останется лишь восхищаться наглядностью хорош о продуманного изображения и удобством работы (естествен­но, при условии соблюдения рекомендаций, приведенных в этой книге).

Примером такого инструмента может служить программа CuteMap фирмы GlobalSCAPE. Общий вид основного окна приложения показан на рис. 8.20.

Рис. 8.20. Основное окно CuteMap — инструмента для создания сенсорных карт

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

CuteMap предоставляет разработчику следующие основные возможности

• Визуальное редактирование сенсорной карты с одновременным отображени­ем вносимых изменений в специальном окне редактора;

• Сохранение созданной сенсорной карты (или ее копирование) в существую­щем HTML-документе;

• Применение технологии drag-and-drop, позволяющей создавать сенсорные кар­ты с помощью разнообразных панелей инструментов, без использования ручного редактирования HTML-кода

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

• Раздельная установка цветов для выбранных и невыбранных зон при одновре­менной работе с несколькими сенсорными картами.

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

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

Рис. 8.21. Классификация инструментов разработки Web-приложении

Начнем с достаточно простых и дешевых (зачастую бесплатных) HTML-редак­торов. На сайтах и в файловых архивах бесплатного и условно бесплатного про­граммного обеспечения можно найти довольно обширные коллекции подобных ре­дакторов. Одним из наиболее популярных продуктов данной категории является Arachnophilia 3.6. Программа поистине замечательная, можно сказать шедевр, осо­бенно учитывая, что ее авторство принадлежит одному человеку (Paul Lutus), a платой за пользование этим редактором он считает хорошие поступки, которые мы должны совершать ежедневно. Но это лирика, а редактор действительно заслужи­вает добрых слов. С 1996 года по 1998 он впитывал новые возможности, совершен­ствовался, но сохранил достаточно скромные размеры и высокую производитель­ность. На рис. 8.22 мы намеренно представили все доступные пользователю панели инструментов, чтобы показать, сколько возможностей языка HTML поддерживает этот редактор.

Рис. 8.22. Окно HTML-редактора Arachnophilia 3.6

К слову сказать, пользовательский интерфейс этой программы может служить хорошим примером согласованности и продуманности, а справочная система со­держит не только информацию о программе, но и некоторые сведения об Интернете для начинающих пользователей. Программу полезно использовать при изу­чении HTML. Синтаксис выделяется цветом, хорошо реализовано автоматическое форматирование исходного текста описания страницы. Arachnophilia объединила в себе множество функций, обычно реализуемых вспомогательными утилитами (генерация таблиц, форм, конвертирование RTF-файлов и многое другое). Про­грамма способна вызывать до шести разных броузеров для просмотра результатов работы, причем настройка выполняется очень просто. Интересно, что автор пред­лагает использовать свой редактор в качестве вспомогательного для MS Frontpage и утверждает, что этим будут устранены некоторые слабые стороны упомянутого колосса!. Мы ограничимся лишь небольшим резюме: для разработки отдельных страниц и небольших сайтов, сроки сдачи которых не лимитированы и хочется глубже разобраться в языке HTML (а средств на приобретение мощных инстру­ментов нет), Arachnophilia- лучший выбор.

Следующий инструмент - это HotDog, редактор очень популярный в среде web-дизайнеров «первой волны», которые начинали с Notepad и привыкли работать с HTML-кодом. HotDog не мешает работать в привычном им стиле, но существенно повышает производительность труда за счет синхронного показа «порождаемой» страницы и множества сервисных возможностей. Работа в этом редакторе сочетает как ручной ввод HTML-тегов с клавиатуры, так и обращение к многочисленным генераторам типовых фрагментов HTML-кода. Во втором случае нажатие пиктог­рамм, обозначающих теги и группы тегов на инструментальных панелях, приводит к появлению в текущей позиции исходного текста страницы соответствующего фраг­мента HTML-кода. По мере ввода и редактирования текста страницы, в нижней части экрана можно наблюдать, как изменяется образ этой страницы, формируе­мый одним из броузеров, установленных на машине пользователя (если их несколь­ко, то можно выбрать, каким именно).

Вам также может быть полезна лекция "1. Определение и классификация УВМ".

Создатели HotDog (фирма Sousage) широко использовали средства мультиме­диа. Многие процессы при работе сопровождаются довольно нетривиальными зву­ками, которые, конечно, отнимают некоторое количество системных ресурсов, но заметно поднимают настроение пользователя, что в конечном итоге приводит к повышению производительности его труда. Впрочем, если «собачьи голоса» начнут раздражать, то их легко отключить...

Интерфейс редактора нагляден и достаточно точно соответствует функциональ­ному назначению этой программы. Очень развиты средства поддержки пользовате­ля, много интересных решений в рамках традиционных возможностей графическо­го Windows-ориентированного интерфейса. К достоинствам HotDog следует отнести множество сервисных функций - «изюминок», которых так не хватает при работе над страницами в более серьезных системах разработки Web-материалов. К таким возможностям относятся:

• «многоместный» буфер переноса, в который можно поместить часто исполь­зуемые текстовые фрагменты и извлекать их оттуда по мере необходимости;

• полный список тэгов языка HTML со всеми их атрибутами, организованный в виде упорядоченного по алфавиту дерева (представлено в правой части рис. 8.23), из которого теги можно просто перетаскивать на разрабатываемую страницу тради­ционным способом drag-and-drop;

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

Этот перечень далеко не полон; редактор поддерживает множество интернет-технологий, — от анимационной графики и сенсорных карт, до аплетов и CGI-скриптов. Конечно, степень поддержки довольно скромная, но вполне соответствует той «экологической нише», для которой этот редактор создан. В заключение следует отметить большое внимание, которое уделила фирма Sousage, вопросам поддерж­ки пользователя. Начиная с процедуры инсталляции HotDog, ощущаешь заботу и уважение к пользователям самых разных уровней подготовки, а настройка интер­фейса программы доставит истинное удовольствие многим ценителям гибкости, наглядности и простоты (во всяком случае, версия 5.0 на наш взгляд в этом отноше­нии практически безупречна). Итогом краткого рассмотрения HotDog 5.0 может служить рекомендация этого средства разработки как для новичков, так и для опыт­ных авторов, особенно в качестве альтернативы Notepad и другим неспециализиро­ванным редакторам.