Мультимедиа и Web

Цвет

Как известно, при подготовке изображений, предназначенных для воспроизведения на экране, довольно трудно предвидеть, насколько могут изменяться их тона. С цветами дело также обстоит ничуть не легче. Профессиональные художники-графики работают на мониторах с 24-битовым цветом ("true color"), но это вовсе не значит, что такие мониторы есть и у обычных пользователей. В большинстве случаев на их экранах одновременно отображается лишь 256 цветов, а часть пользователей (их, правда, не так много) имеет монохромные мониторы, где цветов нет вообще.

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

Ниже приводится несколько общих правил, заслуживающих доверия.

Подсказка. Устойчивые цвета для Web. Каждый компьютер использует встроенную палитру из 256 цветов, но иногда некоторые программы требуют другой палитры. Web-браузеры на Macintosh и Windows используют лишь 216 цветов из 256. Эти 216 "интернетовских" цветов называются "Web-устойчивыми" или "браузер-устойчивыми", потому что на обеих платформах они выглядят более или менее одинаково (в действительности, как известно, цвета и тона на разных платформах редко бывают одинаковыми).

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

(рис 18.2) "Интернетовские" цвета (1-ый рисунок - цвет на 24-битовом мониторе; 2-ой рисунок - на 8-битовом мониторе этот цвет отсутствует, и система вынуждена его имитировать; 3-ий рисунок - интернетовский" цвет на 8-битовом мониторе отображается без имитации)

Для 16-битового (тысячи цветов) и 24-битового (миллионы цветов) режимов отображения "интернетовские" цвета менее критичны, так как случайное распределение там используется в меньшей степени или не используется вообще.

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

Но проще всего открыть палитру Swatches и выбрать из всплывающего меню любую из Web-устойчивых палитр цветов (любая палитра, название которой начинается со слова "Web" или "Visibone").

Теперь на палитре Swatches представлены 216 "интернетовских" цветов. С ними у вас не будет никаких проблем.

Небольшие вычисления показывают, что "интернетовские" цвета размещены на 256-уровневой шкале с интервалами в 20 процентов. То есть, это может быть 20-процентный красный и 60-процентный зеленый. Зная это, возможно, вы захотите изменить палитру цветов ( Color Picker в диалоговом окне Preferences ), чтобы задавать цвета по процентным величинам. Не надо. Photoshop вычисляет эти величины на основе ваших установок в диалоге RGB Setup, поэтому корректных цветов вы не получите. Если вы решите вводить числовые значения в поля палитры цветов Color Picker, воспользуйтесь этими: 5, 51, 102, 153, 204 или 255 (они соответствуют 0, 20, 40, 60, 80 и 100 процентам).

Разрешение

Одна из наиболее приятных особенностей работы с изображениями, предназначенными для воспроизведения на экране, состоит в том, что их разрешение составляет 72 ppi и файлы получаются очень маленькими (по крайней мере по сравнению с изображениями для печати). Картинка 4х5 дюймов при 72 ppi занимает до 300 Кб, тогда как такое же изображение для печати потребует 4,5 Мб дискового пространства, не говоря уже об оперативной памяти. Малые файлы обрабатываются быстрее и памяти потребляют меньше. Вообще, можно использовать любое разрешение, но на заключительной стадии один пиксел изображения должен соответствовать одному экранному. Картинка на 300 ppi на экране выглядит огромной!

Мало того, что в Internet трудно предсказать изменения цветов и тонов, не известно еще при каком разрешении будут просматриваться ваши изображения – иллюстрация на 72 ppi станет гораздо меньше, если ее откроют на мониторе с высоким разрешением. Поэтому картинки на 72 ppi желательно делать немного большими по размеру, чтобы на экране с высоким разрешением они выглядели нормально. "Стандартное" разрешение большинства Windows-мониторов составляет 96 ppi. Брюс работает на 17-дюймовом мониторе при разрешении 1600х1200 пикселов, что приближается к 150 ppi! На таком экране Web-картинка уменьшается почти вдвое.

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

Подсказка. Гибридные "интернетовские" цвета. Двести шестнадцать цветов – это все-таки маловато. Можно расширить возможности для творчества путем формирования гибридных "интернетовских" цветов. Весь фокус состоит в создании маленьких образцов, включающих пикселы только "интернетовских" цветов (см. рис. 18.3).

(рис 18.3) Гибридные "интернетовские" цвета

Создайте документ размером 2х2 пиксела.

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

Выделите все пикселы ( (Command)+(A) ) и командой Edit > Define Pattern определите образец.

Перейдите к другому документу, выберите команду Edit > Fill и, установив в списке Use вариант Pattern, залейте образцом предварительно выделенную область.

Комбинации "интернетовских" цветов позволяют создавать тысячи новых вариантов (пример тому вы найдете по адресу http://www.pixelboyz.com/rwpshop/hybridcolors.htm). Используя для образцов более двух цветов, можно имитировать еще большее число оттенков (хотя при этом становится заметной повторяющаяся структура).

Линда Уэйнманн, автор книги "Designing Web Graphics", отмечает, что лучше всего подбирать цвета близкие по тону: смешиваясь, они воспринимаются как единый новый цвет.

Кстати, если вам приходится делать это регулярно, приобретите какую-нибудь недорогую или распространяемую бесплатно программу, которая создает такие образцы автоматически (например, ColorSafe фирмы TopBox Software, WebVize фирмы Auto F/X или DitherBox производства RDG).

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

(рис 18.4) Бесшовный плиточный орнамент (Фильтр Offset позволяет увидеть (и устранить) прямые края, образующие стыки)

Создайте новый документ по размеру будущего образца. Он может быть квадратным или прямоугольным.

Нарисуйте или вставьте изображение.

Выберите команду Filter > Other > Offset и укажите величины смещения примерно на одну четверть по ширине и высоте изображения.

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

Выберите команду Offset еще раз (помните, что для повторного применения фильтра достаточно нажать (Command)+(F), чтобы проверить не осталось ли прямых краев или пустот. Если они есть, уберите их. Редактируя изображение, не закрашивайте краевых пикселов, иначе вам придется повторить действия пп. 3 и 4.

Теперь при стыковке плиток прямых краев видно не будет. Выделите картинку ( (Command) + (A) )и командой Edit > Define Pattern определите образец. Чтобы проверить его действие, перейдите к другому изображению большего размера, выделите какую-нибудь область и залейте ее только что созданным образцом ( Edit > Fill с вариантом Pattern ). Отметим, что ImageReady также имеет встроенный фильтр Seamless Tile, который выполняет аналогичную операцию автоматически.

Сохранение изображений

Похоже, что большинство изображений, представленных в настоящее время на Web-страницах, созданы или отредактированы в Photoshop. Это странно, поскольку до версии 5.5 в Photoshop было очень немного интересных Web-средств. Версия 5.5 стала настоящим обновлением для Web (правда, почти не было добавлено новых средств допечатной обработки), а версия 6 стала мощным развитием Web-средств на радость всем Web-художникам.

Создание изображений для Web – это поиск компромисса: вы можете иметь либо высококачественные изображения, либо изображения, которые быстро загружаются. Выбирать вам. Проблема заключается в том, что вам нужно видеть все варианты, чтобы принять информированное решение, насколько можно ухудшить качество изображения, чтобы получать небольшие размеры файлов. Решение заключается в использовании средства Save For Web.

Команда Save For Web (выберите ее из меню File или нажмите (Command) + (Option) ) позволяет вам точно видеть, что произойдет с вашими изображениями, если преобразовать их в GIF или JPEG. Кроме того, в этом диалоговом окне можно одновременно отображать от двух до четырех версий и корректировать каждую из них, пока не получите нужный вам результат (см. рис. 18.5).

Экранные файловые форматы

Графические форматы файла описаны в лекции 16, "Хранение изображений", а здесь мы более детально рассмотрим только два – GIF и JPEG, поскольку именно они определяют, как будут выглядеть ваши картинки в Internet. Изображения, предназначенные для программ мультимедиа, таких как Microsoft PowerPoint или Macromedia Director, можно сохранять в форматах PICT, TIFF или EPS (см. подсказку "Отличное превью, небольшой файл", лекция 16, "Хранение изображений"). А для Web используются два формата – GIF или JPEG.

Подсказка. Проверка размера файла. Размер файла, который выводится в левом нижнем углу окна документа, далеко не точен. Дело в том, что там не учитывается сжатие GIF- или JPEG-изображений. Размер файла, который показан в диалоговом окне Save For Web, ближе к фактическому размеру, но и он неточен. Чтобы выяснить истинный размер сжатого изображения, прежде всего сохраните его. На Macintosh перейдите в Finder, выделите пиктограмму интересующего вас файла и выберите команду File > Get Info. На Windows щелкните на значке файла правой кнопкой мыши и выберите из списка пункт Properties (см. рис. 18.6).

Если там указано, например, "27 K on disk (22.045 bytes used)", то принимать во внимание следует только второе значение. Первое показывает пространство, занимаемое изображением на жестком диске, и определяется минимальным размером блока вашего диска. Если диск разделен на блоки по 32 Кб, то 2-Кб файл будет занимать весь блок (32 Кб), а 33-Кб файл – два блока (64 Кб). Второе значение показывает фактический объем данных, который необходимо загрузить, чтобы увидеть изображение. Обычно он меньше, чем объем занимаемого дискового пространства.

(рис 18.6) Определение размера файла (Принимайте во внимание только значение параметра Size)

Диалоговое окно Save For Web

Применение Save For Web должно быть происходить систематическим образом. Вот основные шаги, которые должны выполняться после открытия этого диалогового окна.

Первая проблема: большое число доступных для изменения параметров в этом диалоговом окне, многие из которых не совсем понятны. Вторая проблема: общая структура интерфейса слишком отличается от других диалоговых окон в Photoshop. Возможно, это новое направление в разработках Adobe, но пока здесь легко запутаться. Всплывающие меню Settings и Format относятся к любому файловому формату, который вы используете, поэтому мы рассмотрим сначала эти меню. Затем мы перейдем к параметрам, которые относятся к специфике GIF, JPEG и PNG.

Settings. Во всплывающем списке Settings можно выбирать готовые наборы параметров. Нет ничего особенного в уже встроенных наборах: они включены в этот список, чтобы было с чего начать. Если вам не нравятся эти установки Adobe, их можно удалить, выбрав команду Delete Settings из всплывающего меню справа от списка Settings. Чтобы добавить к этому списку собственный набор параметров, выберите команду Save Settings: проследите, чтобы эти установки были сохранены в папке Photoshop Presets > Optimized Settings с расширением имени файла .irs.

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

Формат JPEG

Чтобы сканированные фотографии отображались в Web с наилучшим качеством, файлы необходимо почти всегда сохранять в формате JPEG. Тогда на 24-битовых мониторах пользователи будут видеть все цвета изображения, а на 8-битовых – их имитированную версию. Имитированная версия обычно выглядит вполне нормально – будто вы сами выполняли преобразование в 8-битовый режим средствами Photoshop.

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

Сохранять изображения в формате JPEG можно из диалогового окна Save As (см. лекцию 16, "Хранение изображений"), но гораздо больше возможностей контроля вы получаете в диалоговом окне Save For Web (см. рис. 18.7).

Optimized. Вам нужно отключать флажок Optimized, только если вы уверены, что изображение будет выводиться в очень старом Web-браузере, который, возможно, не поддерживает формат Optimized JPEG. Но почти каждый браузер в последние несколько лет поддерживает этот формат.

Качество сжатия. Чем хуже качество изображения, тем плотнее его может сжать Photoshop. В диалоговом окне Save as JPEG вам предлагается всего лишь 12 уровней сжатия JPEG, а в диалоговом окне Save For Web – 100. Четыре варианта выбора во всплывающем списке Quality ( Low, Medium, High и Maximum ) – это просто предустановки для значений находящегося справа поля Quality. (Эти варианты соответствуют числовым значениям 10, 30, 60 и 80.) Вы можете изменять значение в диапазоне от 1 до 100 (100 соответствует наиболее высокому качеству и минимальной величине сжатия).

Если вы "трясетесь" над вашими изображениями и не хотите никакого ухудшения, то вам здесь делать нечего. Помните, что обычно без ухудшения качества вам отсюда не выйти. Дэвид редко использует для Web-изображений значение Quality выше 50%, хотя вряд ли использовал бы значения ниже 90 (значение 9 или 10 в диалоговом окне Save As ) для допечатной подготовки изображений. В конечном итоге все определяется методом проб и ошибок.

Progressive. Как и в случае флажка Optimized, мы всегда оставляем включенным флажок Progressive. В этом случае Web-браузеры сначала выводят на экран версию изображения с низким разрешением, а затем заменяют ее версией с высоким разрешением. Странное дело, но JPEG-изображения с параметром Progressive лишь чуть меньше, чем без этого параметра, поэтому его стоит включать только для вывода на очень старых браузерах.

Blur. Чем больше уровень сжатия JPEG-изображений, тем больше "блочность" в их представлении на экране. Эти блочные артефакты раздражают глаз и появляются в первую очередь вокруг высококонтрастных краев изображения. Для борьбы с этими артефактами требуется небольшое размытие изображения, чтобы края выделялись в меньшей степени. Для этого можно применить к изображению фильтр Gaussian Blur до открытия диалогового окна Save For Web или ввести значение размытия в поле Blur этого окна. Оба варианта действуют одинаково, и если вы собираетесь применить размытие (мы редко делаем это – разве что для миниатюр), то мы рекомендуем задать его в этом диалоговом окне.

ICC Profile. Флажок ICC Profile указывает Photoshop, нужно ли встраивать профиль вашего рабочего пространства RGB в JPEG-изображение. Вот наше мнение. Обычно при этом добавляется менее 1 К данных, и раньше или позже все Web-браузеры будут поддерживать управление цветом в стандарте ICC. Так почему бы не держать включенным этот флажок? Более подробные сведения об ICC-профилях и управлении цветом см. в лекции 5, "Параметры цвета". Отметим, что если вы уже преобразовали изображение в пространство sRGB, то вам не требуется встраивать профиль: в настоящее время, если не встроено никакого профиля, в Web-браузерах предполагается, что изображение находится в режиме sRGB.

Matte. JPEG-изображения всегда непрозрачны и всегда имеют прямоугольную форму. С этим ничего не сделаешь; если вам нужна поддержка прозрачности, используйте формат GIF или PNG. Так что же происходит, если изображение находится в слое, включающем прозрачность? Photoshop заполняет все прозрачные пикселы цветом, который выбран вами в поле Matte. Обычно требуется, чтобы цвет поля Matte совпадал с цветом фона изображения или фона вашей Web-страницы. Отметим, что выбранный вами цвет может слегка измениться после преобразования в JPEG, особенно при высоком уровне сжатия; проверяйте значения RGB и Hex внизу диалогового окна Save For Web.

Формат GIF

Если формат JPEG предпочтителен для сохранения сканированных изображений "фотографического" качества, то GIF в настоящее время считается форматом для всей остальной Web-графики:

Теоретически спецификации GIF допускают использование изображений с 24-битовым цветом, но на практике ни одна программа этого не поддерживает, поэтому GIF-файлы всегда сохраняют в 8-битовом режиме индексированных цветов (см. "Индексированные цвета", лекции 3, "Основые сведения об изображении"). То есть, изображение не может содержать более 256 цветов. Зато здесь можно указать, какие именно 256 цветов вы хотите использовать.

Оставайтесь в RGB. Прежде чем сохранять изображения в формате GIF, большинство пользователей преобразуют их из RGB в режим Indexed Color (выбирая эту команду из подменю Image > Mode ). Здесь нет ничего неверного, но диалоговое окно Save For Web делает такой подход устаревшим. Пусть изображение остается в RGB, а Photoshop выполнит преобразование в режим Indexed Color в процессе сохранения файла. Режим RGB гораздо эффективнее и надежнее, так как предлагает более широкие возможности для редактирования.

Ниже приводятся различные параметры, которые можно использовать при сохранении GIF-изображения с помощью диалогового окна Save For Web (см. рис. 18.8)

Lossy (С потерями). Нет, мы не нарушаем правил создания GIF-изображений: GIF – это по-прежнему формат без потерь (он не снижает качества изображения, как это происходит с JPEG). Параметр Lossy в диалоговом окне Save For Web позволяет снизить качество изображения до его сохранения в GIF-файле. Photoshop использует несколько характеристик алгоритма сжатия в формате GIF и, ухудшая качество изображения с помощью определенных "интеллектуальных" методов, позволяет получать дополнительный уровень сжатия. Это наиболее полезно при сохранении сканированных фотоизображений в GIF вместо JPEG (например, если вы хотите сохранить прозрачность частей изображения). Повышая величину в поле Lossy до значения 10 или 20, можно получить существенное увеличение степени сжатия практически без визуальных шумов.

Метод снижения количества цветов. GIF-изображения сохраняются в режиме Indexed Color, то есть с использованием не более чем 256 цветов. Преобразуя RGB-изображение или снижая количество цветов в изображении с индексированным цветом, вы должны сообщить Photoshop, какой метод снижения количества цветов нужно использовать (это те же методы, что и в диалоговом окне Indexed Color ). В Photoshop 5.5 было введено два алгоритма – Selective (Выборочный) и Perceptual (По восприятию), – которые аналогичны методу Adaptive (Адаптивный), но чуть лучше. Если метод Adaptive выбирает цвета изображения, основываясь на частоте их появления в этом изображении, то Perceptual выбирает цветовую палитру, основываясь на их восприятии глазом; в частности, это метод создает намного более приятные переходы между цветами, поэтому он наиболее подходит для сканированных фотографических изображений. Метод Selective несколько лучше для изображений, которые имеют резкие высококонтрастные края, как, например, "синтетические" изображения (из Illustrator или FreeHand). Мы вряд ли будем когда-либо использовать метод Adaptive.

Если вам нужно использовать Web-устойчивую ("интернетовскую") палитру цветов, выберите из этого всплывающего меню вариант Web. Или, если вы уже встроили собственную палитру цветов, то можете загрузить ее, выбрав команду Load Color Palette из всплывающего меню рядом с вкладками Color Table и Image Size (если бы в Adobe дали названия этим меню, нам было бы намного легче объяснять вам все это).

Подсказка. Приоритетные цвета. Если цвета какой-то части вашего изображения интересуют вас больше, чем цвета других областей, то здесь нет никаких проблем. Приблизительно выделите нужную область инструментом "область" или "лассо" и сохраните это выделение в палитре Channels (см. лекцию 14, "Выделения"). Затем в диалоговом окне Save For Web щелкните на маленькой кнопке рядом с всплывающим меню Color (где выбирали метод Adaptive, Perceptive и т.д.). Photoshop позволит вам выбрать сохраненный канал и воссоздаст соответствующую палитру цветов, что даст предпочтение цветам нужного участка).

Colors. Чем меньше цветов в изображении, тем больше сплошных или повторяющихся участков в этом изображении и тем выше уровень сжатия, который можно получить. Очень немногим GIF-изображениям требуются все 256 цветов; на самом деле трудно найти изображение, которое бы не выглядело прилично на экране даже с 64 цветами. Отметим, что цвета показаны в цветовой таблице ( Color Table ) в правой нижней части диалогового окна (см. "Color Table" ниже в этой лекции).

Dither. Снижение количества цветов в изображении не всегда дает приемлемое качество, и часто улучшению результатов способствует небольшое размытие конечной палитры цветов. В Photoshop всегда включались средства сглаживания ц21 Diffusion и Pattern в диалоговых окнах Indexed Color (первое из них хорошее, второе – плохое). Новым стало средство Noise. Результаты аналогичны варианту Diffusion (только чуть больше "шума"); однако вам следует использовать вариант Noise, если вы также разбиваете изображение на фрагменты (см. "Фрагментирование изображений" ниже в этой лекции). Причиной этого является способ, который используется для случайного размытия в варианте Diffusion (Photoshop учитывает каждый пиксел и окружающие его пикселы; если разбить изображение на фрагменты, значения пикселов могут измениться и размытие уже не будет выглядеть должным образом).

Если выбрать метод Diffusion, то нужно также задать значение в поле Dither. Лично мы считаем, что если уж вы собрались вообще применить это средство, то, видимо, нужно выбирать значение в 70-80 процентах площади. Однако выбор за вами, и он фактически зависит от самого изображения.

Transparency (Прозрачность). Если изображение содержит прозрачные пикселы (то есть не содержит непрозрачного фонового слоя), вы можете указать с помощью флажка Transparency, нужна ли прозрачность этих пикселов в конечном изображении. Если этот флажок отключен, все прозрачные пикселы заполняются цветом поля Matte. Если в поле Matte выбран вариант None, то Photoshop задает для этих пикселов белый цвет.

С другой стороны, если флажок Transparency включен, Photoshop оставляет полностью прозрачные пикселы прозрачными и выполняет переход от полупрозрачных пикселов к цвету поля Matte. Это очень полезно, если нужно встроить GIF-изображение в цвет фона вашей Web-страницы (см. рис. 18.9). Если в поле Matte выбран вариант None, Photoshop просто удаляет все частично прозрачные пикселы, и вы получаете жесткое изображение с несглаженными краями.

(рис 18.9) Прозрачность в GIF-изображениях (Photoshop выполняет переход от краевых пикселов к цвету поля Matte, что позволяет обеспечить в дальнейшем незаметное слияние с фоном Web-страницы)

Важно отметить, что если изображение не содержит прозрачных пикселов, то вы не можете создать прозрачные пикселы в диалоговом окне Save For Web. (Это можно было сделать в диалоговом окне GIF 89a Export, но теперь уже нет.)

Interlaced. В то время как установка флажка Progressive для JPEG делает изображение чуть меньше (факт, который ставит нас в тупик, поскольку изображение не кажется изменившимся), установка флажка Interlaced (Чередование) действительно делает изображение чуть больше. Поэтому мы устанавливаем этот флажок, только если изображение раскрывается постепенно (как жалюзи), что действительно лучше для зрителя. Например, мы редко используем это средство для кнопок, но обычно используем для изображений карт, чтобы дать возможность пользователю щелкнуть на какой-то области карты, прежде чем изображение раскроется полностью.

Web Snap. Может, мы ошибаемся, но средство Web Snap кажется нам бесполезным. Смысл состоит в том, что при увеличении процента в поле Web Snap некоторые цвета изображения будут заменяться цветами "интернетовской" палитры цветов. К сожалению, вы не можете контролировать, какие цвета подвергаются изменениям. Мы никогда не используем это средство; если мы хотим ограничить цвета "интернетовской" палитрой, то делаем это вручную в секции Color Table.

Color Table. Color Table (Таблица цветов) не только показывает, какие цвета появятся в конечном изображении, но также позволяет изменять их или препятствовать их изменению. Вам редко требуется эта возможность, но если дважды щелкнуть на любом образце цвета, Photoshop позволяет изменить его цвет (используя стандартное окно Color Picker ). Более часто используется изменение цвета до ближайшего "интернетовского" цвета. К счастью, в Photoshop это очень просто: выделите нужный цвет (или несколько цветов, удерживая клавишу (Command) во время щелчков) и щелкните на кнопке Snap to Web-safe Color (Изменение на "интернетовский" цвет) ; это кнопка в форме небольшого кубика. "Интернетовские" цвета появляются с белой точкой в своих центрах. Всплывающее меню рядом с заголовком Color Table позволяет добавлять и удалять цвета, выбирать определенные цвета и (что лучше всего) управлять тем, как Photoshop отображает на экране цветовые палитры. Обычно мы выбираем режимы сортировки по цветовому тону (Hue) или яркости (Luminance), поскольку они наиболее удобны для распознавания цветов.

Подсказка. Анимация слоев. Photoshop не позволяет создавать GIF-анимаций, но дает возможность строить отдельные кадры, которые потом вы можете объединить в программе ImageReady.

(рис 18.10) Команда Optimize to File Size

PNG-изображения

Имеется очень немного параметров, которые можно изменять при сохранении файлов в формате PNG-24 (главное – выбрать, нужно ли включать области с прозрачностью), а параметры для формата PNG-8 почти идентичны параметрам для формата GIF (см. рис. 18.11).

Как мы уже говорили в лекции 16, "Хранение изображений", формат PNG очень хорош, но пока не слишком широко используется и не полностью поддерживается Web-браузерами. Кроме того, PNG-изображения обычно больше своих GIF- или JPEG-аналогов, поэтому должна быть по-настоящему веская причина к их использованию (а ее пока что нет).

Другие средства диалогового окна Save For Web

Прежде чем перейти к другим аспектам возможностей Photoshop для Web, следует упомянуть о еще нескольких средствах диалогового окна Save For Web.

Перемещение. Если посмотреть на диалоговое окно Save For Web в режиме 4-Up, окно каждого изображения будет занимать слишком мало места. К счастью, вы можете (и должны) перемещать вашу графику, чтобы проверять степень ухудшения качества изображения на различных участках. Во-первых, вы можете использовать инструмент "рука" (нажмите H ), щелкая и перетаскивая любое изображение. Если перетаскивать одно изображение, остальные перемещаются тоже.

Во-вторых, вы можете увеличивать и уменьшать масштаб просмотра изображения, изменяя масштаб просмотра в процентах в нижнем левом углу диалогового окна Save For Web (хотя обычно быстрее использовать комбинацию (Control)-"щелчок" или щелчок правой кнопкой мыши на изображении и изменить масштаб просмотра в контекстно-зависимом меню). Уменьшение масштаба редко используется, но иногда стоит увеличить масштаб, чтобы лучше видеть результаты преобразования в формат JPEG или GIF. Отметим, что вы можете также изменять размеры диалогового окна Save For Web, растягивая нижний правый угол этого окна.

Image Size. Если нужно, чтобы конечное Web-изображение имело меньший размер, чем версия с высоким разрешением, которую вы получили, используйте диалоговое окно Image Size для даунсэмплинга изображения перед входом в Save For Web или вкладку Image Size в самом диалоговом окне Save For Web. В обоих случаях выполняется одно и то же. Единственным отличием является то, что в Save For Web вам предлагаются размеры только в пикселах, а результат всегда будет иметь разрешение 72 ppi. Это нормально, поскольку дюймы, миллиметры и пики ничего не означают в среде Web, где мониторы работают при различных разрешениях.

Browser Dither. Конечно же, вы используете 24-битовый монитор, но ваши зрители, возможно, нет. Осталось немного пользователей, до сих пор использующих 8-битовые цветные мониторы, и для ваших потрясающих цветных изображений выполняется размытие с использованием 256 цветов в цветовой палитре их Web-браузеров. Если вас интересует, что видят эти люди, включите параметр Browser Dither во всплывающем меню без названия вверху справа от области изображений диалогового окна Save For Web (или, еще лучше, просто выберите его из контекстно-зависимого меню). Вы можете включать (или отключать) параметр Browser Dither единовременно только для одного изображения. Для получения наилучшего результата включите его, затем выключите и затем снова включите, чтобы увидеть варианты изображения "до и после".

Download speed (Скорость загрузки). Для каждого изображения в диалоговом окне Save For Web выводится приблизительное время, требующееся для его загрузки при скорости 28,8 Кбит/с. Но если вы совершенно уверены, что большинство вашей аудитории работает при скорости 56,6 Кбит/с, тогда измените эту установку во всплывающем меню вверху диалогового окна (или в контекстно-зависимом меню). Но если честно, то мы редко следим за этим показателем, поскольку слишком много факторов влияет на время загрузки (загрузка на сервере, скорость процессора, космическое излучение...).

Gamma. Как мы уже говорили выше, на мониторах Windows-машин изображения получаются обычно темнее, чем на мониторах Macintosh. Вы можете имитировать это, включив параметр Standard Windows Color (имитируется гамма 2,2) или Standard Macintosh Color (имитируется гамма 1,8), для чего используется всплывающее меню вверху диалогового окна или контекстно-зависимое меню. Но дело в том, что многие пользователи Macintosh калибруют свои мониторы для гаммы 2,2, а некоторые пользователи Windows – для гаммы 1,8. Поэтому, когда дело доходит до цветовой и тоновой коррекции для Web, здесь можно легко ошибиться.

Пусть Photoshop пишет ваш HTML-код

Кому в наше время хочется писать HTML-коды? Только не нам. Мы занимались этим в свое время, а теперь пусть этим занимается компьютер. К счастью, Photoshop в диалоговом окне Save For Web может создает HTML-коды, которые описывают наши изображения.

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

Но имеется лучший способ: после выбора изображения, которое вы хотите сохранить, и щелчка на кнопке OK появляется диалоговое окно Save Optimized As, где можно задать имя файла и указать место для его сохранения (см. рис. 18.12). Кроме того, можно выбрать из всплывающего меню Format вариант HTML and Images. (Если вы сохраняете фрагменты, это действительно важно, см. "Фрагменты" в следующем разделе.) Затем вы можете открыть HTML-файл в текстовом редакторе, чтобы скопировать и вставить нужную информацию.

Другие Web-средства

В Adobe Photoshop имеется много других средств получения высококачественных Web-изображений. И действительно, с каждой новой версией различия между ImageReady и Photoshop становятся все менее ощутимыми. В Photoshop 5.5 Adobe включила в Photoshop диалоговое окно Save For Web из ImageReady; в Photoshop 6 был добавлен инструмент "фрагмент" из ImageReady.

В этом разделе мы рассмотрим разбиение изображения на фрагменты, преобразование изображений в индексированные цвета, выбор Web-устойчивых ("интернетовских") цветов и создание "галерей" Web-страниц для просмотра ваших фотографий. Конечно, это не все Web-средства Photoshop, но, как мы считаем, наиболее важные.

Фрагменты

Не все части изображения равнозначны, и не все части требуют одинакового внимания. Часто бывает, что определенные части изображения можно сжать в значительно большей степени (и с большей степенью ухудшения качества), чем другие. А некоторые части используются как rollover-области (они изменяются, когда поверх них в Web-браузере движется курсор), области анимации или Web-ссылок. В любом из этих случаев вам нужно предусмотреть разбиение вашей графики на меньшие части с помощью инструмента Photoshop "фрагмент". После этого при сохранении изображения с помощью диалогового окна Save For Web каждый фрагмент сохраняется как отдельный файл на диске с его собственными параметрами сжатия. А если открыть такое фрагментированное изображение в ImageReady, то вы можете сделать каждый фрагмент rollover-областью или динамической частью другого типа. (И снова повторим, что мы не рассматриваем ImageReady и динамические части в этой лекции.)

Создание фрагментов (и разбиение на фрагменты). В Photoshop имеется два средства создания фрагментов: инструмент "фрагмент" (он содержится в панели инструментов и похож на небольшое лезвие ножа; для его быстрого выбора нажмите (K) ) и средство New Layer Based Slice в меню Layer.

Изображение не может содержать ровно один фрагмент: как бы вы ни создавали фрагмент, Photoshop автоматически разбивает на фрагменты остальную часть изображения. Например, если вы создали квадратный фрагмент в середине изображения, Photoshop автоматически добавит четыре других фрагмента для заполнения области вокруг первого фрагмента (см. рис. 18.13). Созданный вами фрагмент называется "фрагментом пользователя", и он несколько отличается от других фрагментов на экране: фрагменты пользователя имеют непрерывные границы, а автоматические фрагменты – пунктирные. При изменении или добавлении пользовательского фрагмента Photoshop автоматически изменяет конфигурацию автоматических фрагментов.

Как изменить фрагмент после того, как вы его создали? Используйте инструмент "выделение фрагмента" (Slice Selection). Этот инструмент скрыт позади инструмента "фрагмент" в панели инструментов; вы можете получить его, нажав (Shift) + (K), или временно, удерживая клавишу (Command) во время выбора инструмента "фрагмент". Инструмент "выделение фрагмента" позволяет перемещать фрагмент (щелкните внутри фрагмента и перетащите его) или изменять границы фрагмента (перетаскивайте угловые или граничные маркеры фрагмента). Однако вы можете редактировать или перемещать только пользовательские фрагменты. Если вам нужно преобразовать автофрагмент в пользовательский фрагмент, выделите его инструментом "выделение фрагмента" (здесь уже нельзя использовать прием с клавишей (Command) ) и затем щелкните на кнопке Promote to User Slice (Преобразовать в пользовательский фрагмент) в панели Options.

Подсказка. Минимизация количества фрагментов. Основной проблемой автоматически создаваемых фрагментов является возникновение слишком большого числа таких фрагментов (по сравнению с продуманным использованием инструмента "фрагмент"). А чем больше фрагментов, тем больше файлов, за которыми приходится следить на диске и тем больше времени занимает загрузка изображения в браузер. Мы часто начинаем процесс фрагментирования с получения фрагментов на базе слоев, но затем изменяем границы фрагментов, когда становится ясно, что изображение уже не изменится. Чтобы изменить границы фрагмента, нужно щелкнуть на этом фрагменте инструментом "выделение фрагмента" и затем щелкнуть на кнопке Promote to User Slice в панели Options. Конечно, после этого фрагменты уже не будут привязаны к слоям (см. рис. 18.14).

Снижение количества фрагментов

(рис 18.14) После выравнивания границ фрагментов мы получаем только девять фрагментов

Кстати, после создания своих фрагментов вы можете зафиксировать их на месте с помощью команды View > Lock Slices (Фиксировать фрагменты). После этого вы (или ваш неосторожный коллега) уже не сможете случайно переместить границы фрагментов или изменить их размеры.

Чтобы удалить какой-либо фрагмент, щелкните на нем инструментом "выделение фрагмента" и нажмите (Delete) или (Backspace). Если вам нужно удалить все фрагменты, выберите команду View > Clear Slices (Удалить фрагменты). (Нет, мы не имеем представления, почему эти команды поместили в меню View ; наверное, в Adobe не могли решить, куда бы еще поместить их.)

Диалоговое окно Slice Options. В то время как для создания динамических участков, таких как rollover-области и анимации, требуется программа ImageReady, вы можете контролировать каждый фрагмент и добавлять некоторые простые операции непосредственно в Photoshop, выделив фрагмент инструментом "выделение фрагмента" и щелкнув на кнопке Slice Options (Параметры фрагмента) в панели Options (см. рис. 18.15). (И еще быстрее: удерживая клавишу (Command), дважды щелкните на фрагменте инструментом "фрагмент".) Ниже приводится краткий обзор параметров этого диалогового окна.

Значения, которые вы задаете в диалоговом окне Slice Options, сохраняются вместе с вашим изображением Photoshop, а также считываются в ImageReady, если вы откроете изображение в этой программе. Но вы по-прежнему должны экспортировать изображение вместе с HTML, чтобы эти значения действовали должным образом.

Сохранение фрагментов. В старые добрые времена мы обычно разбивали изображения вручную, используя инструмент "рамка", затем записывали на бумагу размеры в пикселах для каждого фрагмента и после этого объединяли их в таблицу, используя вручную написанные коды HTML. И нам это нравилось! (На самом деле, нет, но у нас не было другого выбора.) К счастью, теперь Photoshop может писать коды HTML за нас, делая весь процесс безболезненным и очень быстрым. Просто нужно сохранять фрагментированное изображение с помощью диалогового окна Save For Web, как описано выше в этой лекции, проследив за тем, чтобы в диалоговом окне Save Optimized As во всплывающем меню Format был выбран вариант HTML and Images.

Однако при первом открытии диалогового окна Save For Web вы должны выбрать инструмент "выделение фрагмента" (нажмите клавишу K ), щелкнуть на каждом пользовательском фрагменте и указать, как вы хотите его оптимизировать (GIF или JPEG, количество цветов и т.д.). Вы можете также щелкнуть на одном из автофрагментов и выбрать параметры его оптимизации (все автофрагменты будут оптимизированы с этими же параметрами).

Прежде чем сохранить фрагменты на диске (или просмотреть HTML, щелкнув на кнопке "превью" ( Preview ) внизу диалогового окна Save For Web ), возможно, потребуется щелкнуть на кнопке Output Settings. В диалоговом окне Output Settings (Параметры вывода), см. рис. 18.16, можно контролировать, как Photoshop будет записывать HTML-код на диск, включая присваивание имени каждому фрагменту, для которого вы еще не задали имя в окне Slice Options, как будут сконфигурированы фрагменты – в таблице HTML или с помощью тегов CSS, а также целый ряд других параметров. В основном эти параметры не представляют сложностей или описываются своим названием. Однако ниже мы приводим некоторые параметры, которые требуют комментария.

Formatting. Существует определенный тип людей, которых глубоко интересует, как в точности записывать предложения HTML. Например, как пишутся определенные слова: прописными или строчными буквами либо с прописной буквы. Вы можете задавать информацию этого типа в секции Formatting диалогового окна Output Settings. Нам уже приелись все эти вещи, поэтому мы просто игнорируем эту секцию.

(рис 18.16) Output Settings – это фактически четыре диалоговых окна

View As. Если изображение подготавливается для фона (картинка, которая заполняет в виде узора все окно Web-браузера), то вам следует выбрать вариант View As из вкладки Background диалогового окна Output Settings (для быстрого перехода в эту вкладку нажмите (Command) + (2) ). Но фрагментированное изображение нельзя сделать фоновым изображением, поэтому параметры View As недоступны, если у вас имеются фрагменты. Конечно, все это относится к случаю, когда требуется, чтобы программа Photoshop написала HTML-текст, который часто не нужен, если вы просто создаете фоновое изображение.

Background. В секции с именем Background (внутри вкладки Background этого диалогового окна) можно указывать программе Photoshop, что следует использовать как фоновое изображение в HTML-коде, который она создает. Например, если выбрать какой-либо цвет из всплывающего списка Color, Photoshop помещает изображение (даже если оно фрагментированное) поверх этого цвета. На самом деле эти данные не имеют смысла, если вы планируете помещать это фрагментированное изображение на другую Web-страницу с помощью GoLive или Dreamweaver.

Saving Files. Вкладка Saving Files диалогового окна Output Settings (для быстрого перехода в эту вкладку нажмите (Command) + (3) ) позволяет вам точно контролировать, как Photoshop именует каждый файл и куда помещает эти файлы. Но имена файлов в секции File Naming больше относятся к динамическим изображениям, таким как rollover-области, создаваемые в ImageReady. Если мы что-то изменяем здесь, так это имя папки, где сохраняются файлы (имена изображений "по умолчанию" это замечательно, но мы часто используем другие имена в зависимости от того, что делаем: если отключить флажок Save Images In, то Photoshop просто сохраняет изображения и HTML-коды в одной папке.

Slices (Фрагменты). Это вкладка диалогового окна Output Settings, где указывается, как Photoshop именует фрагменты, когда сохраняет их на диске (для быстрого перехода в эту вкладку нажмите (Command) + (4) ). И здесь мы обычно оставляем значения по умолчанию, но вы можете изменять их, если выработали определенный алгоритм именования. Отметим, что мы долго не могли разобраться с этими параметрами, пока не поняли, что вторая строка соединена с первой небольшим знаком "+".

Диалоговое окно Output Settings можно вызвать из диалогового окна Save For Web или Save Optimized As (оно появляется после щелчка на кнопке OK в Save For Web ).

Индексированные цвета

Как мы уже говорили в лекции 3, "Основные сведения об изображении", и в начале этой лекции, GIF-изображения и много другой графики, предназначенной для игр и мультимедиа, сохраняется в режиме Indexed Color. Файлы таких изображений занимают мало места (почти как изображения в режиме grayscale), они часто допускают высокую степень сжатия и они прекрасно подходят для старых 8-битовых мониторов, которые еще используются некоторыми пользователями.

Ранее мы говорили, что старый подход, предусматривающий преобразование изображений в режим Indexed Color до их сохранения в GIF-файлах, устарел, поскольку более удобно оставлять изображение в режиме RGB и использовать диалоговое окно Save For Web, чтобы преобразовывать его в ходе процесса. Однако многим пользователям все еще требуется работать в Photoshop с изображениями, имеющими индексированные цвета, и эта программа содержит два средства, помогающих справляться с этим процессом: диалоговое окно Indexed Color и диалоговое окно Color Table. Существует также несколько способов получения Web-устойчивых ("интернетовских") цветов и работы с ними, которые мы рассмотрим в следующем разделе.

Диалоговое окно Indexed Color. Вы можете преобразовывать RGB- или grayscale-изображение в индексированные цвета с помощью команды Image > Mode > Indexed Color. В результате появляется диалоговое окно Indexed Color (см. рис. 18.17). Многие параметры здесь действуют точно так же, как и в диалоговом окне Save For Web (см. раздел "Формат GIF" выше в этой лекции). Однако, имеется несколько специальных средств, о которых нужно говорить отдельно.

Preview (Превью). Когда была выпущена версия Photoshop 5.5, мы обрадовались, что фирма Adobe наконец-то включила флажок Preview в диалоговое окно Indexed Color, позволяющий заранее видеть, что будет происходить с изображением. Существует очень немного случаев, когда нужно отключать этот флажок.

Palette (Палитра). Во всплывающем меню Palette содержится ряд различных возможностей, включая методы снижения количества цветов Perceptual (По восприятию), Selective (Выборочный) и Adaptive (Адаптивный) в двух версиях – "Local" и "Master". Мы имеем основания говорить, что нет никакого смысла использовать в Photoshop версию Master: это раздражающий пережиток из ImageReady. Если вы хотите использовать мастер-палитры (применяемые сразу к нескольким изображениям), то лучше это делать в ImageReady. И снова повторим, что мы обычно используем вариант Perceptual для сканированных фотографических изображений и вариант Selective для "синтетических" изображений с резкими краями.

Transparency (Прозрачность). Любые прозрачные пикселы вашего изображения могут также сохранять прозрачность и в конечном изображении с индексированным цветом. Но если в изображении нет прозрачных пикселов, отключите флажок Transparency в диалоговом окне Indexed Color, иначе Photoshop добавит цветовой образец к вашей таблице цветов и укажет, что этот образец является прозрачным цветом (взяв образец, который было бы лучше использовать для какого-то цвета).

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

Объекты со сглаженными и несглаженными краями

(рис 18.18) На цветном фоне сглаженный вариант выглядит плохо. Несглаженный вариант воспринимается нормально

Forced (Принудительно). Всплывающий список Forced позволяет вам принудительно включать определенные цвета в цветовую палитру изображения. Например, если выбрать вариант по умолчанию Black and White (Черный и белый), то Photoshop гарантирует присутствие этих двух цветов в палитре. Это особенно важно, если вы используете очень небольшое количество цветов или хотите фиксировать в палитре определенный цвет и не изменять его. Кроме Black and White, в список Forced включены варианты Primaries (основные цвета; в палитру принудительно включаются красный, зеленый, синий, голубой, пурпурный, желтый, черный и белый), Web (что гарантирует включение в палитру всех 216 Web-устойчивых цветов) и Custom (заказной, что позволяет указывать ваши собственные цвета, которые обязательно должны быть в палитре конечного изображения).

Редактирование цветов. Каждому пикселу в изображении индексированных цветов назначается номер от 0 до 255. А сам цвет придается по результатам сравнения номера пиксела с номерами цветовой таблицы преобразования (clut). Программа выполняет все это автоматически, не требуя вашего участия. Один из доводов в пользу преобразования в режим Indexed Colors сводится к тому, что здесь можно изменять изображения путем редактирования таблицы clut. Вызовите ее командой Image > Mode > Color Table, щелкните на любом из цветовых образцов и отредактируйте его. При больших таблицах, включающих более 16 цветов, процесс этот довольно громоздок, но в некоторых случаях редактирование таблицы цветов дает очень хороший эффект (см. подсказку "Замена индексированных цветов" далее в этой лекции).

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

(рис 18.20) Замена индексированных цветов (Щелкните на одном из образцов, чтобы изменить его цвет. Во всем изображении этот цвет заменяется новым)

Откройте GIF-изображение и выберите команду Image > Mode > Color Table.

Щелкните на образце цвета, который вы хотите изменить и выберите в палитре Color Picker новый цвет (или введите значения RGB). Возможно, вы предпочтете, чтобы новый цвет отображался в Web устойчиво.

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

Кнопкой ОК сохраните результат.

Разумеется, способ это функционирует лучше, если в палитре совсем мало цветов.

Web-устойчивые цвета

Что такое Web-цвет? В Photoshop этот термин означает две разные вещи – в зависимости от места, где вы его ищете. Photoshop может представлять "Web-цвет" в палитре Info (выберите команду Palette Options из всплывающего меню этой палитры или щелкните на одном из маленьких треугольников в палитре Info, чтобы изменить ее вид). В этом режиме палитра Info показывает шестнадцатеричные эквиваленты ваших RGB-цветов (см. рис. 18.21).

(Для тех, кто не знает, но интересуется: шестнадцатеричная система счисления – это числа по основанию 16, где после числа 9 следуют A, B, C, D, E и F, представляющее число 15. Поэтому цифры 00 соответствуют десятичному нулю, а FF – 255.)

Второй раз термин "Web-цвет" используется в диалоговом окне Photoshop Color Picker, где можно установить флажок Only Web-Colors (Только Web-цвета). На самом деле это означает: "Только Web-устойчивые ("интернетовские") цвета". Или, еще точнее, "Я хочу выбирать цвета, которые не будут изменяться при отображении в Web-браузере на старых 8-битовых мониторах".

Web Photo Gallery

Последнее Web-ориентированное средство, которое мы рассмотрим, это Web Photo Gallery в подменю File > Automate. Оно, как и другие автоматизированные средства, выполняет задачу, которую можно было бы выполнить вручную, но это было бы настолько утомительно и скучно, что вы могли бы упасть со стула от этой монотонности. Web Photo Gallery создает Web-страницу, заполненную миниатюрами изображений (см. рис. 18.22). Щелчок на одной из этих миниатюр является автоматической ссылкой на более крупную версию этого изображения.

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

Создать такую "галерею" очень легко.

После щелчка на кнопке OK Photoshop обрабатывает каждое изображение в папке(ах) и сохраняет их как JPEG-файлы (в это время вы можете передохнуть и выпить чашечку кофе). Конечные результаты находятся в трех папках – для миниатюр, для больших версий изображений и для страниц HTML-кода, с помощью которых выводятся большие версии изображений, плюс два других текстовых файла. Вы можете удалить файл с именем UserSelection.txt. Это просто запись значений параметров, которые вы использовали в диалоговом окне Web Photo Gallery (мы не знаем, зачем они сохраняются, но это должна быть действительно веская причина).

Издательское дело в будущем

На конференции Saybold в 1997 году Тим Гилл из Quark в шутку заявил, что "в отличие от Web, у печатной индустрии есть одно важное преимущество – она позволяет делать деньги". Хотя основным двигателем Web-лихорадки является опасение отстать от конкурентов: люди начинают открывать бизнес в Web, это позволяет идти в ногу со временем, а иногда даже и приносит прибыль. Какова бы ни была причина вашего выхода в Web, одним из основных условий успеха остается производство изображений – компактных, мобильных и к тому же обладающих художественными достоинствами. Photoshop предлагает все средства для достижения этой цели. А что касается того, как на этом делать деньги: если бы мы знали, разве стали бы писать эту книгу?