Слои (Layers)

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

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

Управлять отображением того или иного слоя можно с помощью соответствующей опции на панели управления слоями (Layers) справа. Эта опция работает по принципу чекбокса – наличие изображения глаза говорит о том, что слой будет отображаться.

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

Используя обычное выделение, изображение нужно будет поместить в буфер обмена, а затем в новое окно (пункт меню File -> New или Ctrl+N) для дальнейшего его сохранения в нужном формате. Однако, следует иметь ввиду, что в обычной ситуации, в буфер обмена попадет только содержимое активного в данный момент слоя, а не то что мы видим на экране. Таким образом, логично предположить, что перед тем как копировать изображение в буфер обмена, общее изображение должно быть плоским, т.е. состоять из одного слоя. Для того чтобы объединить все слои в один, существует опция меню Layer -> Flatten Image или Alt+Shift+Ctrl+F, если клавиши уже настроены). Она может быть использована для временного объединения слоев при выделении нужного изображения. Вернуть исходную разбивку по слоям можно с помощью опции History в закладке History справа. Есть более быстрое решение этой проблемы – комбинация горячих клавиш Ctrl+Shift+C, которая позволяет скопировать в буфер обмена содержимое всех слоев одновременно для выделенного фрагмента.

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

Принятие решения: текст – картинка

Очень часто у новичков возникает вопрос – делать ли очередную надпись в виде текста или в виде графического изображения? Если текст выполнен с использованием стандартного шрифта и без хитрых эффектов вроде теней и пр., то предпочтение следует отдавать тексту. В противном случае – это изображение.

Иногда к проекту идут специальные требования в отношении того, где должен быть текст, а где графика. Это особенно касается HTML-верстки для систем динамического наполнения контента (CMS). Если вы не уверены в этом вопросе, или сомневаетесь относительно конкретной ситуации, обратитесь к своему менеджеру проекта.

Список стандартных шрифтов в разделе