Adobe Photoshop

Как и обещал, я расскажу об инструменте Slice, целях и способах его применения.

С помощью этого инструмента холст можно разделить на множество прямоугольных областей, давайте назовём их фрагментами. При создании одного такого фрагмента всё остальное пространство документа автоматически полностью делится на наименьшее количество фрагментов. Настройки (стили) у инструмента Slice те же, что и у Marquee Tool. Кнопка Slices From Guides делит документ по направляющим, их можно создать с помощью меню View->New Guide, задав ориентацию и координату направляющей.

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

Вернёмся к инструменту, вернее к группе. Она содержит также и Slice Select Tool. Он нужен для выделения и операция над фрагментами. Фрагмент, созданный вами, всё же немного отличается от остальных при выделении – автоматические выделяются почти незаметно, красным пунктиром.

Первые 4 кнопки на панели настрое инструмента Slice Select работают в случае наложения фрагментов (накладываться могут только созданные пользователем) – перемещают на передний план, ближе, дальше, на задний план. Promote присваивает выделенному автоматически созданному фрагменту статус созданного пользователем. Divide дробит фрагмент по вертикали/горизонтали на заданное количество новых. Следующая группа отвечает за выравнивание фрагментов, Hide Auto Slices скрывает созданные автоматически фрагменты. Последняя кнопка вызывает окно настройки выделенного фрагмента, его можно также вызвать с помощью контекстного меню Edit Slice Options.

Существуют 3 типа фрагментов: Image (изображение), No Image (текст), Table (таблица); причём с последним можно работать только в Image Ready. Эти типы будут важны при сохранении в виде html. Url используется для добавления ссылки к изображению, Target – параметр, определяющий класс окна, в котором будет открываться ссылка (blank/self/parent/top). Message text – текст, который будет располагаться внизу браузера в Status Bar, Alt – текст отображаемый вместо изображения (если оно ещё не загрузилось, если изображения отключены, или произошла ошибка). Если выбрать тип No Image то можно будет ввеcти текст вместо изображения, но он будет виден только после сохранения.

Давайте немного попрактикуемся и создадим интерактивное изображение с помощь Slice tool. Например, попробуем создать подобие панели History (просто в голову ничего не пришло). Нам понадобятся 2 скриншота этой панели. Для начала выделим все активные части, при щелчке на которые что-либо должно измениться, возьмём четыре.