Як оптимізувати зображення вашого блогу або веб-сайту за допомогою GIMP
Якщо у вас є блог або веб-сайт, вам потрібно буде включити зображення як частину вмісту. Якщо ці зображення не оптимізовані, інакше кажучи, займають занадто багато місця, ваш блог або веб-сайт буде дуже повільно. У цьому дописі я збираюся вам розповісти як оптимізувати зображення вашого блогу або веб-сайту за допомогою GIMP.
Якщо ваш веб-сайт є повільний тому що ви використовуєте неоптимізовані зображення (якісне зображення з роздільною здатністю 3000 x 2000 пікселів може легко перевищувати 3 МБ), поганий досвід перегляду, який матимуть читачі вашого блогу або користувачі вашого веб-сайту це матиме дуже негативний вплив на результати вашого веб-сайту. Якщо це блог, ваші читачі відмовляться від нього, коли побачать, що остання публікація, яку ви опублікували, не завершилась. Якщо це веб-сайт, де ви продаєте певний вид товару чи послуги, ваші клієнти перейдуть на змагання.
Ви також не повинні пропустити, що ще одним негативним ефектом вашого веб-сайту, який вимагає часу для завантаження, є те Google не любить повільних сайтів. Одним із факторів, який Google враховує при розміщенні сайту, є час завантаження. Якщо час завантаження надмірний, Google врахує це негативно у своєму алгоритмі позиціонування.
Ось чому, якщо ви не хочете збільшувати час завантаження свого сайту або негативно впливати на його позиціонування в Google, ви повинні використовувати оптимізовані зображення. Немає сенсу завантажувати зображення на свій сайт у оригінальному розмірі та з найвищою якістю. Ну, існує досить багато додатків для оптимізації зображень, але в цій публікації я розповім вам, як це зробити за допомогою GIMP.
Що таке GIMP і де я його можу отримати?
GIMP - це абсолютно безкоштовна програма для цифрового редагування зображень. Він доступний для більшості операційних систем і кількома мовами, включаючи іспанську. Ви можете завантажити його з http://www.gimp.org/downloads Y його установка дуже проста.
Плагіни для оптимізації зображень для Інтернету
Після встановлення GIMP наступне, що нам потрібно зробити, це встановіть плагін для оптимізації зображень для Інтернету. Я знаю двох, і саме про них я розповім вам у цій публікації. Не обов’язково використовувати обидва.
Перший - це Зберегти для Інтернету і ви можете завантажити його з http://registry.gimp.org/node/33. Завантаживши його, ви повинні розпакувати вміст ZIP-файлу в папку плагінів GIMP користувача операційної системи. У моєму випадку, коли я використовую Windows 7, я розпаковую zip-файл, який я завантажив у C: \\ Users \\ Jarfer \\. Gimp-2.8 \\ плагіни.
Другий плагін - Збережіть для Інтернету за допомогою RIOT і робить те саме, що вище, але використовує файл Алгоритм RIOT (Інструмент радикальної оптимізації зображення), який дозволяє додатково вдосконалити вашу оптимізацію. Ви можете завантажити його з http://registry.gimp.org/node/20778 і я рекомендую вам завантажити інсталятор замість zip-файлу, оскільки за допомогою інсталятора установка плагіна набагато простіша. Після завантаження інсталятора ви запускаєте його, а сам інсталятор дбає про копіювання всіх файлів, необхідних плагіну, у папку плагінів GIMP вашого користувача. Якщо ви не використовуєте програму встановлення, крім того, що потрібно розпакувати вміст ZIP-файлу всередині папки плагінів вашого користувача GIMP, вам доведеться завантажити ще пару додаткових бібліотек і скопіювати їх вручну в ту саму папку. У будь-якому випадку кінцевий результат буде однаковим, але я думаю, що простіше користуватися програмою встановлення.
Після встановлення плагінів ми можемо отримати до них доступ через Головне вікно GIMP Меню Файл.
Формати зображень для Інтернету
Перш за все, ви повинні знати, що три найбільш часто використовувані формати зображень для Інтернету JPG, PNG та GIF. Нижче я розповім вам, який формат є найбільш підходящим для кожного випадку:
- Формат JPG: Це формат найкраще підходить для фотографічних зображень з великою кількістю деталей і в якому ми не проти втратити частину якості вихідного зображення в обмін на отриманий файл, що має значно менший розмір.
- Формат PNG: У цьому форматі, на відміну від формату JPG, використовується алгоритм стиснення без втрат, тобто інформація із зображення не відкидається, тому формат найкраще підходить для зображень з невеликими варіаціями кольорів та великих площ із однотонними кольорами такі як знімки екрана, логотипи чи графічні зображення загалом. Якщо зображення не має забагато кольорів (близько 256 або менше), його можна зберегти Формат PNG-8, який має той самий формат PNG, але з індексованою палітрою кольорів, який додатково зменшує розмір зображення.
- Формат GIF: Це формат, подібний до PNG, але з деякими недоліками щодо нього, що робить його не використовується і лише використовувати для анімованих зображень.
Кроки для оптимізації зображень для Інтернету за допомогою GIMP
Після того, як ми встановили GIMP і додали плагіни, що дозволяють оптимізувати зображення для Інтернету, кроки для оптимізації зображення за допомогою GIMP є наступними:
- Налаштуйте розмір зображення. Вам не потрібно завантажувати зображення 3000 x 2000 пікселів на свій веб-сайт. У цьому блозі зображення, які я включаю в кожну публікацію, відображаються на екрані з максимальною шириною 640 пікселів, тому будь-яке зображення, яке я хочу додати, що перевищує цю ширину, зменшую його до 640 пікселів у ширину та на відповідну висоту, що дозволяє підтримка співвідношення ширини та висоти вихідного зображення. Просто зменшивши розмір зображення до кількості пікселів, за допомогою яких ви збираєтесь відображати його на своєму веб-сайті, ви значно зменшите розмір файлу зображення. Щоб відрегулювати розмір зображення, ви можете використовувати будь-який із вказаних мною плагінів або зробити це за допомогою Опція масштабування зображення GIMP. Цей параметр є в Головний екран GIMP Меню зображення.
- Використовуйте опцію Зберегти для Інтернету або Зберегти для Інтернету з RIOT, щоб оптимізувати зображення.
Для фотографічного зображення з великою кількістю деталей використовуйте формат JPG та відрегулюйте якість зображення так що, не втрачаючи занадто багато якості, розмір файлу зображення значно зменшується. З якістю від 80 до 90% порівняно з якістю оригінального зображення, вага зображення, коли його розмір відрегульований у пікселях, може бути легко зменшена від 10 до 50 разів або навіть більше, залежно від зображення. На наступному зображенні ви можете побачити, як фотографія, яка займає більше 700 КБ, зменшується до приблизно 20 КБ при стисненні з якістю 80% порівняно з оригіналом. У цьому прикладі я використовую плагін Збережіть для Інтернету за допомогою RIOT.
Для зображення з невеликими варіаціями кольорів та великих площ із однотонними кольорами, як, наприклад, графічне зображення, як перше зображення цього повідомлення, використовувати формат PNG. Якщо крім того, зображення не має забагато кольорів (близько 256 або менше) або кількість кольорів можна зменшити, не втрачаючи занадто багато якості, Ви можете зменшити вагу зображення, збереживши його у форматі PNG-8 та відрегулювавши кількість кольорів для використання. На наступному зображенні ви можете побачити, як зменшено перше зображення цієї публікації з 32,5 КБ до 11,6 КБ за допомогою плагіна Зберегти для Інтернету і збереження його в Формат PNG-8.
Нарешті, якщо ваш веб-сайт є блог з WordPress, Ви можете встановити плагін у WordPress WP Smush.it хто використовує безкоштовний сервіс від Yahoo Smush.it для оптимізації зображень. Хоча у мене встановлений WP Smush.it, я волію оптимізувати зображення за допомогою GIMP, перш ніж завантажувати їх у блог. Плагін зазвичай виконує другу оптимізацію в тих випадках, коли мою оптимізацію за допомогою GIMP можна покращити, а також гарантує, що оптимізація зображення завжди проводиться, якщо з якихось причин я раніше цього не робив з GIMP.
Ви знали GIMP? Ви коли-небудь використовували його для оптимізації зображень для Інтернету? Чи знали ви плагіни Зберегти для Інтернету або Збережіть для Інтернету за допомогою RIOT? Як оптимізувати зображення, які ви використовуєте на своєму веб-сайті?
Якщо ця публікація була вам корисною, поділіться нею в соціальних мережах. Це буде корисно іншим, і мені буде добре дати про себе знати. Дуже дякую!