Приемы работы с HTML-WorkShop

В состав проекта входят файлы тем, оглавление, индексный файл, рисунки (если они есть) и непосредственно файл проекта.

Создание проекта происходит в следующей последовательности:

1. Создать файл проекта;

2. Создать файлы тем в виде HTML- файлов;

3. Создать оглавление;

4. Открыть индексный файл;

5. Специфицировать размещение рисунков;

6. Определить стили окон

7. Определить и назначить информационные типы для группировки тем

8. Скомпилировать и просмотреть проект.

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

Рис. 5.4. Окно системы HTML Help Workshop

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

Меню Edit практически является обычным меню редактирования программных продуктов Microsoft и, в основном, обеспечивает работу с буфером обмена, поиск и замену различных фрагментов проекта.

Меню Tags позволяет вставлять в текст файлов параграфов (тем) команды (теги) и языка HTML и различные типовые блоки Web-страниц.

Меню View позволяет настроить вид рабочего окна, меню Test – настроить и проверить параметры всплывающих окон, ключевых слов и функций HtmlHelp API. Меню Tools позволяет вызвать редактор HTML Help Image Editor – редактор системы навигации по файлам проекта, построенной на базе рисунка (UseMap). Меню Window и Help являются обычными меню команд управления окнами и справочной системой программного средства.

Создание проекта происходит по выбору команды File/New. Эта команда открывает список объектов (рис. 5.5.). Для создания проекта достаточно

Рис. 5.5. Окно New

выбрать слово Project. Выбор этого слова откроет целую серию окон мастера проекта, схема которого показана на рис. 5.6,а, а заполнение рабочего поля – на рис. 5.6,б – 5.6,д. "Приветствие" Мастера (рис. 5.6,б) предлагает установить флажок "Convert WinHelp project". Его надо устанавливать только для использования готовых проектов в составе нового.

а) б)	в)   г)   д)
Рис. 5.6. Схемы окон Мастера проекта

Предложение определить местонахождение файлов (рис. 5.6,в) требует заполнения окна с именем нового проекта (верхнее) и окна с местонахождением уже созданного конвертируемого проекта (нижнее). Оно не появляется при сброшенном вышеуказанном флажке.

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

Создание HTML-файлов [12] параграфов системы выполняется по команде File/New. В открывшемся окне (рис. 5.5) необходимо выбрать пункт HTML-file. Далее откроется окно (рис. 5.7), в котором автоматически создастся стартовый текст файла, для которого потребуется только определить заголовок и имя файла при сохранении. Созданный файл необходимо немедленно сохранить, тогда он станет доступным для включения в проект. Для этого достаточно щелкнуть кнопку Add/Remove topic files (вторая сверху) на вкладке Project окна проекта (рис. 5.4). В ответ откроется окно со списком тем (рис. 5.8), после щелчка кнопки Add которого появится обычное окно "Открыть файл". Выбор нужного файла обеспечит его подключение в проект.

Рис. 5.7. Окно HTML-файла

Рис. 5.8. Схема окна "Список тем"

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

Текстовые блоки можно создавать так же, как и файлы параграфов, командой File/New, но выбрать пункт Text, или использовать команду Tags/Insert TextBlock (Вставить Текстовый блок) при развернутом в рабочем поле проекта хотя бы одном окне файла параграфа. В этом случае открывается меню текстовых блоков. Если ни одного текстового блока не создано, то список заполнен словами Empty (пусто). Выбор этого слова открывает окно создания текстового блока. После его создания появляется возможность вставлять его в открытый в рабочем поле файл параграфа или отказаться от вставки. В дальнейшем созданный блок можно вставить в любой параграф.

Создание окон справочной системы обеспечивает возможность открывать файлы параграфов в окнах с заранее определенными свойствами. Для создания описания окна следует "щелкнуть" кнопку Add/Modify window definitions (добавить и изменить определение окна) в окне оглавления проекта (на рис. 5.4 третья сверху). Открывается окно описания типов окон (рис. 5.9).

Рис. 5.9. Окно описания типов окон

Кнопкой Add… можно открыть окно для ввода имени типа окна, а в текстовом окне Title bar text вводится заголовок окна. На вкладке Files задаются имена файлов, открывающихся в окне по умолчанию. Вкладка Buttons добавляет в заголовок окна органы управления окном справочной системы, вкладка Position позволяет определить размер и положение окна

в момент его первого открытия, а на вкладке Navigation pane можно задать наличие в левой половине окна панели навигации для оглавления.

Создание оглавления в проекте, создаваемом в HTML Help Workshop, обеспечивает выполнение двух функций: создание средства навигации по справочной системе и назначение окон, открывающихся при вызове тем. Создание оглавления выполняется по команде File/New с выбором пункта Table of contents в открывшемся окне списка объектов или открытием вкладки Contents в окне оглавления проекта (рис. 5.4).

Рис. 5.10. Окно оглавления

В окно оглавления справочной системы (рис. 5.10) вставляются заголовки глав и страницы параграфов. Следует иметь в виду, что HTML-файлы нужно создавать не только для самих параграфов, но и для заголовков оглавления. В эти файлы можно поместить краткую аннотацию главы со ссылками на соответствующие разделы глав справочной системы. Кнопками Insert a heading и Insert a page (вторая и третья сверху) в окно вставляются заголовки глав и параграфов, кнопка с иконкой "Карандаш" включает режим редактирования выбранного объекта. При добавлении или изменении объекта открывается окно, на вкладках

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

Создание ключевых слов и индексного файла позволяет применить в справочной системе машину поиска параграфов по ключевым словам. Создание списка индексных слов происходит по команде File/New/Index примерно так же, как и создание оглавления, т.е. в окно индексного файла вставляются ключевые слова и с каждым из них связывается тот или иной параграф.

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

