Иллюстрированный самоучитель по Adobe Photoshop 7

Заполнение фона повторяющимся узором

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

Программа ImageReady позволяет преобразовать изображение в HTML-файл элемента "черепицы", а затем использовать этот файл в качестве фона какого-либо изображения (см. раздел "Использование HTML-файла в качестве фона"). Фон будет отображаться при предварительном просмотре файла в браузере. Также можно указать цвет вместо "черепицы" для заливки фона Web-страницы.

Создание файла "черепицы"

  1. В программе ImageReady откройте изображение, которое будет использоваться в качестве "черепицы". По возможности выберите низко контрастное изображение с близкими оттенками цветов, так чтобы картинки и текст, загружаемые поверх повторяющегося узора, было легко рассматривать и читать. Если изображение содержит ломтики, то воспользуйтесь командой Slices › Delete All (Ломтики › Удалить все).
  2. Кадрируйте изображение, если необходимо использовать только его часть.
  3. Выполните команды Filter › Other › Tile Maker (Фильтр › Другие › Создать черепицу) – см. рис. 23.175.
  4. Включите опцию Blend Edges (Совместить края), чтобы края каждого элемента "черепицы" перекрывались с соседним элементом. Введите значение в процентах (от 1 до 20) в поле Width (Ширина), чтобы определить степень наложения краев мозаичных элементов (рис. 23.175)

    Иллюстрированный самоучитель по Adobe Photoshop 7 › Работа с Web и программирование Imageready › Заполнение фона повторяющимся узором
    Рис. 23.175. Диалоговое окно Tile Maker

    Иллюстрированный самоучитель по Adobe Photoshop 7 › Работа с Web и программирование Imageready › Заполнение фона повторяющимся узором
    Рис. 23.176. "Черепица" с перекрывающимися краями

    Иллюстрированный самоучитель по Adobe Photoshop 7 › Работа с Web и программирование Imageready › Заполнение фона повторяющимся узором
    Рис. 23.177. Узор, созданный без применения фильтра Tile Maker: края элементов не перекрываются

  5. Установите флажок Resize Tile to Fill Image (Изменять размер "черепицы" при заполнении изображения), чтобы размер "черепицы" соответствовал текущему размеру изображения. Если этот флажок не будет установлен, то элемент "черепицы" уменьшится в размерах в соответствии со значением в поле Width (Ширина). На рис. 23.176 показан узор, созданный при установленной опции Blend Edges (Совместить края), значении в поле Width (Ширина) равном 10% и установленном флажке Resize Tile to Fill Image (Изменять размер "черепицы" при заполнении изображения). Сравните его с узором, показанным на рис. 23.177. Альтернативный вариант – установите флажок Kaleidoscope Tile (Калейдоскоп), чтобы программа создала абстрактное изображение из исходного.
  6. Щелкните по кнопке ОК.
  7. Выполните команду File › Save Optimized (Файл › Сохранить с оптимизацией) либо нажмите клавиши CTRL + ALT + S, измените имя файла, выберите папку, в которой он будет храниться, и щелкните по кнопке Save (Сохранить).
Если Вы заметили ошибку, выделите, пожалуйста, необходимый текст и нажмите CTRL + Enter, чтобы сообщить об этом редактору.