Порізка макета

Запустіть програму Adobe Photoshop і відкрийте у ньому макет сайту з продажу футболок (jpg).

Для вирізання елементів використовується інструмент "Скальпель" (гаряча клавіша c).

При вирізанні слайсів одразу задавайте їм імена (подвійний клік по слайсу чи клік із зажатим ctrl).

Якщо в макеті є подібні елементи - виріжте один, дайте йому ім'я, далі - копіюйте цей слайс, тримаючи клавішу alt.

В першу чергу вирізайте фотографії, іконки, логотипи, відключіть всі фони, щоб тло було "прозоре" (шахматний фон). Збережіть ці зображення, включіть всі фони і вимкніть шари з текстом та вирізаними зображеннями, розмітьте і збережіть всі фони.

Щоб видалити всі слайси - можна скористатися пунктом меню View > Remove slices або Просмотр > Удалить фрагменты.

Збереження зображень, типи файлів

Для збереження вирізаних слайсів скористайтеся пунктом меню чи гарячими клавішами:

У цьому вікні потрібно підібрати формати файлів, якість стиснення для кожного слайса.

Для зручності - виділяйте декілька подібних слайсів, утримуючи shift.

Формати файлів:

JPG - для фотографій, великих фонових зображень;

PNG - для елементів дизайну, іконок, всіх елементів з прозорістю;

GIF - для дуже маленьких елементів з малою кількістю кольорів.

Для формату JPG вибирайте якість 60-70 для невеликих, неякісних зображень, розпливчастих, блідих фонів, 80-90 - для чітких, крупних, хороших зображень.

Червоні кольори більше за інших створюють "артефакти" в форматі стиснення JPEG, тому при значних кількостях червоного кольору та різких переходів до контрасних до нього кольорів бажано підвищити якість збереження.

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