Графика для дизайна

Продолжаем работу над макетом web-страницы. Чтобы сохранить полученные слайсы, используем команду File > Save for Web & Devices… Слайс, который нужно сохранить, выделите при помощи Slice Select Tool (k). Чтобы выбрать несколько блоков, удерживайте Shift. Параметры сохранения изображений можно выбрать на панели справа. Если число цветов у изображения невелико и есть много однотонных областей, можно использовать формат GIF. Для сохранения изображений с несколькими цветами подходит JPEG, а если вас интересует сохранение прозрачности в изображениях, ваш формат – PNG (правда, он не всегда корректно отображается в Internet Explorer). В принципе, можете поэкспериментировать с настройками и выбрать, какой из форматов вас больше устраивает.

Нажмите на картинку для увеличения

Укажите место для сохранения слайсов, например, рабочий стол, а в поле Format выставьте значение Images Only. После этих манипуляций на вашем рабочем столе должна появиться папка «Images», в которой вы найдете ставшие изображениями слайсы.

Нажмите на картинку для увеличения

После этого воспользуйтесь командой View > Guides > Clear Guides и очистите все направляющие. Затем вокруг объектов, которые вы теперь собираетесь разрезать, нарисуйте новые направляющие. Если вы наведете указатель на меню, оно поменяет свой цвет. Нарезку нужно делать для всех оттенков, которые вы используете.

Нажмите на картинку для увеличения

Опять выберите те слайсы, которые хотите сохранить. Если для навигации вы хотите использовать обычные шрифты, то для ее оформления используйте HTML.

Нажмите на картинку для увеличения

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

Как вариант, вы можете все слайсы экспортировать вместе, а при редактировании страницы нужные включать или отключать.

Еще один метод создания слайсов – выделение объекта и применение команды Object > Slice > Create from Selection. Стоит попробовать оба способа и выбрать для себя тот, который для вас более удобен.

Нажмите на картинку для увеличения

Если текст, написанный непосредственно в Illustrator, вам не нужен, вы его можете просто удалить перед экспортом слайсов, и, пожалуй, все готово.

Как видите, создание макета web-страницы в Adobe Illustrator не сложнее, чем в Photoshop. Так что выбирайте, какой редактор вам больше по душе.