До Вашої уваги черговий урок курсу зі створення дизайну сторінки сайту в програмі Photoshop з дивною назвою - розкроювання. Чого кроїти то будемо? А макет сайту, створений на попередньому уроці! Чому не різати? А тому, що в фотошопі є для цих цілей інструмент з назвою раскройка. Ось їм і крою ...
Ну ось, макет макет головної сторінки сайтаготов, залишилося його порізати. Навіщо різати? Справа в тому, що графічні зображення завантажуються браузерами тим швидше, чим вони менші. Тому сторінка сайту завантажиться швидше, якщо буде складатися з окремих фрагментів. На які ми її і поріжемо.
Для цього можна користуватися двома інструментами - Рамка і Раскройка. Я користуюся розкрою. Цей інструмент ріже набагато точніше, що для нашого макета дуже стане в нагоді.
Отже, для початку поділимо наш макет напрямними на потрібні нам частини за розмірами, які ми запланували а саме: шапка (header) - висота 170 пікселів, ширина - по ширині сторінки, земельна ділянка (futer) - висота 140 пікселів, ширина - по ширині сторінки , все інше нас не цікавить.
Для цього активуємо інструмент Раскройка. ставимо кінчик «ножа» курсору верхній лівий кут шапки і, затиснувши ліву клавішу мишки, тягнемо рамку до правого нижнього кута. Відпускаємо клавішу. Ось і виділили фрагмент 1. Не вийшло? Скасуйте дію в меню Редагування - Крок назад і повторіть заново.
Точно так же виділяємо футер:
Далі, ці виділені фрагменти головної сторінки сайту, потрібно зберегти. І не просто зберегти, а зберегти спеціальномдля web-сторінок форматі, що з успіхом робить Photoshop. Для цього йдемо в меню Файл - Зберегти для WEB і пристроїв. де вам запропонують зберегти все це з певними параметрами і форматом.
Які бувають формати зображень і який вибрати Ви можете дізнатися, якщо прочитаєте статтю Дизайн сайту в Photoshop. формати зображень
Вибрали параметри збереження? Тиснемо Зберегти. Тут вам запропонують вибрати під яким ім'ям і де зберігати. Ну, де зберігати - вам видніше, а ось ім'я потрібно вибрати правильно. Дотримуйтеся нескладного правила: імена повинні складатися маленьких англійських букв (нижній регістр) без пробілів, можна додавати цифри. Ось так, наприклад: fon.jpg або fon1.jpg. І ще, давайте імена так, щоб в них була прив'язка до об'єкту. Якщо це шапка - назвіть shapka або header. Вам же потім буде легше розбиратися, що до чого відноситься. Ми назвемо фрагменти fon.
Далі - тип файлу у нас поставлено, настройки - за замовчуванням, фрагменти - тут можна вибрати, як вам зберігати фрагменти все разом або окремо. Якщо хочете окремо - закрийте вікно збереження і за допомогою інструменту Виділення фрагмента позначте фрагмент, який ви будете зберігати. Фрагменти зберігаються в папці images.
Це ще не все. Для створення фону нам потрібно зробити ще один фрагмент. В панелі Історія знайдіть варіант сторінки без розмітки. Зайдіть в панель шарів і вимкніть шари, залишивши тільки шар з фоном. Для цього поклацати по «очам» на шарах в панелі шарів. За допомогою інструментів Раскройка або Рамка виділяємо вертикальну смужку по всій висоті сторінки, шириною 10 пікселів і зберігаємо так само, як і попередні фрагменти.
Всі фрагменти зберемо в одній папці з назвою images:
мене при збереженні в веб викидає з фотошопа ...