Создание изображения внутри изображения, страница 11

Формат JPEGобеспечивает сохране­ние широкого спектра цветов и тонких оттенков многоцветных фотографи­ческих изображений. Открыв в прог­рамме Photoshop файл mailbox,psd, вы­берите команду Save forWeb (Сохра­нить для Web) и щелкните мышью на вкладке 4-Up(4 варианта). (В програм­ме ImageReady щелкните мышью на вкладке 4-Up(4 варианта) и убедитесь в том, что открыта палитра Optimize(Оптимизация).) Левая верхняя об­ласть просмотра отображает исходное изображение. Программа Photoshop ав­томатически генерирует представле­ния файла JPEGвысокого, среднего и низкого качества. Сравните качество и размеры иллюстраций, а потом щелк­ните мышью на одном из эскизов, что­бы поэкспериментировать с настрой­ками формата и качества, оценивая со­отношение размер/качество.

Формат GiFиспользует для представ­ления изображений палитру из 256 цветов, что весьма приемлемо для иллюстраций, состоящих из чистых и повторяющихся цветов. Открыв в программе Photoshop файл land­scape.psd, выберите команду Save for Web (Сохранить для Web) и щелкните мышью на вкладке 4-Up(4 варианта). (В программе ImageReady щелкните мышью на вкладке 4-Up (4 варианта) и убедитесь в том, что открыта палит­ра Optimize(Оптимизация).) Левая верхняя область просмотра отобража­ет исходное изображение. Программа Photoshop автоматически генерирует три представления файла в формате GIFразного качества. Сравните каче­ство и размеры иллюстраций, а потом щелкните мышью на одном из эски­зов, чтобы поэкспериментировать с настройками формата, методами сни­жения цветности и другими парамет­рами. Палитра ColorTable (Таблица цветов) точно показывает, какие цве­та используются в оптимизированном файле.

Перед завершением Урока проверьте работу созданного Web-сайта в Web-браузере.

6  Перейдите к программе Adobe Bridge и найдите в  ее диалоге папку
Lessons/Lesson 13/1 ЗМуРаде. Щелкните правой кнопкой мыши (Windows) или, зажав клавишу Control, щелкните кнопкой мыши (Mac OS) и выберите из конте­кстного меню команду OpenWith(Открыть с помощью). Выберите Web-брау­зер, в котором должен быть открыт файл 13Start.html.

7  Проверьте, все ли ссылки работают правильно. Для этого щелкайте кнопкой мыши на областях созданных срезов и карт навигации.

Примечание: Если некоторые ссылки в HTML-файле работают некорректно, вы можете вер­нуться к программе ImageReady, устранить проблемы с помощью палитр ImageMap (Карта ссылок) или Slice(Фрагмент) для файла 13Start.html, а потом выбрать команду File♦ UpdateHTML(Файл ♦ Обновить HTML). В диалоге UpdateHTML(Об­новить HTML) выделите файл 13Start.html и щелкните мышью на кнопке Open(Отк­рыть). Затем щелкните мышью на кнопке Replace(Заменить), когда появится диа­лог Replace Files (Заменить файлы), и щелкните мышью на кнопке ОК, чтобы зак­рыть сообщение об обновлении файла. По окончанию вновь проверьте HTML-страницу в Web-браузере.

Поздравляем! Теперь вы умеете создавать интерактивные срезы и карты ссылок. Настало время познакомиться с ролловерами. Об этом рассказывается в следую­щем уроке.

Обзорные вопросы

1  Что такое срезы?

2  Опишите три способа создания срезов.

3  В чем состоит сходство и различие между срезами и картами ссылок?

4  Что такое оптимизация изображения и как осуществляется оптимизация
изображений для Web?

Ответы на обзорные вопросы:

1  Срезы представляют собой прямоугольные области изображения, которые вы можете определять в программе Photoshop или ImageReady для индивиду­альной Web-оптимизации. С помощью срезов можно создавать анимированные GIF-файлы, гиперссылки с адресами URL и ролловеры.

2  Срезы можно легко создать при помощи выделения областей изображения инструментом Slice (Раскройка). Другим действенным методом создания срезов является преобразование слоев, направляющих или выделений в сре­зы с помощью команд меню Layers (Слои), Slices (Фрагменты) или Select (Выделение). Кроме того, в тех областях изображения, которые не относят­ся к пользовательским срезам, автоматически создаются автосрезы.

3  Срезы можно создавать в программах Photoshop или ImageReady. Срезы всег­да имеют прямоугольную форм)- и могут относиться к одному из трех типов:
Image (Изображение), No Image (Без изображения) и Table (Таблица). Кар­
ты ссылок можно создавать только в программе ImageReady. Карты ссылок
могут иметь любую форму и всегда содержат изображение. И срезы, и карты
ссылок могут служить «горячими зонами», к которым привязаны гиперссыл­
ки на другие страницы. И к срезам, и к картам ссылок можно применить рол­
ловеры, которые мы рассмотрим в Уроке 14.

4  Оптимизация - это процедура выбора формата, разрешения и параметров ка­чества для изображений, которые планируется опубликовывать в Интернете. При оптимизации важно сохранять баланс между небольшим размером гра­фического файла и допустимым качеством его экранного представления. Многоцветные изображения, как правило, оптимизируются в формате JPEG, изображения, состоящие из чистых цветов или часто повторяющихся цве­тов - в формате GIF. Для оптимизации изображений в программе Photoshop используется команда File ♦ Save for Web (Файл ♦ Сохранить для Web), в прог­рамме ImageReady - палитра Optimize (Оптимизация).