- Перевагами і зручностями користування цього модуля є такі корисні і потрібні можливості як:
- Опис опцій:
Всім привіт! Я радий Вас бачити на моєму блозі ps-blog.ru , Який присвячений урокам для початківців користувачів за програмою Фотошоп. Нагадую, що в минулому статті ми навчилися завантажувати шрифти в Фотошоп, всім хто ще її не читав цю статтю рекомендую з нею ознайомиться.
Сьогодні ми продовжимо вивчати основи Фотошоп, тема сьогоднішнього уроку Як підготувати фото для інтернету. Можливо, у Вас відразу виникли питання, для чого і навіщо фото готувати для інтернету? Можна ж просто взяти завантажити і все.
Так, дійсно в деяких випадках можна просто взяти завантажити і все, але це тягне за собою масу проблем і незручностей. Нижче я навів 5 причин чому потрібно готувати фото для інтернету:
Велика вага зображення. Якщо Ви наприклад розмістіть у себе на сайті фото яке важить кілька мегабайтів, по-перше Ви перевантажуєте і порушуєте роботу свого сервера, по-друге у Вас дуже довго буде вантажиться сторінка, де Ви розмістили свою картинку. А це сильно впливає на відвідуваність сайту. Запам'ятайте, люди не люблять відвідувати сайти які гальмують і довго вантажаться.
Під час верстки веб-дизайну, все елементи макету майбутнього сайту (картинки в форматі .png і .jpg) обов'язково готуються для інтернету, без цього верстка неможлива.
Неправильні пропорції фотографії, які призводять до спотворення. Цей пункт я думаю не має потреби в роз'яснення.
Висока втрата якості зображення. Коли Ви завантажуєте свої нові фотознімки наприклад в соціальні мережі або на інтернет аукціони, то напевно Ви помітили, що вони стають не такі чіткі, кольорові, контрастні як були спочатку. Справа в тому, що коли ви завантажуєте свої зображень на
будь-які інтернет ресурси, вони автоматично стискають і погіршують якість ваших зображень.
У деяких ситуаціях потрібно завантаження зображення певного розміру і формату. Наприклад Вам потрібно завантажити іконку 16 × 16 пікселів в форматі .png для свого сайту. Все це легко і просто можна зробити в Фотошоп.
З усіма цими завданнями чудово справляється наша улюблена програма Adobe Photoshop CC. Розробниками Фотошоп був придуманий дуже корисний і потрібний модуль з функцією збереження зображень для інтернету (Save for Web). Це потужний модуль управління процесами оптимізації та збереження документів, який автоматично підбирає оптимальні настройки файлу. Цей модуль підтримує і працює з найпоширенішими форматами файлів для інтернету .jpg, .gif, .png.
Перевагами і зручностями користування цього модуля є такі корисні і потрібні можливості як:
вибір декількох режимів перегляду під час оптимізації зображення для web
вибір формату в якому зображення буде збережено
вибір якості і розміру зберігається зображення
вибір способу оптимізації, стиснення і перегляд ваги оптимізованого зображення.
На цьому вся теорія закінчується, переходимо до практики. Для початку давайте відкриємо зображення або фотографію яку будемо зберігати для інтернету. Я буду працювати з цим зображенням:
Для того, щоб перейти до збереження для web, заходимо в верхнє меню Файл / Зберегти для web або скористаємося гарячими клавішами Ctrl + Alt + Shift + S.
Перед нами має відкритися віконце з настройками як показано на скріншоті нижче. Не потрібно боятися великої кількості кнопочок і налаштувань, ми будемо користуватися лише деякою частиною з них і трохи нижче докладно розберемо для чого вони потрібні і як ними користуватися.
Опис опцій:
1. Чотири вкладки варіантів попереднього перегляду.
- Початкове - це коли Ви бачите струму своє вихідне зображення
- Оптимізація - це коли Ви бачите в попередньому перегляді тільки оптимізоване зображення
- 2 Варіанта - це коли Ви бачите своє вихідне зображення вгорі, а оптимізоване внизу. Це варіант найзручніший і найбільше мені подобається, саме тому я його і вибрав.
- 4 Варіанта - це коли Ви бачите в попередньому перегляді вихідне зображення, зображення в якості якому Ви вибрали, зображення в якості 22 і зображення в якості 11.
2. Формат файлу. У нашому випадку ми вибираємо JPEG.
- PNG - формат файлу для збереження Веб-графіки. Буває двох видів, 8 bit -індексірование зображення, 24 bit - «все» кольору. Зазвичай в цьому форматі зберігають кліпарти і логотипи на прозорому тлі.
- GIF - застарілий формат файлу для збереження Веб-графіки. Найчастіше в цьому форматі зберігають файли з обмеженою кількістю квітів, таблиці, схеми, логотипи, так само формат підтримує анімацію і прозорий фон. Цим форматом користуються все менше і менше, тому що з'явився більш кращий формат PNG.
- JPEG - Найпопулярніший формат. Чудово підходить для збереження фотографій і зображень з безліччю квітів, відтінків, ефектів.
3. Значення якості. Мені подобається «Висока».
- Низьке
- Середнє
- Висока
- Дуже висока
- Найкраще
4. Тут ставимо галочку в значення «Оптимізація«. Розглядати і загострювати увагу на опціях «Прогресивний» і «Вбудований профіль«, ми не будемо так як більшість веб-браузерів їх не підтримують.
5. Ставимо галочку для того щоб включити опцію «Перетворити в sRGB«. Це потрібно для того щоб, наше зображення коректно відображалося на веб-сайті і збереглося в колірному просторі sRGB.
6. Виставляємо потрібний розмір зображення. У моєму випадку це, ширина 500 - пікселів, висота - 281 піксель.
7. Розмір оригінального зображення.
8. Розмір оптимізованого зображення для інтернету.
Думаю тепер Ви розібралися з темою Як підготувати фото для інтернету в Фотошоп і тепер зможете зробити це самостійно. Пам'ятайте, найкраща подяка для автора це лайки, репости в соціальних мережах і коменти на сайті 
До зустрічі в наступних уроках!