Для редактирования файла параграфа нужно выделить его в окне оглавления проекта (рис. 5.4) и щелкнуть кнопку View HTML sourse. В окне файла будет виден текст параграфа в формате HTML. Для человека, не знающего язык HTML, создание текста параграфа весьма утомительно. Можно порекомендовать сочетать работу в среде HTML Help Workshop с работой в среде HTML-редакторов, например, Front Page или Netscape Communicator.

Сравнительно легко вставить заголовок параграфа (команда Tag/Heading). Все остальные теги форматирования текста приходится вставлять вручную. Теги в большинстве случаев ставятся парами, в которых один тег открывает фрагмент текста файла, а второй закрывает его. В табл. 5.1 приведены основные теги, с которыми приходится иметь дело при создании справочной системы. Многоточие, стоящее после имени тега указывает на наличие в нем параметров.

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

Вставку рисунка выполняют путем копирования его в текст файла через буфер обмена или с помощью тега <IMG …>. Если предполагается, что рисунок будет занимать только часть строки, то обеспечить обтекание рисунка текстом проще всего применением таблицы.

Ссылку на другие HTML-файлы проще всего выполнять в виде фрагмента текста, который будет выделяться на фоне остальных слов. Возможно применение в качестве ссылок фрагментов какого-либо рисунка, который называется в этом случае клиентской картой. Ссылка на скрипт (программу на языках Java, Java Script, VBScript) обеспечивает запуск указанной программы.

Для открытия всплывающего окна в файле параграфа следует использовать тег <OBJECT> и сослаться на сценарий, так как это показано на рис. 5.11. Жирным шрифтом выделены элементы, создающие всплывающее окно и выводимый в него текст.

Таблица 5.1

Теги, наиболее часто применяющиеся при создании справочных систем

Формат тега	Назначение тега
<BODY> …</BODY>	Выделяет текст отображаемый броузером (средством просмотра) HTML-файлов.
<H1>Заголовок</H1>	Оформление заголовка первого уровня.
<P...>Текст абзаца</P>	Оформление абзаца.
<BR>	Принудительный разрыв строки.
<FONT …>текст</FONT>	Задание формата шрифта текста.
<TABLE …> <TR …> <TD …> Текст клетки таблицы </TD> ... </TR> ... </TABLE>	Открывает таблицу и определяет ее параметры. Открывает строку и определяет ее параметры. Открывает клетку и определяет ее параметры.   Закрывает клетку таблицы.   Закрывает строку таблицы.   Закрывает таблицу.
<IMG src="спецификация файла">	Вставка рисунка.
<A href="спецификация файла"> видимый текст</A>	Оформление видимого текста как ссылки на заданный HTML-файл.
<OBJECT …> описание объекта </OBJECT>	Вставка объектов, например, звуковых и видео файлов.
<SCRIPT>... </SCRIPT>	Оформление скрипта (программы на языке Java или Java Script или VBScript).

<OBJECT id=hhctrl type="application/x-oleobject"

classid="clsid:adb880a6-d8ff-11cf-9377-00aa003b7a11">

</OBJECT>

<H1 ALIGN=CENTER>ВТОРАЯ СТРАНИЦА</H1>

Это вторая страница справочной системы с демонстрацией открытия

<A HREF=

JavaScript:hhctrl.TextPopup( "Это&#32;текст&#32;во&#32;всплывающем&#32окне.&#32;Хитрые&#32;разделители&#32;слов&#32;нельзя&#32;заменять&#32;символами&#32;пробела. ","Verdana,10",10,20,-1,-1)>всплывающего окна</A> в HTML-файле.

Рис. 5.11. Создание всплывающего окна в параграфе

Страница с таким фрагментом будет иметь заголовок "ВТОРАЯ СТРАНИЦА" и текст "это вторая страница справочной системы с демонстрацией открытия всплывающего окна в HTML-файле". В ответ на щелчок по ссылке откроется всплывающее окно лимонного цвета с текстом "Это текст во всплывающем окне. Хитрые разделители слов нельзя заменять символами пробела". Этот текст оформлен шрифтом Verdana размером 10 кеглей, пара чисел 10,20 указывает поля сбоку и сверху, пара чисел -1,-1 указывает цвет символа и цвет фона. Значения кодов начинаются с нуля и могут принимать большие по модулю отрицательные значения, например, код –1000000000 соответствует черному цвету фона, а код -1 – лимонному. Шкалы цветов символа и фона приведены на рис. 5.12.

0 -1 -2... -30... -50... -200...-10000... –20000... –35000... -40000

черный черный белый голубой серый фиолетовый синий фиолетовый

грязный чистый

а)

-1 -2... -5000 -6000 … 9000 … -11000…-19000 -20000 -21000…-27000

лимонный белый голубой фиолетовый синий фиолетовый синий

темный грязный светлый грязный

-30000 -31000 -32000…-36000 -37000…-39000…-40000... –63000 –64000 –65000…-82000

фиолетовый синий фиолетовый синий синий с фиолетовым

-83000 -84000 –85000 -92000…-96000…-100000 -170000 -180000…-190000…-200000…-250000

синий фиолетовый синий фиолетовый синий

-1*10⁷ … -15*10⁷ …-19*10⁷ …-26*10⁷ -27*10⁷ -35*10⁷ -100*10⁷

серый черный

б)

Рис. 5.12. Шкалы цветов символа и фона всплывающего окна

Комбинация символов &#32; заменяет символ пробела, разделение текста пробелами, символами разрыва и переноса строки не допускается. Есть и другие ограничения.

Дата добавления: 2014-11-29