Практика создания динамических Web-узлов

         

Если несколько кнопок являются общими



Замечание

Если несколько кнопок являются общими для всех страниц Web-узла, то можно сделать их доступными для всех участников рабочей группы. Создайте все кнопки со всеми состояниями в многослойном документе Fireworks и сохраните его в виде PNG-файла. Все участники рабочей группы должны импортировать этот документ на свои панели Library. Можно поступить еще проще. Участники группы должны скопировать этот файл в свои папки (Fireworks MX Configuration=>Libraries). После этого файл становится доступным из меню EditoLibraries, и его содержимое появляется в диалоговом окне Import A Button. Можно импортировать все кнопки сразу или только необходимые в данный момент.

Замечание

В принципе, мы могли бы сделать заливку фигур во FreeHand, но дело в том, что палитра этой программы не позволяет создавать цвета на основе числовых значений. Поэтому мы решили только создать фигуры во FreeHand, но окончательно все доделать в Fireworks MX. Сборка кнопок в Fireworks MX
Опять вспомним не раз повторявшийся совет: "Правильно выбирайте инструмент". Fireworks MX — это специальное приложение, и поэтому рисунок может быть оптимизирован с его помощью для использования в Web-пространстве. Используя слои, управление прозрачностью, множество эффектов и фильтров, рисунок может быть экспортирован в формате .PNG во Flash MX.
Для того чтобы сделать кнопку Aqua Button в Fireworks MX, выполните следующее.
1. Откройте новый документ Fireworks и в диалоговом окне создания документа установите для него следующие параметры: ширина — 200 пикселей; высота — 150 пикселей; разрешение — 100; цвет фона — белый. Щелкните на кнопке ОК.
2. Выберите в меню File=>Import и укажите папку, в которой хранится кнопка, сделанная с помощью FreeHand. Дважды щелкните на файле в окне импорта.
^ Откроется диалоговое окно Vector Options. Флажки Antialias Paths и Text должны быть установлены. В списке Text Options выберите значение Crisp. Это нужно для того, чтобы текст при импорте не утратил четкости. Щелкните на кнопке ОК.
3. Наведите курсор на левый верхний угол холста и щелкните один раз. Рисунок появится на сцене, и откроется панель Layers.
4. Выделите форму кнопки на холсте и залейте ее цветом 0000СС. Перетащите область блика на ее место на кнопке. В панели Layers создайте две копии слоя Button. Дайте им осмысленные имена, например Buttonl и Button2. Отключите видимость всех слоев, кроме слоя Reflect.







Замечание

Flash-кнопку можно вставить только в именованный документ. Если вы откроете новый документ, программа попросит вас сохранить его перед тем, как вставлять Flash-кнопку, Есть еще два способа вставить Flash-кнопку в документ. Можно перетащить значок Flash-кнопки на страницу из панели Insert или выбрать в меню Insert=>Interactive Images=>Flash Button. 2. В области Style выберите из списка значение Chrome Bar. Введите New Riders в текстовое поле Button Text и выберите шрифт и размер для текста кнопки.
3. В области Link введите абсолютный адрес ссылки — http: //www. newriders.com. Если вы хотите вставить ссылку на страницу на своем Web-узле, щелкните на кнопке Browse и укажите нужную страницу.



Замечание

Первые версии программы FreeHand создавались во времена печатных технологий, поэтому, когда приходится выбирать цвет, инструменты для этого напоминают те книжки с образцами цветов, которыми пользуются художники и печатники. Во FreeHand MX нет такой палитры цветов, как в Fireworks, во Flash и в Dreamweaver, но компания Macromedia обещает исправить этот недостаток в будущих версиях программы. 4. Сделайте еще одну копию символа Up и назовите его Over. Дважды щелкните на рисунке символа Over и откройте редактор Symbol Editor. Щелкните на кнопке, выделите ее и выберите в меню Modify=>Ungroup.
5. Выделите внутреннюю окружность, щелкните на вкладке Fill и установите угол градиента, равный 0 градусам. Откройте символ Down и разгруппируйте окружности. Установите угол градиента внутренней окружности, равный 90 градусам, а внешней — 270. Закройте редактор и поместите три экземпляра кнопок на холст и удалите папку Brush Tips из библиотеки символов. Сохраните документ.



Замечание

Мы рассмотрели много способов взаимодействия Flash и Dreamweaver. Но при этом мы имели дело только с конкретными кнопками. Запомните — если вы можете создать одну кнопку и настроить ее работу, вы можете сделать то же самое и с десятью кнопками. Главное достоинство Flash-кнопок состоит в том, что они не очень требовательны к ресурсам.



Замечание

Если вам нужно создать подпункт меню Colors, щелкните два раза на кнопке Indent Menu.



Замечание

Если щелкнуть на кнопке Image, откроется серия кнопок, которые отвечают за вид данного пункта. Если вам кажется, что данных средств недостаточно, примените собственный стиль, создав цвет, заливку и контур самостоятельно. Кроме того, можно создать стиль во FreeHand и экспортировать его в Fireworks MX. 11. На вкладке Advanced редактора меню можно управлять размером ячеек меню, расстоянием между ячейками, отступами текста, установить, сколько времени должно пройти до исчезновения меню, и т.д. Для вашего меню мы рекомендуем такие установки:
Cell Width - 65;
Cell Height - 18;
Cell Padding - 0;
Text Indent - 5;
Cell Spacing - 2;
Menu Delay - 1,000 ms;
Pop-Up Border - Selected;
Border Width - 1;
Shadow — #666666;
Border Color - FFFFFF;
Highlight - FFFFFF.

Содержание раздела