Як різати зображення для сайту у Photoshop
У процесі створення веб-сайту може виникнути потреба розрізати одне велике зображення на декілька маленьких. Навіщо це потрібно? По-перше, з міркувань дизайну сторінки. По-друге, не завжди всі частини зображення потрібні і за рахунок різання можна зменшити загальний розмір усіх шматочків, викинувши непотрібні частини зображення. Крім того, дивлячись під час завантаження сторінки на швидку появу цих «шматочків», які завантажуються паралельно, створюється враження швидкого завантаження сторінки. Хоча за нинішніх швидкостей інтернету це вже не так актуально, як раніше. Розглянемо, як зробити різання зображень у Photoshop. Використовується версія СS4.
Для початку активізуємо палітру Info (F8) — адже нам потрібно знати розміри областей різання. З цією ж метою можна зробити видимими лінійки (Ctr+R). Вибираємо інструмент Slice (клавіша "К"). Розставляємо цим інструментом квадратні області різу, контролюючи, якщо необхідно, їх розміри по лінійках та на палітрі Info. Після завершення цих дій з'явиться певна кількість областей різу, кожна з яких матиме свій номер, і позначена конвертиком у верхньому лівому куті. Потім, вибравши інструмент Slice Select, можна налаштувати будь-яку з областей. Клацнувши 2 рази мишею на конвертику, можна викликати меню Slice Options, задати кожній області ім'я, яке після оптимізації стане ім'ям файлу, та інші атрибути — url, target і т. д. Це все потрібно в тому випадку, якщо зберігатися всі частини будуть відразу в HTML файл. Якщо ж ні — можна не зазирати до цього меню. Видалити існуючу область можна, клацнувши на ній правою кнопкою миші і вибравши в меню Delete Slices. А щоб з'єднати дві сусідні області, необхідно виділити їх по одній з натиснутою клавішею Shift і в тому ж меню вибрати Combine Slices.
Післянатискання Save, у вікні «Save Optimized As» вибираємо один з варіантів збереження результатів різання. У списку "Тип файлу" можна вибрати "HTML and Images", "Images Only" та "HTML Only". У першому випадку збереження відбудеться у вигляді html-файлу, в який будуть впроваджені всі збережені зображення, розміщені в окремій папці Images. У другому — збережуться лише самі порізані та оптимізовані файли. Вибравши третій варіант, ви збережете лише html-файл. Крім того, у списку Slices можна вибрати опцію збереження всіх сегментів відразу (All Slices) або виділених в даний момент сегментів (Selected Slices). Ось, у принципі, і все.